Pro for Aillsa

/* Design by Cassiel Socks */
/* And Coding by AlthIndor */

html, body {
  background: url('https://i.imgur.com/fp27LbE.png') no-repeat top center / 100% auto,
    linear-gradient(90deg, #140020B4 10%, #4800485A, #58005034, #58005034, #4800485A, #140020B4 90%),
    url('https://i.imgur.com/EVVXo68.png') no-repeat bottom center / 100% auto,
    url('https://i.imgur.com/D71dM2W.png') center calc(50% + 20px) #280C14;
  min-height: 1400px;
}
body {position: relative;}
body a {transition: all .5s ease-in-out;}

/* Fonts */

@font-face {
  font-family: 'Noto Serif';
  font-style: normal;
  font-weight: 400;
  src: local('Noto Serif'), url('https://fonts.gstatic.com/s/notoserif/v21/ga6Iaw1J5X9T9RW6j9bNfFcWaA.woff2') format('woff2');
}

@font-face {
  font-family: 'Noto Serif';
  font-style: normal;
  font-weight: 700;
  src: local('Noto Serif Bold'), url('https://fonts.gstatic.com/s/notoserif/v21/ga6Law1J5X9T9RW6j9bNdOwzfReecQ.woff2') format('woff2');
}

@font-face {
  font-family: 'Font Awesome 6 Free';
  font-style: normal;
  font-weight: 900;
  src: url('https://ka-f.fontawesome.com/releases/v6.2.0/webfonts/free-fa-solid-900.woff2') format('woff2');
}

/* Header */

#viewer #gaia_header {
  background: #302828;
  width: calc(100% - 20px) !important;
  height: 30px !important;
  position: absolute !important;
  top: 10px !important;
  left: 10px !important;
  border-radius: 5px;
  box-shadow: 0 2px 5px #00000080;
}
#gaia_header li.spacer {display: none !important;}
#gaia_header li {margin: 0 5px;}

#gaia_header ul {
  background: none !important;
  width: auto !important;
  font: 0/29px 'Noto Serif', serif !important;
  padding: 0 5px !important;
}
#gaia_header #header_right {float: right;}

#header_left img {
 -webkit-mask: url('https://i.imgur.com/cGGVY2x.png') 0 4px no-repeat;
  mask: url('https://i.imgur.com/cGGVY2x.png') 0 4px no-repeat;
  background: #FFFFFF;
  width: 0;
  padding: 0 34px 0 0;
  transition: background .5s ease-in-out;
}
#header_left li:nth-of-type(2) a:hover img {background: #FF7000;}

#gaia_header a {
  color: #FFFFFF !important;
  font-size: 10px !important;
  text-transform: uppercase;
  text-decoration: none !important;
}
#gaia_header a:hover {color: #FF7000 !important;}

/* Columns */

#columns {
  background: url('https://i.imgur.com/nItOo6W.png');
  width: 920px;
  height: 1300px;
  font-size: 0;
  top: calc(50% - 650px + 20px);
  left: calc(50% - 460px);
}
#columns .column {display: contents;}

#columns::before {
  content: url('https://i.imgur.com/IKrd4I7.png');
  position: absolute;
  top: 146px;
  left: 285px;
  filter: drop-shadow(0 0 20px #FF800080);
}

/* Scrollbars */

#columns ::-webkit-scrollbar, #columns ::-webkit-scrollbar-thumb {
  width: 6px;
  border-radius: 3px;
}
#columns ::-webkit-scrollbar {background: #08000040;}
#columns ::-webkit-scrollbar-thumb {background: #AC9084;}

.panel {
  scrollbar-color: #AC9084 #08000040;
  scrollbar-width: thin;
}

/* Panels */

.panel {
  background: none;
  font: 10px/1.7 'Noto Serif', serif;
  color: #FFFFFF;
  padding: 0;
  margin: 0;
  position: absolute;
  overflow: hidden;
}
.panel:not(.custom_panel) {z-index: 1;}

.panel h2 {display: none;}
.panel img {max-width: 100% !important;}

.panel a {
  color: #FF7000;
  font-weight: 400;
  text-decoration: dotted underline;
}
.panel a:hover {color: goldenrod;}

#id_about, #id_wishlist, #id_footprints {
  width: 410px;
  padding-right: 10px;
  right: 70px;
  overflow-y: scroll;
  overscroll-behavior: contain;
}
#id_about, #id_footprints {text-align: right;}

#id_wishlist, #id_footprints {
  height: 130px;
  scroll-snap-type: y mandatory;
}
#id_wishlist {top: 480px;}
#id_footprints {top: 650px;}

#id_wishlist .item, #id_footprints .item {scroll-snap-align: start;}

#id_about {
  height: 280px;
  top: 160px;
}

/* Details */

#id_details {
  top: 930px;
  left: 80px;
  transform-origin: 0 0;
  transform: scale(2);
}
#id_details p:nth-of-type(n+2), .forum_userstatus {display: none;}
#id_details p {margin: 0;}
#id_details img {image-rendering: pixelated;}

/* Contact and Media */

#id_contact, .media_panel {left: 360px;}
#id_contact {top: 950px;}
.media_panel {top: 1160px;}

#id_contact li, .media_panel {
  width: 50px;
  height: 50px !important;
  font-size: 0;
  text-align: center;
}
#id_contact li {margin: 0 0 20px 0;}

#id_contact li *, .media_panel {
  text-shadow: 0 0 10px firebrick;
  transition: all .5s ease-in-out;
}

#id_contact a {
  color: #FFFFFF;
  text-decoration: none;
}
#id_contact a:hover, .media_panel:hover {text-shadow: 0 0 10px #FFFFFF;}

#id_contact li *::before, .media_panel::before {font: 900 30px/50px 'Font Awesome 6 Free';}
#id_contact li:nth-of-type(1) *::before {content: '';}
#id_contact li:nth-of-type(2) *::before {content: '';}
#id_contact li:nth-of-type(3) *::before {content: '';}
.media_panel::before {content: '';}

.media_panel iframe {
  position: absolute;
  bottom: 0;
  left: -27px;
  transform-origin: bottom left;
  transform: scale(1.5);
  opacity: .001;
}

/* Wish List */

#id_wishlist {
  display: grid;
  justify-content: space-between;
  grid-template-columns: repeat(9, 40px);
  grid-auto-rows: max-content;
  gap: 5px;
}
#id_wishlist .clear, .premium_sparkle {display: none;}
#id_wishlist .item {position: relative;}

#id_wishlist .item a {
  display: block;
  background: #282020;
  width: 30px;
  height: 30px;
  padding: 4px;
  border: 1px solid transparent;
  border-radius: 3px;
  box-shadow: 0 0 0 1px #583828 inset;
}
#id_wishlist .item:hover a {background: #FF7000;}

#id_wishlist .owner_checkmark {
  margin: 0;
  bottom: 5px;
  left: 5px;
  filter: hue-rotate(60deg);
}

/* Visitors */

#id_footprints .item {
  background: linear-gradient(90deg, #28202000, #282020);
  display: grid;
  grid-auto-flow: column;
  justify-content: right;
  height: 25px;
  line-height: 25px;
  padding: 0 6px;
  margin: 0 0 1px 0;
  border-radius: 0 3px 3px 0;
}

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

/* Candles */

@keyframes CandleFlicker {
  from {background-position-x: 0}
  to {background-position-x: -3100px;}
}

@keyframes CandleOrb {
  000% {opacity: .75;}
  005% {opacity: .75;}
  010% {opacity: .70;}
  015% {opacity: .80;}
  020% {opacity: .70;}
  025% {opacity: .90;}
  030% {opacity: .80;}
  035% {opacity: .70;}
  040% {opacity: .75;}
  045% {opacity: .75;}
  050% {opacity: .90;}
  055% {opacity: .75;}
  060% {opacity: .70;}
  065% {opacity: .75;}
  070% {opacity: .85;}
  075% {opacity: .70;}
  080% {opacity: .75;}
  085% {opacity: .90;}
  090% {opacity: .75;}
  095% {opacity: .60;}
  100% {opacity: .75;}
}

.custom_panel, .custom_panel h2 + div {
  width: 100%;
  height: 100% !important;
}
.custom_panel br {display: none;}
.custom_panel * {position: absolute;}

.custom_panel i {
  background: radial-gradient(circle at center, #FFFF8080, #FF800040, #FF000000 70%);
  width: 60px;
  height: 60px;
  filter: blur(5px);
  mix-blend-mode: screen;
  animation: CandleOrb 8s linear infinite;
}
@media (prefers-reduced-motion) {.custom_panel i {animation-play-state: paused;}}

.custom_panel i:nth-of-type(1) {top: 0550px; left: 118px;}
.custom_panel i:nth-of-type(2) {top: 0622px; left: 142px; animation-delay: -0.5s;}
.custom_panel i:nth-of-type(3) {top: 0630px; left: 182px; animation-delay: -4.0s;}
.custom_panel i:nth-of-type(4) {top: 0800px; left: 456px; animation-delay: -1.0s;}
.custom_panel i:nth-of-type(5) {top: 0728px; left: 341px; animation-delay: -3.5s;}
.custom_panel i:nth-of-type(6) {top: 1057px; left: 524px; animation-delay: -7.0s;}
.custom_panel i:nth-of-type(7) {top: 1136px; left: 655px; animation-delay: -6.5s;}
.custom_panel i:nth-of-type(8) {top: 1092px; left: 684px; animation-delay: -2.0s;}

.custom_panel b {
  background: url('https://i.imgur.com/U2Zrsx5.png');
  width: 100px;
  height: 220px;
  transform-origin: 0 0;
  transform: scale(.2, .15);
  animation: CandleFlicker 2s steps(31, start) infinite;
  mix-blend-mode: screen;
}
@media (prefers-reduced-motion) {.custom_panel b {animation-play-state: paused;}}

.custom_panel b:nth-of-type(1),
.custom_panel b:nth-of-type(3),
.custom_panel b:nth-of-type(5) {transform: scale(-.2, .15);}

.custom_panel b:nth-of-type(1) {top: 0560px; left: 158px;}
.custom_panel b:nth-of-type(2) {top: 0632px; left: 162px; animation-delay: -0.33s;}
.custom_panel b:nth-of-type(3) {top: 0640px; left: 222px; animation-delay: -1.25s;}
.custom_panel b:nth-of-type(4) {top: 0810px; left: 476px; animation-delay: -0.70s;}
.custom_panel b:nth-of-type(5) {top: 0738px; left: 381px; animation-delay: -0.25s;}
.custom_panel b:nth-of-type(6) {top: 1067px; left: 544px; animation-delay: -1.00s;}
.custom_panel b:nth-of-type(7) {top: 1146px; left: 675px; animation-delay: -1.50s;}
.custom_panel b:nth-of-type(8) {top: 1102px; left: 704px; animation-delay: -0.66s;}

/* Misc */

#pictures_container, #texts_container {
  width: 1px;
  height: 1px;
  position: absolute;
  top: calc(50% - 650px + 20px);
  left: calc(50% - 460px);
}
.bbcode-swapping-image {background: url('https://i.imgur.com/Fk5mUXF.png');}