<style>
@import url('https://fonts.googleapis.com/css?family=Nanum+Gothic&display=swap');
@import url('https://fonts.googleapis.com/css?family=Dancing+Script&display=swap');

body{background-color:#BEB5AE; background-image: url(http://www.transparenttextures.com/patterns/diagonal-striped-brick.png);margin:0;}

.red{ position: fixed;
 background-size:100%;
 transition: 1s;
 background-image: url('https://cdn.discordapp.com/attachments/463907451390001162/610343374972518401/qweqwe.png');
 width: 391px;
 height: 496px;
 bottom:62px;
 left: 515px;
 z-index:10;
 border: white solid 2px;
 box-shadow: 10px 10px 8px #575757;}

 body:hover .red {
 filter: blur(13px);
 opacity: .0;
 }

 .backgroundimage{
position: fixed;
 transition: 1s;
 background-image: url('');
 background-color:black;
 width: 100%;
 height: 100%;
 background-position: center;
 background-repeat: no-repeat;
 background-size: cover;
 z-index:10;
 opacity:0;
}

body:hover .backgroundimage {
 opacity: 1;
 transition-delay: .5s;
 }

.black{ position: fixed;
 background-size:100%;
 transition: 1s;
 background-image: url('https://cdn.discordapp.com/attachments/463907451390001162/610343387593310228/qweqwebutdark.png');
 width: 391px;
 height: 496px;
 bottom:62px;
 left: 515px;
 z-index:10;
 opacity:0;
 border: #333232 solid 1px;
 box-shadow: 10px 10px 155px #;}

body:hover .black {
 opacity: 1;
 transition-delay: .5s;
 }

 .text{
 position:fixed;
 transition:1s;
 text-transform:uppercase;
 background-color:black;
 opacity:0;
 height:478px;
 bottom:72px;
 width:370px;
 left:527px;
 z-index:11;
 font-family:georgia;
 font-size:12px;
 overflow:scroll;
 color:white;
 text-align:center;
 line-height:18px;
 }

 body:hover .text {
 opacity: 0.5;
 transition-delay: 1.5s;
 }

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

b{font-family:georgia; color: #a3a1a1;
font-size:11px;}

.title{
 z-index: 100;
 letter-spacing:9px;
font-size:23px;
font-style:italic;
text-align:left;
 position: fixed;
 left: 530px;
 bottom: 510px;
opacity:0;
font-weight:bold;
transition:1s;
text-transform:uppercase;
 background: -webkit-linear-gradient(#7E2C3A, #7E2C3A);
 -webkit-background-clip: text;
 -webkit-text-fill-color: transparent;}

 body:hover .title {
 opacity: 0.5;
 transition-delay: 1.5s;
 }

 .titletwo{
 z-index: 100;
 letter-spacing:9px;
font-size:23px;
font-style:italic;
text-align:right;
 position: fixed;
 left: 660px;
 bottom: 370px;
opacity:0;
font-weight:bold;
transition:1s;
text-transform:uppercase;
 background: -webkit-linear-gradient(#7E2C3A, #7E2C3A);
 -webkit-background-clip: text;
 -webkit-text-fill-color: transparent;}

 body:hover .titletwo {
 opacity: 0.5;
 transition-delay: 1.5s;
 }

 .titlethree{
 z-index: 100;
 letter-spacing:9px;
font-size:23px;
font-style:italic;
text-align:right;
 position: fixed;
 left: 530px;
 bottom: 210px;
opacity:0;
font-weight:bold;
transition:1s;
text-transform:uppercase;
 background: -webkit-linear-gradient(#7E2C3A, #7E2C3A);
 -webkit-background-clip: text;
 -webkit-text-fill-color: transparent;}

 body:hover .titlethree {
 opacity: 0.5;
 transition-delay: 1.5s;
 }
 </style>

 <div class="red"></div>
 <div class="backgroundimage"></div>
 <div class="black"></div>
 <div class="title">half a heart</div>
<div class="text"><br><br>
<h1><i></i></h1><b>NAME:</b> won't say. <b>GENDER: </b>dick. <b>AGE:</b>
won't say. <B>ORIENTATION: </B>not dick. <B>RELATIONSHIP: </B>not for now.<br> <B>PROFESSION: </B>won't say.<br> Charistmatic. Energetic. Mostly impolite.
<br><br><br>
<div style="text-transform:none;font-size:12px; font-family:georgia;text-align:justify;overflow:scroll;line-height:10px;max-height:100px;">It's hard to grow up in a little port town surrounded by the ocean, man. There's always so much fucking humidity everywhere, the whole family expects you to join the fishing business except for your cousins which want you to work with them in the volcano tourist trips, and one day the whole fucking thing erupts and since you were the first person that the dragon that came out of the damn thing sees, it chooses you to be it's emissary. Next thing you know, whenever you're in trouble it manifests through you sporting some spooky eyes. Now, even if the random person the dragon chose was an asshole, you'd certainly move up in life with that, huh?</div>
<br><br><br>
 <div style="text-transform:none;font-size:12px; font-family:georgia;text-align:justify;overflow:scroll;line-height:10px;max-height:100px;">DM friendly. Probably just shitposting. Code was a gift xo. Don't be weird, my block list is 318 names long.</div>

</div>
<div class="titletwo">filler text</div>
<div class="titlethree">BEEP BEEP</div>