Pro for Chris Hans Pohl

/* Profile by AlthIndor */

html, body {background: url('https://i.imgur.com/Z7zfsgJ.png') center;}
body a {text-decoration: none !important;}

@font-face {
 font-family: 'PT Serif';
 font-style: normal;
 font-weight: 400;
 src: local('PT Serif'), local('PTSerif-Regular'), url(https://fonts.gstatic.com/s/ptserif/v10/EJRVQgYoZZY2vCFuvAFWzr8.woff2) format('woff2');
}

@font-face {
 font-family: 'Pacifico';
 font-style: normal;
 font-weight: 400;
 src: local('Pacifico Regular'), local('Pacifico-Regular'), url(https://fonts.gstatic.com/s/pacifico/v13/FwZY7-Qmy14u9lezJ-6H6Mk.woff2) format('woff2');
}

/* Header */

#viewer #gaia_header {
 background: rgba(255,0,0,.4);
 height: 30px !important;
 box-shadow: 0 1px 2px rgba(0,0,0,.5);
}

#gaia_header #header_left, #gaia_header #header_right {
 background: none;
 font: 0/29px 'Pacifico', cursive !important;
 padding: 0 7px !important;
 box-sizing: border-box;
}
#gaia_header #header_right {float: right;}
#gaia_header .spacer {display: none !important;}

#header_left img {
 background: url('https://i.imgur.com/cGGVY2x.png') 0 3px no-repeat;
 width: 0;
 padding: 0 34px 0 0;
 margin: 0 -2px 0 0;
 filter: invert(100%) drop-shadow(0 0 .5px rgba(0,0,0,.5));
}

#gaia_header a, #header_left li::after, #header_right li::before {
 color: #FFFFFF !important;
 font-size: 11px !important;
 font-weight: normal;
 text-transform: capitalize !important;
 text-shadow: 0 0 1px rgba(0,0,0,.5);
}

#gaia_header a {
 letter-spacing: .05em;
 text-transform: uppercase;
 transition: opacity .5s ease-in-out;
}
#gaia_header a:hover {opacity: .75;}

#header_left li:nth-last-of-type(n+2)::after, #header_right li:nth-of-type(n+2)::before {
 content: '●';
 margin: 0 6px;
 position: relative;
 top: -1px;
 opacity: .75;
}

/* Columns */

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

#columns {
 background: url('https://images2.imgbox.com/8b/e4/RlrlSYgN_o.png');
 width: 1010px;
 height: 560px;
 position: fixed;
 top: calc(50% - 280px);
 left: calc(50% - 504px);
}

#column_1, #column_2, #column_3 {
 width: 1px;
 height: 1px;
 position: absolute;
 top: 0;
 left: 0;
 overflow: visible;
}

#columns ::-webkit-scrollbar {
 background: rgba(255,255,255,.25);
 width: 10px;
 border-radius: 5px;
}

#columns ::-webkit-scrollbar-thumb {
 background: rgba(255,255,255,.75) content-box;
 border: 1px solid transparent;
 border-radius: 5px;
}

/* Panels */

.panel, .panel h2 {
 background: none;
 color: #FFFFFF;
 font: 12px/1.6em 'PT Serif', serif;
 text-align: justify;
 padding: 0;
 margin: 0;
 position: absolute;
 box-sizing: border-box;
 overflow: hidden;
}

.panel a {
 color: #C00000;
 transition: color .5s ease-in-out;
}
.panel a:hover {color: #FF0000;}

#id_about, #id_friends {
 transform-origin: top left;
 transform: rotate(-5deg);
}
#id_about h2, #id_friends h2 {display: none;}

/* About Me */

#id_about {
 width: 445px;
 height: 320px;
 text-shadow: 0 1px 1px #000;
 padding-right: 15px;
 top: 140px;
 left: 365px;
 border: 15px solid transparent;
 overflow-y: scroll;
}
#id_about img {max-width: 100% !important;}

/* Friends */

#id_friends {
 height: 360px;
 top: 142px;
 left: 182px;
}

#id_friends h2 ~ div {display: none;}
#id_friends h2 ~ p {display: none;}
#id_friends p {margin: 0;}

#id_friends .dropBox {
 background: #404040;
 border: 2px solid #202020;
 filter: saturate(10%);
 transition: filter .5s ease-in-out;
}
#id_friends li:hover .dropBox {filter: none;}

#id_friends .style1 {
 width: 100%;
 height: 100%;
 padding: 0 30px 0 0;
 overflow: hidden scroll;
}

#id_friends .style1 li {
 float: none;
 background: rgba(128,128,128,.5);
 width: 56px;
 height: auto;
 padding: 5px 10px;
 margin: 0 0 10px 0;
 position: relative;
 border-radius: 3px;
 transition: background .5s ease-in-out;
}
#id_friends .style1 li:hover {background: rgba(255,0,0,.4);}

#id_friends .style1 a {
 display: block;
 width: 100%;
 height: 100%;
 font-size: 0;
 position: absolute;
 top: 0;
 left: 0;
 z-index: 2;
}

/* Media */

.media_panel {
 width: 20px;
 height: 20px !important;
 top: 80px;
 left: 860px;
}

.media_panel::after {
 content: url('https://i.imgur.com/MWTKBXK.gif');
 position: absolute;
 margin: 5px 0 0 2px;
 transform: rotate(5deg);
 pointer-events: none;
}

.media_panel h2 {
 display: none;
 font-size: 10px;
 text-transform: capitalize;
 position: fixed;
 top: calc(50% - 280px + 27px);
 right: calc(50% - 504px + 165px);
 transform-origin: top right;
 transform: rotate(-4.8deg);
 pointer-events: none;
}
.media_panel:hover h2 {display: initial;}

.media_panel iframe {
 position: absolute;
 bottom: 0;
 left: 0;
 opacity: .01;
}

.media_panel .buttons {
 position: fixed;
 top: calc(50% - 280px + 82px);
 right: calc(50% - 504px + 90px);
}