DANNY [DONE]

<style type="text/css">
@import url(//fonts.googleapis.com/css?family=Overlock|Redressed|Niconne|Forum|Aladin);

body {
background-color: #FDFFEA;
background-image: url('https://img.wallpapersafari.com/desktop/1920/1080/23/20/6dpD0Z.jpg');
background-position: center;
background-size: 100%;
background-repeat:no-repeat;
}

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

::-webkit-scrollbar-track {background-color:;}
::-webkit-scrollbar-thumb {background-color:;}
::-webkit-scrollbar {width:2px;height:5px;}

#container {
position: absolute;
left: 35%;
top: 8%;
height: 550px;
width: 400px;
background-color: #3A0000;
border: 2px solid #2C0001;
box-shadow: 0px 0px 10px 10px #2C0001;
}

#topimg {
position: absolute;
z-index: 1;
right: 0px;
top: 0px;
width: 400px;
height: 60px;
background-image: url('https://data.whicdn.com/images/281118618/original.gif');
border-bottom: 1px solid #2c0001;
background-repeat: no-repeat;
background-size: 100%;
background-position: center;
}

#topimg:hover {
background-image: url('https://data.whicdn.com/images/228339882/original.gif');
filter: grayscale(0%);
background-position: center;
}

#quote {
position: absolute;
z-index: 1;
left: 85px;
top: 66px;
height: 85px;
width: 230px;
background-image: url('https://i.ibb.co/w7RxNKn/Quote.png');
background-repeat: no-repeat;
background-size: 100%;
}

#sqpic {
position: absolute;
z-index: 2;
left: 10px;
top: 28px;
height: 50px;
width: 50px;
border: 6px solid #111;
background-image: url('https://i.imgur.com/FaRhOWR.png?1');
background-size: 100%;
background-repeat: no-repeat;
filter: grayscale(0%);
}

#sqpic2 {
position: absolute;
z-index: 2;
right: 10px;
top: 28px;
height: 50px;
width: 50px;
border: 6px solid #111;
background-image: url('https://i.imgur.com/AnMwqRj.jpg');
background-size: 100%;
background-repeat: no-repeat;
filter: grayscale(0%);
}

#banner {
position: absolute;
z-index: 1;
left: 10px;
top: 100px;
border: 6px solid #111;
height: 100px;
width: 368px;
background-image: url('https://data.whicdn.com/images/262066941/original.gif');
background-repeat: no-repeat;
background-size: 100%;
background-position: center;
}

.overlay {
opacity: 0;
overflow: auto;
}

#banner:hover .overlay {
position: absolute;
opacity: 2;
left: 0px;
bottom: 0px;
height: 90px;
width: 357px;
background-color: #000;
color: #fff;
font-size: 10px;
font-family: 'Forum';
padding: 5px;
line-height: 13px;
overflow-y: auto;
}

#lilaes {
position: absolute;
z-index: 1;
left: 15px;
top: 215px;
height: 80px;
width: 368px;
background-image: url('https://cdn.shopify.com/s/files/1/0443/2929/files/BlackRoseDivider_600x.gif?v=1497175951');
background-repeat: no-repeat;
background-size: 100%;
opacity: 0.3;
}

#content {
position: absolute;
z-index: 1;
bottom: 10px;
right: 10px;
background-color: #000;
border: 3px solid #111;
height: 224px;
width: 140px;
padding: 5px;
color: #fff;
font-size: 10px;
font-family: 'Forum';
line-height: 13px;
overflow-y: auto;
}

#rectimg {
position: absolute;
z-index: 1;
left: 10px;
border: 3px solid #111;
bottom: 10px;
height: 234px;
width: 146px;
background-image: url('https://i.redd.it/f72eiwi4mdc41.jpg');
background-size: 130%;
background-repeat: no-repeat;
}

#rectimg:hover {
background-image: url('https://pbs.twimg.com/media/Cvzk0uZXYAAgDkH.jpg');
}

#tab1 {
position: absolute;
z-index: 2;
left: 177px;
bottom: 208px;
background-color: transparent;
border-radius: 0%;
background-image: url('https://assets.stickpng.com/images/5871675d7b7f6103e35c6c88.png');
background-size: 100%;
background-repeat: no-repeat;
height: 40px;
width: 40px;
opacity: 0.8;
}

#tab2 {
position: absolute;
z-index: 2;
left: 177px;
bottom: 142px;
background-color: transparent;
border-radius: 0%;
background-image: url('https://assets.stickpng.com/images/5871675d7b7f6103e35c6c88.png');
background-size: 100%;
background-repeat: no-repeat;
height: 40px;
width: 40px;
opacity: 0.8;
}

#tab3 {
position: absolute;
z-index: 2;
left: 177px;
bottom: 76px;
background-color: transparent;
border-radius: 0%;
background-image: url('https://assets.stickpng.com/images/5871675d7b7f6103e35c6c88.png');
background-size: 100%;
background-repeat: no-repeat;
height: 40px;
width: 40px;
opacity: 0.8;
}

#tab4 {
position: absolute;
z-index: 2;
left: 177px;
bottom: 10px;
background-color: transparent;
border-radius: 0%;
background-image: url('https://assets.stickpng.com/images/5871675d7b7f6103e35c6c88.png');
background-size: 100%;
background-repeat: no-repeat;
height: 40px;
width: 40px;
opacity: 0.8;
}

h1 {
font-family: 'Niconne';
font-size: 15px;
color: #501A1A;
text-transform: ;
letter-spacing: 2px;
border-bottom: 0px solid #;
background-image: url('');
background-color: #21000c;
text-align: center;
margin-right: 0px;
margin-left: 1px;
line-height: 13px;
margin-top: 0px;
margin-bottom: 4px;
}

b {
color: #333;
font-family: 'Aladin';
font-size: 11px;
}

a {
font-family: 'Redressed';
color: #ff0000;
font-size: 11px;
text-decoration: none;
}

a:hover {
color: #777;
}

</style>
<div id="profile" oncontextmenu="return false;">
<div id="container">
<a href="#2"><div id="tab1"></div></a>
<a href="#3"><div id="tab2"></div></a>
<a href="#4"><div id="tab3"></div></a>
<a href="#1"><div id="tab4"></div></a>
<div id="topimg"></div>
<div id="quote"></div>
<div id="sqpic"></div>
<div id="sqpic2"></div>
<div id="banner"><div class="overlay"><h1>Out of Character</h1><B>00.</B> Coded by <a href="//roleplay.chat/profile.php?user=Sailor+Chuu" target="_blank">Chuu</a> for Danton. Do not steal!! </div></div>
<div id="lilaes"></div>
<div id="rectimg"></div>
<div id="content">
<div style="height: 224px; overflow-y: hidden;">
<a name="1"></a>
<div style="height: 224px; overflow: auto;">
<div style="margin: 0 auto; width: 13.7em;">
<h1>Statistics</h1>
<B>Stat:</B> <font style=float:right>Stat.</font><br>
<B>Stat:</B> <font style=float:right>Stat.</font><br>
<B>Stat:</B> <font style=float:right>Stat.</font><br>
<B>Stat:</B> <font style=float:right>Stat.</font><br>
<B>Stat:</B> <font style=float:right>Stat.</font><br>
<B>Stat:</B> <font style=float:right>Stat.</font><br>
<B>Stat:</B> <font style=float:right>Stat.</font><br>
<B>Stat:</B> <font style=float:right>Stat.</font><br>
<B>Stat:</B> <font style=float:right>Stat.</font><br>
<B>Stat:</B> <font style=float:right>Stat.</font><br>
<B>Stat:</B> <font style=float:right>Stat.</font><br>
<B>Stat:</B> <font style=float:right>Stat.</font><br>
<B>Stat:</B> <font style=float:right>Stat.</font><br>
<B>Stat:</B> <font style=float:right>Stat.</font><br>
<B>Stat:</B> <font style=float:right>Stat.</font><br>
<B>Stat:</B> <font style=float:right>Stat.</font><br>
<B>Stat:</B> <font style=float:right>Stat.</font><br>
<B>Stat:</B> <font style=float:right>Stat.</font><br>
</div></div>

<a name="2"></a>
<div style="height: 224px; overflow: auto;">
<div style="margin: 0 auto; width: 13.7em;">
<h1>Box 2</h1>
</div></div>

<a name="3"></a>
<div style="height: 224px; overflow: auto;">
<div style="margin: 0 auto; width: 13.7em;">
<h1>Box 3</h1>
</div></div>

<a name="4"></a>
<div style="height: 224px; overflow: auto;">
<div style="margin: 0 auto; width: 13.7em;">
<h1>Last Box</h1>
</div></div></div></div>
</div>