LEE-KUN [DONE]

<style type="text/css">
@import url('https://fonts.googleapis.com/css?family=Kaushan+Script|Permanent+Marker|Rock+Salt|Ubuntu+Condensed|Rokkitt|Trade+Winds');

body {
background-color: #;
background-image: linear-gradient(to bottom left, #118B2B, #0E6F23, #0B571C, #093B13);
background-position: center;
background-size: 100%;
background-repeat:no-repeat;
}

#profile {
background-color: transparent;
border:0px;
}

#whole {
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;
}

#container {
position: absolute;
z-index: 4;
bottom: 6vh;
left: 32vw;
height: 384px;
width: 880px;
border: 2px solid #0E6F23;
background: #118E2C;
background-image: url('https://www.transparenttextures.com/patterns/az-subtle.png');
background-repeat: repeat;
background-size: 8%;
}

#tit {
position: absolute;
z-index: 5;
left: 68.8vw;
transform: skew(-27deg);
bottom: 46vh;
height: 120px;
width: 320px;
background-color: transparent;
background-image: url('http://i.picpar.com/bKbf.png');
background-repeat: no-repeat;
background-size: 100%;
}

#bar1 {
position: absolute;
z-index: 5;
left: 32.17vw;
bottom: 62vh;
border: 1px solid #0E6F23;
background: #0E6F23;
height: 7px;
width: 500px;
}

#bar2 {
position: absolute;
z-index: 5;
left: 32.17vw;
bottom: 59vh;
border: 1px solid #0E6F23;
background: #0E6F23;
height: 7px;
width: 500px;
}

#bar3 {
position: absolute;
z-index: 5;
left: 25.4vw;
bottom: 29.5vh;
border: 1px solid #0E6F23;
transform: rotate(90deg);
background: #0E6F23;
height: 7px;
width: 310px;
}

#bar4 {
position: absolute;
z-index: 5;
left: 27vw;
bottom: 29.5vh;
border: 1px solid #0E6F23;
transform: rotate(90deg);
background: #0E6F23;
height: 7px;
width: 310px;
}

#bar5 {
position: absolute;
z-index: 5;
left: 51.3vw;
bottom: 29.5vh;
border: 1px solid #0E6F23;
transform: rotate(90deg);
background: #0E6F23;
height: 7px;
width: 310px;
}

#bar6 {
position: absolute;
z-index: 5;
left: 52.9vw;
bottom: 29.5vh;
border: 1px solid #0E6F23;
transform: rotate(90deg);
background: #0E6F23;
height: 7px;
width: 310px;
}

#image1 {
position: absolute;
z-index: 5;
left: 70.99vw;
bottom: -11.4vh;
height: 500px;
width: 350px;
background-color: transparent;
border-radius: 0%;
background-image: url('https://i.pinimg.com/originals/05/ed/df/05eddf3cd976329358428430f1f52d65.png');
background-repeat: no-repeat;
background-size: 110%;
opacity: 0.95;
}

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

#image1:hover .overlay {
position: absolute;
bottom: 20vh;
left: -4vw;
height: 150px;
width: 250px;
background: #FFF;
border: 1px dashed yellow;
font-family: 'Ubuntu Condensed';
color: #666;
font-size: 10px;
line-height: 11px;
text-align: left;
padding: 5px;
overflow-y: auto;
opacity: 2;
}

#info {
position: absolute;
z-index: 6;
bottom: 8.6vh;
left: 41vw;
height: 300px;
width: 260px;
background-color: transparent;
border-radius: 0%;
background-image: url('https://i.pinimg.com/564x/94/83/71/948371e5b3a9381c825db1f15ae77905.jpg');
background-repeat: no-repeat;
background-position: center, center;
background-size: 100%;
}

#info:hover .overlay {
position: absolute;
bottom: 0vh;
left: 0vw;
height: 290px;
width: 249px;
background: #FFF;
border: 1px dashed yellow;
font-family: 'Ubuntu Condensed';
color: #666;
font-size: 10px;
line-height: 11px;
text-align: left;
padding: 5px;
overflow-y: auto;
opacity: 2;
}

#icon1 {
position: absolute;
z-index: 6;
left: 34vw;
bottom: 53.5vh;
border: 5px solid #0e6f23;
height: 90px;
width: 90px;
border-radius: 50%;
box-shadow: 1px 1px 10px;
background-image: url('https://i.pinimg.com/originals/aa/da/27/aada27b560097713798435e8f2dd0760.png');
background-repeat: no-repeat;
background-size: 100%;
}

#icon2 {
position: absolute;
z-index: 6;
left: 59.8vw;
bottom: 53.5vh;
border: 5px solid #0e6f23;
height: 90px;
width: 90px;
border-radius: 50%;
box-shadow: 1px 1px 10px #000;
background-image: url('https://i.pinimg.com/736x/d7/25/f7/d725f70c6faef9feb0e34f2dd130129a.jpg');
background-repeat: no-repeat;
background-size: 100%;
}

#gay {
position: absolute;
z-index: 5;
left: 39.8vw;
bottom: 53vh;
height: 90px;
width: 300px;
border-radius: 0%;
background-image: url('https://gifprint.s3.amazonaws.com/p/gif/87010/62a6d1a0bf2201376ecf6685052b74e9.gif');
background-repeat: no-repeat;
background-size: 100%;
}

h1 {
font-family: 'Kaushan Script';
text-align: center;
font-size: 13px;
background-color: #118B2B;
line-height: 13px;
margin-top: 0px;
margin-bottom: 3px;
color: yellow;
}

b {
font-family: 'Rokkit';
text-transform: uppercase;
color: #0E6F23;
}

a {
text-decoration: none;
font-family: 'Rock Salt';
font-size: 9px;
color: orange;
}

#reset {
position: absolute;
z-index: 7;
left: 89vw;
bottom: 7vh;
height: 36px;
width: 36px;
border-radius: 0%;
background-color: transparent;
background-image: url('https://media4.giphy.com/media/WmigT28kb3cCWSF2x5/giphy.gif');
background-size: 100%;
background-repeat: no-repeat;
}

#tab1 {
position: absolute;
z-index: 7;
left: 87.8vw;
bottom: 13.9vh;
height: 36px;
width: 36px;
border-radius: 0%;
background-color: transparent;
background-image: url('https://media4.giphy.com/media/WmigT28kb3cCWSF2x5/giphy.gif');
background-size: 100%;
background-repeat: no-repeat;
}

#tab2 {
position: absolute;
z-index: 7;
left: 86.4vw;
bottom: 19.7vh;
height: 36px;
width: 36px;
border-radius: 0%;
background-color: transparent;
background-image: url('https://media4.giphy.com/media/WmigT28kb3cCWSF2x5/giphy.gif');
background-size: 100%;
background-repeat: no-repeat;
}

#tab3 {
position: absolute;
z-index: 7;
left: 88.4vw;
bottom: 24.7vh;
height: 36px;
width: 36px;
border-radius: 0%;
background-color: transparent;
background-image: url('https://media4.giphy.com/media/WmigT28kb3cCWSF2x5/giphy.gif');
background-size: 100%;
background-repeat: no-repeat;
}

#tab4 {
position: absolute;
z-index: 7;
left: 90.5vw;
bottom: 30vh;
height: 36px;
width: 36px;
border-radius: 0%;
background-color: transparent;
background-image: url('https://media4.giphy.com/media/WmigT28kb3cCWSF2x5/giphy.gif');
background-size: 100%;
background-repeat: no-repeat;
}

</style>

<div id="whole" oncontextmenu="return false;">
<div id="container"></div>
<div id="tit"></div>
<div id="bar1"></div>
<div id="bar2"></div>
<div id="bar3"></div>
<div id="bar4"></div>
<div id="bar5"></div>
<div id="bar6"></div>
<div id="icon1"></div>
<div id="gay"></div>
<a href="#1"><div id="reset"></div></a>
<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="#5"><div id="tab4"></div></a>
<a href="//roleplay.chat/profile.php?user=Medich" target="_blank"><div id="icon2"></div></a>
<div id="image1"><div class="overlay"><h1>OOC</h1>
<B>00.</B> Code was created by <a href="//roleplay.chat/profile.php?use=Sailor+Chuu">Chuu</a> for Rock Lee! No touchy! It is best viewed in 100% zoom.</div></div>
<div id="info"><div class="overlay">
<div style="height: 292px; overflow-y: hidden;">
<a name="1"></a>
<div style="height: 292px; overflow: auto;">
<div style="margin: 0 auto; width: 24.9em;">
<h1>Statistics</h1>
<B>Given Name:</B> <font style=float:right>Rock Lee.</font><br>
<B>Katakana:</B> <font style=float:right>ロック・リー.</font><br>
<B>Nickname(s):</B> <font style=float:right>Bushy Brows ; Handsome Devil.</font><br>
<B>Clan:</B> <font style=float:right>Lee Clan.</font><br>
<B>Age:</B> <font style=float:right>19-23.</font><br>
<B>D.o.B.:</B> <font style=float:right>November 27th (♐︎).</font><br>
<B>P.o.B.:</B> <font style=float:right>Konohagakure, Ho no Kuni.</font><br>
<B>Gender:</B> <font style=float:right>Male (♂).</font><br>
<B>Species:</B> <font style=float:right>Humanoid.</font><br>
<B>Classification:</B> <font style=float:right>Taijutsu Specialist.</font><br>
<B>Orientation:</B> <font style=float:right>Heterosexual.</font><br>
<B>Marital:</B> <font style=float:right>Single.</font><br>
<B>Alignment:</B> <font style=float:right>Good.</font><br>
<B>Affiliation:</b> <font style=float:right>Konohagakure ; ASF.</font><br>
<B>Former:</b> <font style=float:right>Team Guy.</font><br>
<B>Occupation:</B> <font style=float:right>Exam Proctor.</font><br>
<h1> Appearance </h1>
<B>Hair Color:</B> <font style=float:right>Black.</font><br>
<B>Hair Style:</B> <font style=float:right>Bowl Cut.</font><br>
<B>Eye Color:</B> <font style=float:right>Onyx.</font><br>
<B>Skin Tone:</B> <font style=float:right>Tanned.</font><br>
<B>Complexion:</B> <font style=float:right>Scarred.</font><br>
<B>Height:</B> <font style=float:right>177 cm / 5'8".</font><br>
<B>Blood Type:</b> <font style=float:right>A.</font><br>
<B>Scent:</B> <font style=float:right>Bowl Cut Babe.</font>
</div></div>

<a name="2"></a>
<div style="height: 292px; overflow: auto;">
<div style="margin: 0 auto; width: 24.9em;">
<h1>Headcanons</h1>
</div></div>

<a name="3"></a>
<div style="height: 292px; overflow: auto;">
<div style="margin: 0 auto; width: 24.9em;">
<h1>Bingo Book</h1>
</div></div>

<a name="4"></a>
<div style="height: 292px; overflow: auto;">
<div style="margin: 0 auto; width: 24.9em;">
<h1>Personality</h1>
</div></div>

<a name="5"></a>
<div style="height: 292px; overflow: auto;">
<div style="margin: 0 auto; width: 24.9em;">
<h1>Connections</h1>
</div></div></div></div></div>