CHAN CODE PT 2 [WIP]

<style type="text/css">
@import url('https://fonts.googleapis.com/css?family=Antic+Slab|Niconne|Lobster+Two|Crushed');
@font-face{font-family:'noware';src:url('https://static.tumblr.com/uopakca/PIrq6n13y/nowharehouse.ttf');}
@font-face { font-family: 'scorchedearth'; src: url('https://static.tumblr.com/ujahjev/Gxoplsunp/scorchedearthdemo-kcfonts.otf') format('truetype');}

body {
background-color: white;
background-image: linear-gradient(to top, #c11d3c, #87162b, #5e101f);
background-position: center;
background-size: 100%;
background-repeat:no-repeat;
}

#thaibrows {
position: fixed;
left: 0px;
right: 0px;
top: 0px;
bottom: 0px;
}

::-webkit-scrollbar-track {
background-color:;
}

::-webkit-scrollbar-thumb {
background-color:;
}

::-webkit-scrollbar {
width:0px;
height:0px;
}

#overlay {
background: url('https://cdn130.picsart.com/331347047032211.png');
z-index: -1;
position: fixed;
background-repeat: no-repeat;
background-size: 32%;
background-position: bottom left;
left: 310px;
top: 0px;
right: 0px;
bottom: 0px;
opacity: 0.3;
}

#container {
position: absolute;
right: 0%;
top: 0%;
width: 590px;
height: 100%;
background: #5e101f;
border-left: 3px double  #3d0a14;
background-image: ('')
}

#title {
position: absolute;
z-index: 1;
left: -260px;
bottom: 207px;
transform: rotate(270deg);
font-family: 'scorchedearth';
color: #240208;
font-size: 60px;
line-height: 60px;
}

#music {
position: absolute;
top: -15px;
right: 650px;
}

#music1 {
position: absolute;
 -webkit-transition: all 0.5s ease-in-out;
   -moz-transition: all 0.5s ease-in-out;
   -o-transition: all 0.5s ease-in-out;
}

#music1:hover #music2{}

#music1:hover #music3{}

#music1:hover #musiclist{ opacity:1;}

#music3 {
position: absolute;
width:  110px;
height: 90px;
background-size: 60%;
background-image: url('https://1.bp.blogspot.com/-MfD7_JkD6eM/Xz0Z7u_0KYI/AAAAAAAAAdc/3VXhmiBoUuQLR6GO7mmAPlW5QdEMr5AZgCLcBGAsYHQ/s480/giphy.gif');
background-repeat: no-repeat;
overflow:hidden;
background-color: #transparent;
opacity: 0.3;
transform: rotate(270deg);
}

</style>
<div id="thaibrows" oncontextmenu="return false;">
<div id="overlay"></div>
<div id="container">
<div id="title"><i>Channarong</i></div>




<div id="music">
<div id="music1">
<div id="music3">
<audio controls style="opacity: 0;"><source src="https://www.dropbox.com/s/7n5wo0oermxikh8/Beautiful%20Pain%20%28%EC%95%84%EB%A6%84%EB%8B%B5%EA%B3%A0%EB%8F%84%20%EC%95%84%ED%94%84%EA%B5%AC%EB%82%98%29%20%28Inst.%29.mp3?raw=1"></audio><script src="https://ajax.cloudflare.com/cdn-cgi/scripts/7089c43e/cloudflare-static/rocket-loader.min.js" data-cf-settings="efa4bf266fe8bb445bebb0cb-|49" defer=""></script>
</div>