Pro for BrujitaMalvada (Sakura)

/* Profile by AlthIndor */

:root {
  --atlas: url('https://images2.imgbox.com/e5/1c/qAnv8ou3_o.png');
  --pink-lite: #F88AA8;
  --purp-lite: #8466A2;
}

html, body {background: none;}
body a {transition: all .5s ease-in-out;}

#column_1 .panel {background: var(--atlas) 0 0 border-box, var(--atlas) 0 0 border-box;}
.custom_panel b i {background: var(--atlas) 0 -470px;}
#column_1 #id_about {background-position: 0 0, 0 -320px;}
#column_1 #id_comments {background-position: 0 0, 0 -357px;}
#column_1 #id_wishlist {background-position: 0 0, 0 -394px;}
#column_1 #id_footprints {background-position: 0 0, 0 -431px;}

/* Fonts */

@font-face {
  font-family: 'Shojumaru';
  font-style: normal;
  font-weight: 400;
  src: local('Shojumaru'), local('Shojumaru-Regular'), url(https://fonts.gstatic.com/s/shojumaru/v8/rax_HiWfutkLLnaKCtl8Axhf.woff2) format('woff2');
}

@font-face {
  font-family: 'Courier Prime';
  font-style: normal;
  font-weight: 400;
  src: local('Courier Prime Regular'), local('CourierPrime-Regular'), url(https://fonts.gstatic.com/s/courierprime/v2/u-450q2lgwslOqpF_6gQ8kELawFpWg.woff2) format('woff2');
}

@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: local('Open Sans'), local('OpenSans'), url(https://fonts.gstatic.com/s/opensans/v15/mem8YaGs126MiZpBA-UFVZ0b.woff2) format('woff2');
}

@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 700;
  src: local('Open Sans Bold'), local('OpenSans-Bold'), url(https://fonts.gstatic.com/s/opensans/v17/mem5YaGs126MiZpBA-UN7rgOUuhp.woff2) format('woff2');
}

/* Header */

#gaia_header, #gaia_header #header_left, #gaia_header #header_right {box-sizing: border-box;}
#gaia_header li.spacer {display: none !important;}

#gaia_header {
  background: none !important;
  border: 10px solid transparent;
}

#gaia_header #header_left, #gaia_header #header_right {
  background: #000000C0 padding-box;
  width: auto !important;
  font: 0/31px 'Shojumaru', serif !important;
  height: 32px !important;
  border: 1px solid #FFFFFFC0;
  box-shadow: 0 0 0 1px #000, 0 2px 5px #000;
  overflow: hidden;
}
#gaia_header #header_right {float: right;}

#gaia_header img {
  background: url('https://i.imgur.com/5FTB40o.png') 0 4px no-repeat;
  width: 0 !important;
  padding: 0 37px 0 0;
  filter: drop-shadow(0 1px 1px #000);
}

#gaia_header a {
  background: linear-gradient(to right, var(--pink-lite) 2px, transparent 2px, transparent calc(100% - 2px), var(--pink-lite) calc(100% - 2px)) no-repeat left center / 100% 4px;
  color: #FFFFFF !important;
  font-size: 11px !important;
  font-weight: 400 !important;
  text-decoration: none;
  text-shadow: 0 1px 2px #000;
  text-transform: uppercase;
  padding: 11px 10px 10px 10px;
}
#gaia_header a:hover {background-color: var(--purp-lite);}

#header_left li:nth-of-type(2) a, #header_right li:nth-of-type(1) a {background-image: linear-gradient(to left, var(--pink-lite) 2px, transparent 2px);}
#gaia_header li:last-of-type a {background-image: linear-gradient(to right, var(--pink-lite) 2px, transparent 2px);}

/* Columns */

#columns, #columns .column {
  float: none;
  font-size: 0;
  margin: 0;
  position: absolute;
}
#column_3 {display: none;}

#columns, #column_1 {
  width: 580px;
  height: 320px;
}
#column_1 {overflow: visible;}

#columns {
  padding: 20px;
  top: calc(50% - 160px - 20px);
  left: calc(50% - 290px - 20px);
}

/* Scrollbars */

.panel::-webkit-scrollbar {
  background: #FF000010;
  width: 7px;
}

.panel::-webkit-scrollbar-thumb {
  background: #000000C0 content-box;
  border-right: 1px solid transparent;
}

.panel {
  scrollbar-color: #000000C0 #FF000010;
  scrollbar-width: thin;
}

/* Panels */

.panel, .panel h2 {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}
#column_2 .panel, .panel h2 {position: fixed;}
#column_2 h2 {display: none;}

.panel {
  color: #181818;
  font: 10px/1.6 'Open Sans', sans-serif;
  text-align: justify;
  overflow: hidden;
}
#id_about img, #id_comments .postcontent img {max-width: 100%;}

.panel a {
  color: var(--purp-lite);
  text-decoration: dotted underline;
}
.panel a:hover {color: var(--pink-lite);}

#column_1 .panel, .custom_panel, .custom_panel div {
  width: 100%;
  height: 100% !important;
  left: 0;
}

#column_1:hover .panel, #column_1 .panel:hover {transition: top 0s linear 0s;}
#column_1 .panel:hover {top: 0;}

#column_1 .panel {
  padding: 0 10px;
  top: -200%;
  border: 1px solid transparent;
  border-width: 38px 5px 6px 6px;
  box-shadow: 0 4px 10px #000;
  position: absolute;
  overflow-y: scroll;
  transition: top 0s linear 9999s;
}

/* Fake Border Without Affecting Scrollbars */

#column_1 .panel::before, #column_1 .panel::after {
  content: '';
  display: block;
  background: #FFFFFF;
  width: 100%;
  height: 10px;
  position: sticky;
  left: 0;
}
#column_1 .panel::before {top: 0;}
#column_1 .panel::after {bottom: 0;}

/* Panel Headers, Store, Media */

.panel h2, .media_panel, #id_store {
  height: 32px !important;
  color: #FFFFFF;
  font: 11px/30px 'Shojumaru', serif;
  text-align: center;
  text-shadow: 0 1px 2px #000;
  bottom: 10px;
  border: 1px solid #FFFFFFC0;
  box-shadow: 0 0 0 1px #000, 0 2px 5px #000;
  z-index: 9;
}
.media_panel, #id_store {transition: background-color .5s ease-in-out;}
.panel:hover h2, .media_panel:hover, #id_store:hover {background-color: var(--purp-lite);}

#column_1:hover .panel h2, .panel:hover h2 {transition: background-color .5s ease-in-out 0s, z-index 0s linear 0s;}
.panel:hover h2 {z-index: 8;}

.panel h2 {
  background: #000000C0;
  width: 100px;
  transition: background-color .5s ease-in-out 9999s, z-index 0s linear 9999s;
}

#id_about h2 {left: calc(50% - 278px);}
#id_comments h2 {left: calc(50% - 278px + 110px);}
#id_wishlist h2 {left: calc(50% - 278px + 220px);}
#id_footprints h2 {left: calc(50% - 278px + 330px);}

/* Sticky Tabs Functionality */

#column_1::before {
  content: '';
  width: 430px;
  height: 32px;
  position: fixed;
  bottom: 10px;
  left: calc(50% - 278px);
}

#column_1:hover .panel h2::before, .panel:hover h2::before {transition: height 0s linear 0s;}
.panel:hover h2::before {height: 62px;}

.panel h2::before {
  content: '';
  width: 100%;
  height: 0;
  position: fixed;
  bottom: 0;
  left: 0;
  transition: height 0s linear 9999s;
}

/* Store */

#id_store {
  background: url('https://i.imgur.com/R9wla40.png') center 0 / 30px auto #000000C0;
  width: 32px;
  left: calc(50% - 278px + 440px);
}
#id_store h3, #id_store h2 ~ div, #id_store h2 ~ p:first-of-type {display: none;}

#id_store p, #id_store a {
  display: block;
  width: 100%;
  height: 100%;
  font-size: 0;
}
#id_store p {margin: 0;}

/* Comments */

#id_comments #alerts_banner {display: none;}
#id_comments a {text-decoration: none;}
#id_comments dd {margin: 0 0 15px 0;}
#id_comments dd:last-of-type {margin: 0;}

#id_comments dl {
  clear: both;
  margin-top: 45px;
}

#id_comments dt {
  height: auto;
  line-height: normal;
  padding: 0 0 4px 0;
  margin: 0 0 3px 0;
  border-bottom: 1px dotted #00000040;
}

#id_comments .date {
  color: #808080;
  font: 9px 'Courier Prime', monospace;
  text-transform: uppercase;
}
#id_comments .date a, #id_comments .date::before {text-indent: 0;}
#id_comments .date a {font-weight: 400;;}

#id_comments .dropBox {
  background: pink;
  width: 48px;
  height: 54px;
  margin: 5px 10px 1px 1px;
  border: 1px solid #FFFFFF;
  box-shadow: 0 0 0 1px #000;
  overflow: hidden;
}

#id_comments .dropBox img {
  width: 120px;
  height: 150px;
  margin: -26px 0 0 -44px;
}

#id_comments .deletecomment {
  text-align: right;
  margin: 0 0 0 10px;
}

/* Comments Links */

#id_comments h2 + div, #id_comments h2 ~ p {
  float: left;
  background: #000000C0 content-box;
  width: calc(50% - 5px);
  height: 30px;
  font: 0/30px 'Shojumaru', serif;
  text-align: center;
  position: relative;
  border: 1px solid #000000C0;
  box-shadow: 0 0 0 1px #FFFFFF inset;
  transition: background .5s ease-in-out;
}
#id_comments h2 + div:hover, #id_comments h2 ~ p:hover {background: var(--pink-lite);}
#id_comments h2 + div {float: left;}

#id_comments #alert_container {
  float: none;
  padding: 0;
}

#id_comments h2 ~ p {
  float: right;
  margin: 0;
}

#id_comments h2 + div a, #id_comments h2 ~ p a {
  display: block;
  width: 100%;
  height: 100%;
  color: #FFFFFF;
  font-weight: 400;
  text-transform: uppercase;
}

#id_comments h2 + div a::after, #id_comments h2 ~ p a::after {font-size: 9px;}
#id_comments h2 + div a::after {content: 'Leave Me A Comment';}
#id_comments h2 ~ p a::after {content: 'View More Comments';}

/* Wish List */

#id_wishlist {padding-right: 0;}
.premium_sparkle, .owner_checkmark {margin: 0;}

.premium_sparkle {
  top: 4px;
  right: 2px;
}

.owner_checkmark {
  bottom: 6px;
  left: 6px;
}

#id_wishlist .item {
  background: #88441060;
  width: 30px;
  height: 30px;
  padding: 5px;
  margin: 0 11px 0 0;
  position: relative;
  border: 2px solid transparent;
  border-radius: 50%;
  box-shadow: 0 0 0 1px #FFFFFF inset;
  outline: 1px dotted saddlebrown;
  outline-offset: -6px;
  transition: all .5s ease-in-out;
}
#id_wishlist .item:nth-of-type(n+11) {margin-top: 9px;}
#id_wishlist .item:nth-of-type(10n+10) {margin-right: 0;}

#id_wishlist .item:hover {
  background: var(--pink-lite);
  outline-color: var(--purp-lite);
}

/* Visitors */

#id_footprints .item {
  display: grid;
  grid-auto-flow: column;
  justify-content: start;
  line-height: 1.82;
}

#id_footprints .item::before {
  content: ' visited ';
  white-space: pre;
  grid-column: 2 / span 1;
}

/* Media */

.media_panel {
  background: url('https://i.imgur.com/gqTTTvw.png') -20px -7px #000000C0;
  width: 74px;
  left: calc(50% - 278px + 440px + 32px + 10px);
}

.media_panel iframe {
  width: 360px;
  height: 240px;
  position: absolute;
  bottom: -2px;
  left: -20px;
  opacity: .01;
}

/* Animated Petals */

.custom_panel, .custom_panel div {
  width: 100%;
  height: 100% !important;
  left: 0;
}
.custom_panel div {mix-blend-mode: color-dodge;}

.custom_panel {
  background: url('https://i.imgur.com/lgznVJl.jpg') fixed 0 0 / cover;
  top: 0;
  z-index: -1;
  pointer-events: none;
}
.custom_panel .clear, .custom_panel br {display: none;}
.custom_panel b, .custom_panel i {display: block;}

@keyframes PetalDriftLeft {
  0% {transform: translate(0, 0);}
  100% {transform: translate(-20vw, calc(100vh + 100px));}
}

@keyframes PetalDriftRight {
  0% {transform: translate(0, 0);}
  100% {transform: translate(20vw, calc(100vh + 100px));}
}

@keyframes PetalRotate {
  0% {transform: rotate(0turn);}
  100% {transform: rotate(1turn);}
}

@keyframes PetalRotateSmall {
  0% {transform: rotate(0turn) scale(.5);}
  100% {transform: rotate(1turn) scale(.5);}
}

.custom_panel b {
  position: absolute;
  top: -50px;
  animation: PetalDriftLeft 10s linear infinite;
}
.custom_panel b:nth-of-type(odd) {animation-name: PetalDriftRight;}

.custom_panel b i {animation: PetalRotate 20s linear infinite;}
.custom_panel b:nth-of-type(3n) i {animation-name: PetalRotateSmall;}
.custom_panel b:nth-of-type(odd) i {animation-direction: reverse;}

.custom_panel b:nth-of-type(7n) i {
  width: 30px;
  height: 29px;
}

.custom_panel b:nth-of-type(7n+1) i {
  background-position-x: -50px;
  width: 29px;
  height: 31px;
}

.custom_panel b:nth-of-type(7n+2) i {
  background-position-x: -100px;
  width: 23px;
  height: 33px;
}

.custom_panel b:nth-of-type(7n+3) i {
  background-position-x: -150px;
  width: 21px;
  height: 36px;
}

.custom_panel b:nth-of-type(7n+4) i {
  background-position-x: -200px;
  width: 45px;
  height: 34px;
}

.custom_panel b:nth-of-type(7n+5) i {
  background-position-x: -250px;
  width: 43px;
  height: 38px;
}

.custom_panel b:nth-of-type(7n+6) i {
  background-position-x: -300px;
  width: 45px;
  height: 48px;
}

.custom_panel b:nth-of-type(01) {left: 073%; animation-duration: 10s; animation-delay: -04.2s;}
.custom_panel b:nth-of-type(02) {left: -06%; animation-duration: 13s; animation-delay: -00.2s;}
.custom_panel b:nth-of-type(03) {left: 003%; animation-duration: 13s; animation-delay: -08.2s;}
.custom_panel b:nth-of-type(04) {left: 102%; animation-duration: 10s; animation-delay: -03.1s;}
.custom_panel b:nth-of-type(05) {left: 077%; animation-duration: 10s; animation-delay: -07.4s;}
.custom_panel b:nth-of-type(06) {left: 030%; animation-duration: 10s; animation-delay: -04.2s;}
.custom_panel b:nth-of-type(07) {left: 059%; animation-duration: 14s; animation-delay: -05.9s;}
.custom_panel b:nth-of-type(08) {left: -01%; animation-duration: 11s; animation-delay: -02.2s;}
.custom_panel b:nth-of-type(09) {left: 040%; animation-duration: 13s; animation-delay: -02.5s;}
.custom_panel b:nth-of-type(10) {left: 067%; animation-duration: 10s; animation-delay: -08.9s;}
.custom_panel b:nth-of-type(11) {left: -10%; animation-duration: 14s; animation-delay: -03.6s;}
.custom_panel b:nth-of-type(12) {left: 052%; animation-duration: 11s; animation-delay: -08.7s;}
.custom_panel b:nth-of-type(13) {left: 106%; animation-duration: 12s; animation-delay: -04.9s;}
.custom_panel b:nth-of-type(14) {left: 020%; animation-duration: 13s; animation-delay: -08.2s;}
.custom_panel b:nth-of-type(15) {left: 040%; animation-duration: 12s; animation-delay: -10.3s;}
.custom_panel b:nth-of-type(16) {left: 065%; animation-duration: 13s; animation-delay: -08.8s;}
.custom_panel b:nth-of-type(17) {left: 017%; animation-duration: 14s; animation-delay: -02.4s;}
.custom_panel b:nth-of-type(18) {left: 040%; animation-duration: 14s; animation-delay: -06.7s;}
.custom_panel b:nth-of-type(19) {left: 047%; animation-duration: 13s; animation-delay: -02.1s;}
.custom_panel b:nth-of-type(20) {left: 083%; animation-duration: 13s; animation-delay: -12.8s;}
.custom_panel b:nth-of-type(21) {left: 011%; animation-duration: 12s; animation-delay: -03.9s;}
.custom_panel b:nth-of-type(22) {left: 020%; animation-duration: 14s; animation-delay: -12.0s;}
.custom_panel b:nth-of-type(23) {left: 104%; animation-duration: 11s; animation-delay: -02.5s;}
.custom_panel b:nth-of-type(24) {left: -04%; animation-duration: 11s; animation-delay: -04.2s;}
.custom_panel b:nth-of-type(25) {left: 108%; animation-duration: 11s; animation-delay: -07.8s;}
.custom_panel b:nth-of-type(26) {left: 015%; animation-duration: 13s; animation-delay: -02.3s;}
.custom_panel b:nth-of-type(27) {left: 069%; animation-duration: 13s; animation-delay: -12.8s;}
.custom_panel b:nth-of-type(28) {left: 047%; animation-duration: 12s; animation-delay: -09.7s;}
.custom_panel b:nth-of-type(29) {left: 023%; animation-duration: 12s; animation-delay: -10.9s;}
.custom_panel b:nth-of-type(30) {left: 016%; animation-duration: 10s; animation-delay: -02.8s;}
.custom_panel b:nth-of-type(31) {left: 035%; animation-duration: 10s; animation-delay: -00.7s;}
.custom_panel b:nth-of-type(32) {left: 059%; animation-duration: 10s; animation-delay: -08.2s;}
.custom_panel b:nth-of-type(33) {left: 072%; animation-duration: 10s; animation-delay: -04.6s;}
.custom_panel b:nth-of-type(34) {left: 109%; animation-duration: 13s; animation-delay: -07.8s;}
.custom_panel b:nth-of-type(35) {left: 055%; animation-duration: 10s; animation-delay: -04.9s;}
.custom_panel b:nth-of-type(36) {left: 014%; animation-duration: 12s; animation-delay: -05.2s;}
.custom_panel b:nth-of-type(37) {left: 017%; animation-duration: 11s; animation-delay: -00.5s;}
.custom_panel b:nth-of-type(38) {left: -09%; animation-duration: 10s; animation-delay: -01.8s;}
.custom_panel b:nth-of-type(39) {left: -10%; animation-duration: 13s; animation-delay: -12.5s;}
.custom_panel b:nth-of-type(40) {left: 048%; animation-duration: 14s; animation-delay: -09.1s;}
.custom_panel b:nth-of-type(41) {left: -05%; animation-duration: 13s; animation-delay: -10.9s;}
.custom_panel b:nth-of-type(42) {left: -05%; animation-duration: 13s; animation-delay: -10.9s;}

.custom_panel b:nth-of-type(01) i {animation-duration: 21s; animation-delay: -12.4s;}
.custom_panel b:nth-of-type(02) i {animation-duration: 17s; animation-delay: -15.1s;}
.custom_panel b:nth-of-type(03) i {animation-duration: 20s; animation-delay: -10.2s;}
.custom_panel b:nth-of-type(04) i {animation-duration: 17s; animation-delay: -05.8s;}
.custom_panel b:nth-of-type(05) i {animation-duration: 16s; animation-delay: -06.2s;}
.custom_panel b:nth-of-type(06) i {animation-duration: 24s; animation-delay: -18.3s;}
.custom_panel b:nth-of-type(07) i {animation-duration: 21s; animation-delay: -19.4s;}
.custom_panel b:nth-of-type(08) i {animation-duration: 16s; animation-delay: -07.7s;}
.custom_panel b:nth-of-type(09) i {animation-duration: 24s; animation-delay: -05.4s;}
.custom_panel b:nth-of-type(10) i {animation-duration: 22s; animation-delay: -14.0s;}
.custom_panel b:nth-of-type(11) i {animation-duration: 15s; animation-delay: -13.4s;}
.custom_panel b:nth-of-type(12) i {animation-duration: 20s; animation-delay: -12.6s;}
.custom_panel b:nth-of-type(13) i {animation-duration: 16s; animation-delay: -12.8s;}
.custom_panel b:nth-of-type(14) i {animation-duration: 16s; animation-delay: -13.0s;}
.custom_panel b:nth-of-type(15) i {animation-duration: 24s; animation-delay: -01.2s;}
.custom_panel b:nth-of-type(16) i {animation-duration: 17s; animation-delay: -08.5s;}
.custom_panel b:nth-of-type(17) i {animation-duration: 20s; animation-delay: -13.0s;}
.custom_panel b:nth-of-type(18) i {animation-duration: 20s; animation-delay: -19.6s;}
.custom_panel b:nth-of-type(19) i {animation-duration: 18s; animation-delay: -16.0s;}
.custom_panel b:nth-of-type(20) i {animation-duration: 22s; animation-delay: -11.7s;}
.custom_panel b:nth-of-type(21) i {animation-duration: 22s; animation-delay: -12.2s;}
.custom_panel b:nth-of-type(22) i {animation-duration: 22s; animation-delay: -13.6s;}
.custom_panel b:nth-of-type(23) i {animation-duration: 22s; animation-delay: -04.3s;}
.custom_panel b:nth-of-type(24) i {animation-duration: 23s; animation-delay: -02.4s;}
.custom_panel b:nth-of-type(25) i {animation-duration: 17s; animation-delay: -08.1s;}
.custom_panel b:nth-of-type(26) i {animation-duration: 22s; animation-delay: -13.5s;}
.custom_panel b:nth-of-type(27) i {animation-duration: 17s; animation-delay: -11.8s;}
.custom_panel b:nth-of-type(28) i {animation-duration: 15s; animation-delay: -06.4s;}
.custom_panel b:nth-of-type(29) i {animation-duration: 23s; animation-delay: -02.8s;}
.custom_panel b:nth-of-type(30) i {animation-duration: 24s; animation-delay: -16.3s;}
.custom_panel b:nth-of-type(31) i {animation-duration: 18s; animation-delay: -16.3s;}
.custom_panel b:nth-of-type(32) i {animation-duration: 22s; animation-delay: -18.5s;}
.custom_panel b:nth-of-type(33) i {animation-duration: 18s; animation-delay: -10.3s;}
.custom_panel b:nth-of-type(34) i {animation-duration: 22s; animation-delay: -14.9s;}
.custom_panel b:nth-of-type(35) i {animation-duration: 20s; animation-delay: -17.5s;}
.custom_panel b:nth-of-type(36) i {animation-duration: 17s; animation-delay: -02.0s;}
.custom_panel b:nth-of-type(37) i {animation-duration: 15s; animation-delay: -10.6s;}
.custom_panel b:nth-of-type(38) i {animation-duration: 21s; animation-delay: -07.6s;}
.custom_panel b:nth-of-type(39) i {animation-duration: 19s; animation-delay: -15.4s;}
.custom_panel b:nth-of-type(40) i {animation-duration: 21s; animation-delay: -14.1s;}
.custom_panel b:nth-of-type(41) i {animation-duration: 18s; animation-delay: -12.8s;}
.custom_panel b:nth-of-type(42) i {animation-duration: 24s; animation-delay: -13.8s;}