Pro for bzztbzzt

/* Graphics by Cassiel Socks, Code by AlthIndor */

:root {
 --border-color: #340000;
 --purple-dark: #381634;
 --purple-lite: #6A2A64;
 --pink-dark: #A01038;
 --pink-lite: #E47484;
}
::selection {background: #A0B8C0;}

html, body {
 background: radial-gradient(circle at center, transparent 25vw, #000 60vw) fixed, url('https://i.imgur.com/CRgDwGU.png') fixed bottom center / cover, url('https://i.imgur.com/nbcldhT.png') fixed center #000;
 background-blend-mode: normal, luminosity, normal;
}
body a {text-decoration: none !important;}

#columns, #column_1 b, #column_1 i, #column_2 h2 {background: url('https://images2.imgbox.com/89/22/RAGCCmsZ_o.png');}

/* Fonts */

@font-face {
 font-family: 'Pirata One';
 font-style: normal;
 font-weight: 400;
 src: local('Pirata One'), local('PirataOne-Regular'), url(https://fonts.gstatic.com/s/pirataone/v8/I_urMpiDvgLdLh0fAtofhi-Org.woff2) format('woff2');
}

@font-face {
 font-family: 'Open Sans';
 font-style: normal;
 font-weight: 400;
 src: local('Open Sans Regular'), local('OpenSans-Regular'), url(https://fonts.gstatic.com/s/opensans/v17/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 */

#viewer #gaia_header {
 background: #000 !important;
 height: 29px !important;
 position: absolute !important;
 border-bottom: 1px solid var(--purple-dark);
 box-shadow: 0 1px 5px #000;
 overflow: hidden;
}

#gaia_header #header_left, #gaia_header #header_right {
 background: none !important;
 height: 100% !important;
 font-size: 0 !important;
 box-sizing: border-box;
}
#gaia_header #header_right {float: right;}

#gaia_header ul li, #gaia_header ul a {
 display: inline-block !important;
 height: 100% !important;
}
#gaia_header li.spacer {display: none !important;}
#gaia_header li img {display: none !important;}

#header_left li:nth-of-type(2) a {
 background: url('https://i.imgur.com/5FTB40o.png') center no-repeat;
 width: 37px;
}

#gaia_header ul a {
 color: #FFFFFF !important;
 font: 400 16px/1.8 'Pirata One', serif !important;
 padding: 0 5px;
 vertical-align: text-bottom !important;
 transition: background-color .5s ease-in-out;
}
#gaia_header a:hover {background-color: var(--purple-lite) !important;}

/* Columns */

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

#columns {
 width: 1240px;
 height: 740px;
 position: relative;
 margin: 0 auto;
}

#column_1 {
 width: 100%;
 height: 100%;
}

#column_2 {
 width: 445px;
 height: 530px;
 top: 40px;
 left: 550px;
 transform: translateZ(0);
}

/* Scrollbars */

#columns ::-webkit-scrollbar {
 background: #00000080;
 width: 8px;
 border-radius: 4px;
}

#columns ::-webkit-scrollbar-thumb {
 background: #DDA0DD80 content-box;
 border: 1px solid transparent;
 border-radius: 3px;
}

.panel {
 scrollbar-color: #DDA0DD80 #00000080;
 scrollbar-width: thin;
}

/* Panels */

.panel, .panel h2 {
 color: #FFFFFF;
 padding: 0;
 margin: 0;
 position: absolute;
 box-sizing: border-box;
}
.panel {background: none;}
.panel img {max-width: 100% !important;}
#column_1 h2 {display: none;}

.panel a {
 color: var(--pink-dark);
 transition: color .5s ease-in-out;
}
.panel a:hover {color: var(--pink-lite);}

#column_2 .panel {
 width: 100%;
 height: calc(100% - 130px);
 font: 11px/1.7 'Open Sans', sans-serif;
 text-align: center;
 bottom: 0;
 overflow: hidden scroll;
 transition: right .5s ease-in-out;
}
#id_about, #id_comments {padding-right: 10px;}
#column_2 .panel:hover, #column_2 #id_about {transition-delay: .5s;}
#column_2 .panel:hover {right: 0;}

#id_comments, #id_wishlist, #column_2 .panel:hover ~ #id_about {right: -100%;}
#id_about, #id_comments:hover, #id_wishlist:hover {right: 0;}
#column_2 .panel:hover ~ #id_about {transition-delay: 0s}

/* Headers */

#column_2 h2 {
 font: 24px/90px 'Pirata One', serif;
 text-align: center;
 position: fixed;
 transition: all .5s ease-in-out;
}

#id_about h2, #column_2 .panel:hover h2 {filter: invert(100%);}
#column_2 .panel:hover ~ #id_about h2 {filter: none;}

#id_comments h2, #id_wishlist h2 {
 height: 88px;
 top: 11px;
}

#column_2 #id_about h2 {
 background-position: -164px bottom;
 width: 135px;
 height: 80px;
 line-height: 75px;
 left: 147px;
 top: 0;
}

#column_2 #id_comments h2 {
 background-position: left -31px bottom -1px;
 width: 133px;
 left: 0;
 text-shadow: -1px -1px 1px #000, 1px 1px 1px #000;
}

#column_2 #id_wishlist h2 {
 background-position: -299px bottom;
 width: 134px;
 left: 296px;
 text-shadow: -1px 1px 1px #000, 1px -1px 1px #000;
}

#column_2 h2::after {
 content: '';
 display: none;
 width: 100%;
 position: absolute;
 top: 80px;
 left: 0;
}
#id_about h2::after {height: 51px;}
#id_comments h2::after, #id_wishlist h2::after {height: 40px;}
#column_2 .panel:hover h2::after {display: block;}

/* Contact Buttons */

#id_contact {
 bottom: 75px;
 left: 156px;
}
#id_contact li span {display: none;}

#id_contact ul:not(.buttons) li {
 float: left;
 background: url('https://i.imgur.com/R9wla40.png') #340000;
 background-origin: content-box;
 width: 40px;
 height: 40px;
 margin: 0 10px 0 0;
 border: 3px solid #080000;
 position: relative;
 border-radius: 50%;
 box-shadow: 0 0 10px plum;
 transition: all .5s ease-in-out;
}
#id_contact ul:not(.buttons) li:nth-of-type(1) {background-position: 0 -40px;}
#id_contact ul:not(.buttons) li:nth-of-type(2) {background-position: 0 -80px;}
#id_contact ul:not(.buttons) li:nth-of-type(3) {background-position: 0 -120px;}

#id_contact ul:not(.buttons) li:hover {
 background-color: peru;
 border-color: #340000;
}

#id_contact li a {
 display: block;
 width: 100%;
 height: 100%;
 font-size: 0;
 position: absolute;
 top: 0;
 left: 0;
}

/* Comments */

#id_comments {
 display: flex;
 flex-flow: row wrap;
 justify-content: center;
}

#id_comments #alerts_banner {display: none;}
#id_comments #alert_container {padding: 0;}
#id_comments .dropBox {display: none;}
#id_comments dd {margin: 0 0 15px 0;}
#id_comments dd:last-of-type {margin: 0;}

#id_comments h2 + div a, #id_comments h2 ~ p a {
 font: 400 16px/1 'Pirata One', sans-serif;
 text-transform: uppercase;
 margin: 0 5px;
}
#id_comments h2 + div {float: left;}

#id_comments dt {
 display: flex;
 flex-flow: column;
 height: auto;
 line-height: 1.4;
 text-align: inherit;
 border: none;
}
#id_comments .username {float: none;}

#id_comments .date {
 align-self: center;
 display: block;
 width: max-content;
 text-indent: -5px;
 text-transform: uppercase;
 margin-bottom: 2px;
 overflow: hidden;
}
#id_comments .date a {display: none;}

#id_comments dt::after {
 content: '• • •';
 line-height: 10px;
 opacity: .5;
}

/* Wish List */

#id_wishlist {
 display: flex;
 flex-flow: row wrap;
 align-content: flex-start;
 justify-content: center;
}
#id_wishlist .premium_sparkle {display: none;}

.owner_checkmark {
 margin: 0;
 right: 4px;
 bottom: 3px;
}

#id_wishlist .item {
 background: #000;
 width: 30px;
 height: 30px;
 padding: 2px;
 margin: 6px;
 position: relative;
 border: 2px solid #000;
 border-radius: 7px;
 box-shadow: 0 0 5px #DDA0DDA0;
 transition: all .5s ease-in-out;
}

#id_wishlist .item:hover {
 background: peru;
 border-color: #340000;
}

/* Animations */

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

@keyframes CandleFloat {
 from {margin-top: -10px;}
 to {margin-top: 10px;}
}

@keyframes CandleOrb {
 0% {opacity: .75;}
 5% {opacity: .75;}
 10% {opacity: .7;}
 15% {opacity: .8;}
 20% {opacity: .7;}
 25% {opacity: .9;}
 30% {opacity: .8;}
 35% {opacity: 0.7;}
 40% {opacity: .75;}
 45% {opacity: .75;}
 50% {opacity: 0.9;}
 55% {opacity: .75;}
 60% {opacity: .7;}
 65% {opacity: .75;}
 70% {opacity: .85;}
 75% {opacity: .7;}
 80% {opacity: .75;}
 85% {opacity: .9;}
 90% {opacity: .75;}
 95% {opacity: .6;}
 100% {opacity: .75;}
}

@keyframes HeartBeat {
 0% {transform: scale(.5);}
 5% {transform: scale(.575);}
 10% {transform: scale(.6);}
 15% {transform: scale(.525);}
 20% {transform: scale(.5);}
 25% {transform: scale(.575);}
 30% {transform: scale(.6);}
 35% {transform: scale(.525);}
 40% {transform: scale(.5);}
 100% {transform: scale(.5);}
}

#column_1 div:first-of-type {
 width: 100%;
 height: 100%;
}
#column_1 .custom_panel {pointer-events: none;}

#column_1 b, #column_1 b::before, #column_1 b::after, #column_1 i {
 content: '';
 display: block;
 position: absolute;
}

#column_1 b:first-of-type {
 top: 290px;
 left: 270px;
}

#column_1 b:nth-of-type(n+2) {
 background-position: bottom left;
 width: 31px;
 height: 68px;
 animation: CandleFloat 4s ease-in-out infinite alternate;
}

#column_1 b:nth-of-type(2) {
 top: 115px;
 right: 152px;
}

#column_1 b:nth-of-type(3) {
 top: 305px;
 right: 83px;
 animation-delay: -1s;
}

#column_1 b:nth-of-type(4) {
 top: 515px;
 right: 122px;
 animation-delay: -2s;
}

#column_1 b:nth-of-type(5) {
 top: 608px;
 right: 332px;
 animation-delay: -3s;
}

#column_1 b::before {
 background: radial-gradient(circle at center, #FFC00080, #FF800040, transparent 70%);
 animation: CandleOrb 8s linear infinite;
}

#column_1 b:first-of-type::before {
 width: 300px;
 height: 300px;
 transform: translate(-50%, -55%);
 mix-blend-mode: hard-light;
}

#column_1 b:nth-of-type(n+2)::before {
 width: 150px;
 height: 150px;
 transform: translate(-39%, -53%);
}
#column_1 b:nth-of-type(3)::before {animation-delay: -2s;}
#column_1 b:nth-of-type(4)::before {animation-delay: -4s;}
#column_1 b:nth-of-type(5)::before {animation-delay: -6s;}

#column_1 b::after {
 width: 100px;
 transform-origin: bottom center;
 mix-blend-mode: screen;
 animation: CandleFlicker 2s steps(31, start) infinite;
}

#column_1 b:first-of-type::after {
 background: url('https://i.imgur.com/n0bIc5H.png');
 height: 240px;
 transform: scale(.7, .5) translate(-72%, -185%);
}

#column_1 b:nth-of-type(n+2)::after {
 background: url('https://i.imgur.com/U2Zrsx5.png');
 height: 220px;
 transform: translate(-33px, -95%) scale(.3, .2);
 opacity: .9;
}
#column_1 b:nth-of-type(2)::after {animation-delay: -.25s;}
#column_1 b:nth-of-type(3)::after {animation-delay: -.75s;}
#column_1 b:nth-of-type(4)::after {animation-delay: -.5s;}

#column_1 i {
 width: 206px;
 height: 201px;
 top: 314px;
 left: 318px;
 transform: scale(.5);
 animation: HeartBeat 1.5s linear infinite;
}
#column_1 i:nth-of-type(1) {background-position: bottom right; mix-blend-mode: screen;}
#column_1 i:nth-of-type(2) {background-position: bottom right -206px;}

/* Misc */

#pictures_container, #texts_container {
 width: 1px;
 height: 1px;
 position: absolute;
 left: 50%;
}

/* Flex Rules */

#columns, #pictures_container, #texts_container {top: 45px;}
@media screen and (min-height: 820px) {#columns, #pictures_container, #texts_container {top: calc(50% - 370px + 5px);}}