Pro for EmiBerry

/* Layout by Mule of CD-ARIAx3 */
/* + Profile Code by AlthIndor */

html, body {
  background: url('https://i.imgur.com/uKs1hkG.png') no-repeat center -50px,
    url('https://snowman-wallpapers.com/wallpapershd/grunge-wallpaper-1080p-For-Wallpaper-Photo.jpg') repeat-x center,
    url('https://wallpaperaccess.com/full/968829.jpg') 0 0 / cover #000;
  background-blend-mode: normal, screen, normal;
  min-height: 880px;
}
body {contain: content;}

body a {
  text-decoration: none !important;
  transition: all .5s ease-in-out;
}

#columns, #column_2 h2::before, #column_2 h2::after, #column_1 .custom_panel i::before, #column_1 .custom_panel .clear, #id_contact ul:not(.buttons) li * {background: url('https://images2.imgbox.com/e8/f9/0OFEUwcS_o.png');}
#column_2 h2::before, #column_2 h2::after, #column_1 .custom_panel i::before {background-position-y: -865px;}
#column_1 .custom_panel .clear {background-position: -1200px 0;}
#id_contact ul:not(.buttons) li * {background-position-y: bottom;}

/* Fonts */

@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 600;
  src: local('Montserrat SemiBold'), local('Montserrat-SemiBold'), url(https://fonts.gstatic.com/s/montserrat/v15/JTURjIg1_i6t8kCHKm45_bZF3gnD_g.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 {background: none;}
#gaia_header li.spacer {display: none !important;}
#gaia_header li {position: relative;}

#gaia_header #header_left, #gaia_header #header_right {
  background: #4C2673C0;
  width: auto !important;
  height: 30px !important;
  font-size: 0 !important;
  margin: 10px !important;
  border-radius: 3px;
  box-shadow: 0 3px 10px #000;
  overflow: hidden;
}
#gaia_header #header_right {float: right;}

#gaia_header img {
  background: url('https://i.imgur.com/cGGVY2x.png') no-repeat 0 3px;
  width: 0;
  padding: 0 34px 0 0;
  margin: 0 -1px 0 0;
  filter: invert(100%);
  transition: filter .5s ease-in-out;
}
#header_left li:nth-of-type(n+2) a:hover img {filter: unset;}

#gaia_header a {
  color: #FFFFFF !important;
  font: 600 10px/31px 'Montserrat', sans-serif !important;
  padding: 10px;
  text-transform: uppercase;
}

#gaia_header a:hover {
  background: #FFFFFF;
  color: #000 !important;
}

#header_left li:nth-of-type(n+3)::before, #header_right li:nth-of-type(n+2)::before {
  content: '';
  background: #FFF;
  width: 4px;
  height: 4px;
  position: absolute;
  top: calc(50% - 6px);
  left: -2px;
  border-radius: 50%;
  mix-blend-mode: difference;
  z-index: 1;
}

/* Columns */

#columns, #column_1, #column_2, #column_3 {
  float: none;
  margin: 0;
  position: absolute;
}

#columns, #column_1 {
  width: 1200px;
  height: 860px;
}

#columns {
  top: 0;
  left: calc(50% - 600px);
}

#column_2 {
  width: 385px;
  height: 189px;
  top: 512px;
  left: 510px;
}

#column_3 {
  right: 0;
  overflow: visible;
}

/* Scrollbars */

#columns ::-webkit-scrollbar {
  background: #FFFFFF40;
  width: 6px;
}
#columns ::-webkit-scrollbar-thumb {background: #FF7000;}

.panel {
  scrollbar-color: #FF7000 #FFFFFF40;
  scrollbar-width: thin;
}

/* Panels */

.panel, .panel h2 {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}
#column_1 h2, #column_3 h2 {display: none;}

.panel {
  background: none;
  color: #FFFFFF;
  font: 10px/1.8 'Open Sans', sans-serif;
  text-align: justify;
  position: absolute;
  overflow: hidden;
}

.panel a {color: deeppink;}
.panel a:hover {color: #FF7000;}

#id_contact, #id_details, #id_wishlist, .media_panel {z-index: 1;}
#id_about, #id_comments, #id_footprints, #id_wishlist {overflow-y: scroll;}
#id_about, #id_comments {padding-right: 15px;}
#id_about img, #id_comments .postcontent img {max-width: 100%;}

#column_2 .panel {
  width: 100%;
  height: 100%;
  left: 100%;
  border: 15px solid transparent;
  transition: left .5s ease-in-out;
}
#column_2 .panel:hover {left: 0;}

/* Panel Headers */

#column_2 h2::before, #column_2 h2::after {
  content: '';
  position: absolute;
}

#column_2 h2 {
  background: none;
  width: 164px;
  height: 64px;
  font-size: 0;
  position: fixed;
  left: calc(50% + 300px);
}
#id_about h2 {top: 510px;}
#id_comments h2 {top: 574px;}
#id_footprints h2 {top: 638px;}

#column_2 h2::before {
  width: 100%;
  height: 34px;
  top: 14px;
  transition: filter .5s ease-in-out;
}
#column_2 .panel:hover h2::before {filter: brightness(175%) hue-rotate(20deg);}

#id_about h2::before {background-position-x: -100px;}
#id_comments h2::before {background-position-x: -300px;}
#id_footprints h2::before {background-position-x: -500px;}

#column_2 h2::after {
  width: 56px;
  height: 51px;
  top: 7px;
  left: -15px;
  transition: all .5s ease-in-out;
}

#column_2 .panel:hover h2::after {
  transform: rotate(30deg);
  filter: brightness(150%);
}

/* Contact */

#id_contact {
  top: 322px;
  left: 370px;
  transform: rotate(-5.5deg);
  overflow: visible;
}

#id_contact ul:not(.buttons) li, #id_contact ul:not(.buttons) li * {
  width: 40px;
  height: 40px;
  border-radius: 50%;
}

#id_contact ul:not(.buttons) li {
  background: #000;
  margin-bottom: 20px;
}

#id_contact ul:not(.buttons) li * {
  display: block;
  font-size: 0;
  filter: drop-shadow(0 0 5px #8830FF) drop-shadow(0 0 10px #8830FF) drop-shadow(0 0 15px #8830FF);
  transition: filter .5s ease-in-out;
}
#id_contact ul:not(.buttons) li *:hover {filter: drop-shadow(0 0 5px hotpink) drop-shadow(0 0 10px hotpink) drop-shadow(0 0 15px hotpink);}

#id_contact ul:not(.buttons) li:nth-of-type(1) * {background-position-x: -2280px;}
#id_contact ul:not(.buttons) li:nth-of-type(2) * {background-position-x: -2320px;}
#id_contact ul:not(.buttons) li:nth-of-type(3) * {background-position-x: right;}

/* V1 Style Links */

#column_3 .custom_panel {
  width: max-content;
  color: crimson;
  font: 8px/1.6 'Montserrat', sans-serif;
  letter-spacing: .2em;
  text-align: center;
  text-shadow: 0 1px 1px #000;
  top: 718px;
  right: 334px;
}
#column_3 .custom_panel br {display: none;}

#column_3 a {
  color: #B0B0B0;
  margin: 0 .5em;
}
#column_3 a:hover {color: deeppink;}

/* Details */

#id_details {
  width: 120px;
  height: 150px;
  top: 343px;
  left: 216px;
}

/* Wish List */

#id_wishlist {
  display: grid;
  grid-template-columns: repeat(8, 40px);
  grid-auto-rows: 40px;
  gap: 10px;
  width: 410px;
  height: 40px;
  top: 757px;
  left: 452px;
  scroll-snap-type: y mandatory;
}
#id_wishlist .clear, .premium_sparkle {display: none;}

#id_wishlist .item {
  background: #FFFFFF40;
  width: 30px;
  height: 30px;
  padding: 5px;
  position: relative;
  border-radius: 50%;
  outline: 1px dotted #FF00FF40;
  outline-offset: -4px;
  transition: all .5s ease-in-out;
  scroll-snap-align: start;
  scroll-snap-stop: always;
}

#id_wishlist .item:hover {
  background: #FFFFFF;
  outline-color: #FF7000;
}

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

/* Comments */

#id_comments #alert_container, #id_comments dt {padding: 0;}
#id_comments #alerts_banner {display: none;}
#id_comments #alert_container {float: none;}
#id_comments .deletecomment {margin: 0 0 0 10px;}
#id_comments dd {margin: 0 0 15px 0;}
#id_comments dd:last-of-type {margin: 0;}

#id_comments dl {
  clear: both;
  margin: 32px 0 0 0;
}

#id_comments dt {
  height: 1.7em;
  line-height: 1;
  margin: 0 0 3px 0;
  border-bottom: 1px dotted #FFFFFF40;
}
#id_comments .date a {font-weight: 400;}

#id_comments .dropBox {
  background: #FFFFFF40;
  width: 48px;
  height: 56px;
  margin: 6px 10px 0 0;
  border: 1px solid;
  overflow: hidden;
}

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

/* Comments Links */

#id_comments h2 + div, #id_comments h2 ~ p {
  display: flex;
  justify-content: space-between;
  background: #404040;
  width: calc(50% - 5px);
  height: 17px;
  line-height: 16px;
  text-transform: uppercase;
}
#id_comments h2 + div {float: left;}
#id_comments h2 ~ p {float: right;}

#id_comments h2 + div a {font-size: 0;}
#id_comments h2 + div .clear {display: none;}

#id_comments h2 + div a::after {
  content: 'POST NEW COMMENT';
  font-size: 10px;
}

#id_comments div::before, #id_comments div::after, #id_comments p::before, #id_comments p::after {
  font-size: 20px;
  line-height: 13px;
}
#id_comments h2 + div::before, #id_comments h2 ~ p::before {content: '[';}
#id_comments h2 + div::after, #id_comments h2 ~ p::after {content: ']';}

/* Visitors */

#id_footprints .item {
  display: grid;
  grid-auto-flow: column dense;
  justify-content: center;
}

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

/* Media */

.media_panel {
  background: url('https://i.imgur.com/gqTTTvw.png') -21px -6px;
  width: 70px;
  height: 32px !important;
  top: 810px;
  left: 167px;
  filter: drop-shadow(0 0 5px #FF00FF);
  transition: filter .5s ease-in-out;
}
.media_panel:hover {filter: drop-shadow(0 0 5px #FFFFFF);}

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

/* Misc */

#pictures_container, #texts_container {
  width: 1px;
  height: 1px;
  position: absolute;
  top: 0;
  left: 50%;
  overflow: visible;
  z-index: 9;
}

/* Enter Button */

#texts_container .spoiler-wrapper, #texts_container .spoiler-control {border: none;}
#texts_container .spoiler-control-hide, #texts_container .spoiler-control span {display: none !important;}
#texts_container .spoiler-wrapper {padding: 0;}
#texts_container .spoiler-control {outline: none;}

#texts_container .spoiler-control-show {
  background: url('https://i.imgur.com/JUJzknv.png') no-repeat center / contain, url('https://i.imgur.com/2VtMbPL.gif') no-repeat center / cover #200020;
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
}

/* Animations */

#column_1 .custom_panel, #column_1 .custom_panel div {
  width: 100%;
  height: 100% !important;
  position: absolute;
  top: 0;
  pointer-events: none;
}
#column_1 .custom_panel br {display: none;}

#column_1 .custom_panel::after {
  content: '';
  background: url('https://i.imgur.com/rQ3lxwr.gif') center;
  width: 180px;
  height: 560px;
  position: absolute;
  bottom: 93px;
  left: 5px;
  transform-origin: bottom center;
  transform: scale(-.75, .75);
  mix-blend-mode: screen;
}

/* Fog Animation */

@keyframes RotateObject {
  from {transform: rotate(0turn);}
  to {transform: rotate(1turn)}
}

#column_1 .custom_panel b {
  background: url('https://i.imgur.com/VQDuWkJ.png');
  width: 388px;
  height: 388px;
  position: absolute;
  top: 150px;
  mix-blend-mode: soft-light;
  animation: RotateObject 30s linear infinite;
}
#column_1 .custom_panel b:nth-of-type(even) {animation-direction: reverse;}

#column_1 .custom_panel b:nth-of-type(1) {left: 300px;}
#column_1 .custom_panel b:nth-of-type(2) {left: 400px;}
#column_1 .custom_panel b:nth-of-type(3) {left: 500px;}
#column_1 .custom_panel b:nth-of-type(4) {left: 600px;}
#column_1 .custom_panel b:nth-of-type(5) {left: 700px;}

/* Petal Animation */

@keyframes MovePetalsX1 {
  0% {transform: translate(0px, 0px); opacity: 0;}
  25% {opacity: 1;}
  75% {opacity: 1;}
  100% {transform: translate(150px, 450px); opacity: 0;}
}

@keyframes MovePetalsX2 {
  0% {transform: translate(0px, 0px); opacity: 0;}
  25% {opacity: 1;}
  75% {opacity: 1;}
  100% {transform: translate(-150px, 450px); opacity: 0;}
}

#column_1 .custom_panel i {
  position: absolute;
  top: -30px;
  mix-blend-mode: lighten;
  animation: MovePetalsX1 10s linear infinite;
}
#column_1 .custom_panel i:nth-of-type(even) {animation-name: MovePetalsX2;}

#column_1 .custom_panel i::before {
  content: '';
  display: block;
  animation: RotateObject 10s linear infinite;
}
#column_1 .custom_panel i:nth-of-type(even)::before {animation-direction: reverse;}

#column_1 .custom_panel i:nth-of-type(6n+3)::before, #column_1 .custom_panel i:nth-of-type(6n+4)::before, #column_1 .custom_panel i:nth-of-type(6n+5)::before {width: 19px;}
#column_1 .custom_panel i:nth-of-type(6n+0)::before, #column_1 .custom_panel i:nth-of-type(6n+1)::before {height: 16px;}
#column_1 .custom_panel i:nth-of-type(6n+4)::before, #column_1 .custom_panel i:nth-of-type(6n+5)::before {height: 15px;}
#column_1 .custom_panel i:nth-of-type(6n+4)::before {background-position-x: -774px;}
#column_1 .custom_panel i:nth-of-type(6n+5)::before {background-position-x: -793px;}

#column_1 .custom_panel i:nth-of-type(6n+0)::before {
  background-position-x: -700px;
  width: 16px;
}

#column_1 .custom_panel i:nth-of-type(6n+1)::before {
  background-position-x: -716px;
  width: 17px;
}

#column_1 .custom_panel i:nth-of-type(6n+2)::before {
  background-position-x: -733px;
  width: 22px;
  height: 13px;
}

#column_1 .custom_panel i:nth-of-type(6n+3)::before {
  background-position-x: -755px;
  height: 14px;
}

#column_1 .custom_panel i:nth-of-type(01) {left: 856px; animation-duration: 13.8s; animation-delay: -11.0s;}
#column_1 .custom_panel i:nth-of-type(02) {left: 799px; animation-duration: 11.0s; animation-delay: -04.0s;}
#column_1 .custom_panel i:nth-of-type(03) {left: 872px; animation-duration: 10.9s; animation-delay: -04.1s;}
#column_1 .custom_panel i:nth-of-type(04) {left: 866px; animation-duration: 14.2s; animation-delay: -06.1s;}
#column_1 .custom_panel i:nth-of-type(05) {left: 745px; animation-duration: 11.7s; animation-delay: -06.1s;}
#column_1 .custom_panel i:nth-of-type(06) {left: 819px; animation-duration: 11.1s; animation-delay: -05.0s;}
#column_1 .custom_panel i:nth-of-type(07) {left: 881px; animation-duration: 12.4s; animation-delay: -12.1s;}
#column_1 .custom_panel i:nth-of-type(08) {left: 707px; animation-duration: 11.6s; animation-delay: -11.6s;}
#column_1 .custom_panel i:nth-of-type(09) {left: 718px; animation-duration: 11.1s; animation-delay: -01.0s;}
#column_1 .custom_panel i:nth-of-type(10) {left: 860px; animation-duration: 14.4s; animation-delay: -05.9s;}
#column_1 .custom_panel i:nth-of-type(11) {left: 838px; animation-duration: 13.8s; animation-delay: -10.4s;}
#column_1 .custom_panel i:nth-of-type(12) {left: 812px; animation-duration: 12.0s; animation-delay: -09.0s;}
#column_1 .custom_panel i:nth-of-type(13) {left: 858px; animation-duration: 13.4s; animation-delay: -03.9s;}
#column_1 .custom_panel i:nth-of-type(14) {left: 811px; animation-duration: 13.6s; animation-delay: -02.3s;}
#column_1 .custom_panel i:nth-of-type(15) {left: 848px; animation-duration: 10.5s; animation-delay: -04.4s;}
#column_1 .custom_panel i:nth-of-type(16) {left: 877px; animation-duration: 10.0s; animation-delay: -01.0s;}
#column_1 .custom_panel i:nth-of-type(17) {left: 874px; animation-duration: 13.5s; animation-delay: -06.5s;}
#column_1 .custom_panel i:nth-of-type(18) {left: 872px; animation-duration: 14.5s; animation-delay: -03.8s;}
#column_1 .custom_panel i:nth-of-type(19) {left: 839px; animation-duration: 13.7s; animation-delay: -05.7s;}
#column_1 .custom_panel i:nth-of-type(20) {left: 860px; animation-duration: 12.0s; animation-delay: -11.0s;}
#column_1 .custom_panel i:nth-of-type(21) {left: 770px; animation-duration: 10.3s; animation-delay: -03.2s;}
#column_1 .custom_panel i:nth-of-type(22) {left: 894px; animation-duration: 10.6s; animation-delay: -00.9s;}
#column_1 .custom_panel i:nth-of-type(23) {left: 835px; animation-duration: 13.3s; animation-delay: -12.4s;}
#column_1 .custom_panel i:nth-of-type(24) {left: 845px; animation-duration: 14.1s; animation-delay: -07.8s;}

#column_1 .custom_panel i:nth-of-type(01)::before {animation-duration: 11.6s; animation-delay: -04.0s;}
#column_1 .custom_panel i:nth-of-type(02)::before {animation-duration: 17.7s; animation-delay: -14.3s;}
#column_1 .custom_panel i:nth-of-type(03)::before {animation-duration: 13.0s; animation-delay: -02.0s;}
#column_1 .custom_panel i:nth-of-type(04)::before {animation-duration: 15.8s; animation-delay: -03.2s;}
#column_1 .custom_panel i:nth-of-type(05)::before {animation-duration: 12.1s; animation-delay: -11.0s;}
#column_1 .custom_panel i:nth-of-type(06)::before {animation-duration: 19.4s; animation-delay: -03.7s;}
#column_1 .custom_panel i:nth-of-type(07)::before {animation-duration: 19.4s; animation-delay: -16.1s;}
#column_1 .custom_panel i:nth-of-type(08)::before {animation-duration: 18.7s; animation-delay: -09.2s;}
#column_1 .custom_panel i:nth-of-type(09)::before {animation-duration: 18.7s; animation-delay: -12.4s;}
#column_1 .custom_panel i:nth-of-type(10)::before {animation-duration: 13.8s; animation-delay: -13.7s;}
#column_1 .custom_panel i:nth-of-type(11)::before {animation-duration: 12.7s; animation-delay: -03.8s;}
#column_1 .custom_panel i:nth-of-type(12)::before {animation-duration: 12.0s; animation-delay: -07.0s;}
#column_1 .custom_panel i:nth-of-type(13)::before {animation-duration: 18.6s; animation-delay: -14.3s;}
#column_1 .custom_panel i:nth-of-type(14)::before {animation-duration: 19.8s; animation-delay: -06.7s;}
#column_1 .custom_panel i:nth-of-type(15)::before {animation-duration: 12.1s; animation-delay: -04.1s;}
#column_1 .custom_panel i:nth-of-type(16)::before {animation-duration: 12.5s; animation-delay: -01.8s;}
#column_1 .custom_panel i:nth-of-type(17)::before {animation-duration: 18.9s; animation-delay: -17.5s;}
#column_1 .custom_panel i:nth-of-type(18)::before {animation-duration: 17.0s; animation-delay: -09.0s;}
#column_1 .custom_panel i:nth-of-type(19)::before {animation-duration: 14.9s; animation-delay: -13.2s;}
#column_1 .custom_panel i:nth-of-type(20)::before {animation-duration: 14.4s; animation-delay: -02.9s;}
#column_1 .custom_panel i:nth-of-type(21)::before {animation-duration: 12.2s; animation-delay: -02.4s;}
#column_1 .custom_panel i:nth-of-type(22)::before {animation-duration: 17.8s; animation-delay: -07.9s;}
#column_1 .custom_panel i:nth-of-type(23)::before {animation-duration: 11.2s; animation-delay: -01.3s;}
#column_1 .custom_panel i:nth-of-type(24)::before {animation-duration: 10.3s; animation-delay: -03.2s;}