Temper

<style>
@import url('https://fonts.googleapis.com/css?family=Advent+Pro|Karla');
body {
background-color: #520000;
background-image: url("https://www.transparenttextures.com/patterns/always-grey.png");
cursor: url(http://cur.cursors-4u.net/cursors/cur-9/cur822.cur), auto !important;
}
::-webkit-scrollbar-thumb:vertical {background-color:#480a0e; height:3px; }
::-webkit-scrollbar { height:3px; width:3px; background-color:transparent; }
#sinny{
 z-index:0;
position:absolute;
height:450;
width:300;
bottom:70;
background-image:url(https://i.imgur.com/F5y9x6d.jpg);
background-size:cover;
left:550;
border:10px solid #290100;
}
#sinny img{
 height:100%;
}
#sheet{
 opacity: 0;
 position: fixed;
 top: 0px;
 right: 0px;
 bottom: 0px;
 left: 0px;
 -moz-transition: all 1.0s ease-out;
 -ms-transition: all 1.0s ease-out;
 -o-transition: all 1.0s ease-out;
transition: all 1.0s ease-out;
z-index: 99;
}

#sheet:hover {
 opacity: 1.0;
 -moz-transition: all 1.0s ease-out;
 -ms-transition: all 1.0s ease-out;
 -o-transition: all 1.0s ease-out;
 transition: all 1.0s ease-out;
 }
#connection{
 position:fixed;
 height:200;
 width:150;
 background-color: #480a0e;
 border: 5px solid #290100;
 bottom: 280;
 left: 350;
 text-align:center;
 font-size:12px;
 font-family:;
 overflow:auto;
}
#dossier{
 position:fixed;
 height:100;
 width:250;
 background-color: #480a0e;
 border: 5px solid #290100;
 bottom: 100;
 left: 580;
 font-size:12px;
 font-family:'Karla';
 color:#FFF;
 overflow:auto;
 padding:5px;
}
#ooc{
 position:fixed;
 height:150;
 width:150;
 background-color: #480a0e;
 border: 5px solid #290100;
 bottom: 70;
 left: 350;
 text-align:center;
 font-size:12px;
 font-family:'karla';
 overflow:auto;
 color:#FFF;
}
a{
 text-decoration:none;
 color:#b10;
 font-size:12px;
 font-family:'Karla';
 cursor: url(http://cur.cursors-4u.net/cursors/cur-9/cur822.cur), auto !important;
}
h1{
 font-size:12px;
 font-family:'Advent Pro';
 color:#111;
 text-align:center;
 border-left: 5px double #111;
 border-right: 5px double #111;
 margin:5px;
}
#sin{
 z-index:15;
 position:fixed;
 font-size:80px;
 left:620;
 bottom:230;
 font-family: 'Advent Pro';
 color: #520000;
 text-shadow: 0px 0px 10px #200000;
}
</style>
<div id="sinny"></div>
<div id="sheet">
<div id="sin">Temper</div>
<div id="connection">
<a target="_blank" href="https://roleplay.chat/profile.php?user=precious" title="..."><img src="https://i.imgur.com/luvqawp.jpg"style="border: 2px solid #200000; height:50px; width:100px; margin-bottom: 10px; margin-top:10px;"></a>
</div>
<div id="dossier"><center>Temper • Bodyguard • 6'3" • <a target="_blank" href="https://roleplay.chat/profile.php?user=precious" title="">Adored</a> • <a target="_blank" href="https://imgur.com/a/KUpjQs2" title="Slight NSFW">🌹</a><br><br>
<i>[Insert a saying,quote,introduction]</i></div>
<div id="ooc"><h1>OOC</h1>
• IC not OOC<br>
<a title="
don't pm to smut.">• reserved.</a><br>
• pm friendly<br>
• dark themed<br>
<a target="_blank" href="https://roleplay.chat/profile.php?user=precious">• credit</a>
</div>
</div>