nw code

<style>

 html, body { overflow: hidden; height: 100% }

#box1 { margin:120px 10px 10px 10px;
	padding:10px;
	background-color: rgba(0, 0, 0, 0.9);
	border:1px solid #000000;
	border-radius:20px;
		-moz-border-radius:20px;
		-webkit-border-radius:20px;
width:550;
margin-left:70px;
margin-top:10px;
}


#box3 {margin:120px 10px 10px 10px;
	padding:10px;
	background-color: rgba(0, 0, 0, 0.9);
	border:1px solid #000000;
	border-radius:20px;
		-moz-border-radius:20px;
		-webkit-border-radius:20px;
width:550;
margin-left:70px;
margin-top:10px;
}

.button1{position:absolute;top:20px;left:-70;right:0;margin:auto;background:#013;height:20px;width:20px;border:1px solid rgba(0,0,0,0.8);font-size:20px;line-height:19px;text-decoration:none;	border-radius:20px;
		-moz-border-radius:20px;
		-webkit-border-radius:20px;}

.button2{position:absolute;top:20px;left:160;right:0;margin:auto;background:#013;height:20px;width:20px;border:1px solid rgba(0,0,0,0.8);font-size:20px;line-height:19px;text-decoration:none;	border-radius:20px;
		-moz-border-radius:20px;
		-webkit-border-radius:20px;}

.button3{position:absolute;top:20px;left:390;right:0;margin:auto;background:#013;height:20px;width:20px;border:1px solid rgba(0,0,0,0.8);font-size:20px;line-height:19px;text-decoration:none;	border-radius:20px;
		-moz-border-radius:20px;
		-webkit-border-radius:20px;}
.button4{position:absolute;top:20px;left:620;right:0;margin:auto;background:#013;height:20px;width:20px;border:1px solid rgba(0,0,0,0.8);font-size:20px;line-height:19px;text-decoration:none;	border-radius:20px;
		-moz-border-radius:20px;
		-webkit-border-radius:20px;}
.button0{position:absolute;top:20px;left:-300;right:0;margin:auto;background:#013;height:20px;width:20px;border:1px solid rgba(0,0,0,0.8);font-size:20px;line-height:19px;text-decoration:none;	border-radius:20px;
		-moz-border-radius:20px;
		-webkit-border-radius:20px;}

.button1:hover, .button2:hover, .button3:hover, .button4:hover,.button0:hover{background:white;box-shadow: 0px 0px 5px #ffffff;border:1px solid rgba(255,255,255,0.8);}

.tabbox{padding:10px;
	background-color: rgba(0, 0, 0, 0.9);
	border:1px solid #000000;
	border-radius:20px;
		-moz-border-radius:20px;
		-webkit-border-radius:20px;
width:550;
margin-left:70px;
margin-top:10px;}
.tabbox:target{z-index:0;transition:1s linear;height:400;
overflow:scroll;}

/* unvisited link */
a:link {
 color: #ccc;
}

/* visited link */
a:visited {
 color: #05c;
}

/* mouse over link */
a:hover {
 color: #FFF;
}

/* selected link */
a:active {
 color: blue;
}

.op-tbl .ooc {
	font-style:italic;
}
.op-tbl p {
	padding:2px 0px;
	margin:0px;
	text-indent:35px;
}
.op-tbl b {
	color:#CBCACA;
	letter-spacing:-.2px;
	text-shadow:#435743 1px 1px 0;
}
.op-tbl {
	background-color:#324232;
	background-image:url(http://i.imgur.com/wdmXUka.png);
	background-position:top left;
	background-repeat:repeat;
background-size:cover;
	border:2px solid #000;
	font-family: georgia, serif;
	font-size:12px;
	color:#FFFFFF;
	letter-spacing:.4px;
	word-spacing:.3px;
	line-height:16px;
	width:650px;
	text-align:center;
	border-radius:20px;
		-moz-border-radius:20px;
		-webkit-border-radius:20px;
height:500;
overflow: hidden; height: 100%

 html, body { overflow: hidden; height: 100% }


}
.op-tbl-border {
	width:554px;
	border:1px solid #transparent;
	margin:0 auto;
}
.op-tbl .inner {
	padding:10px;
padding-top:50px;
	background-color: rgba(0, 0, 0, 0.9);
	border:1px solid #000000;
	border-radius:20px;
		-moz-border-radius:20px;
		-webkit-border-radius:20px;
width:610;
margin-left:10px;
margin-top:10px;
height:460;
overflow:scroll;
margin-bottom:200px;
}

body {

background-color: #000;
background-image: url(http://i.imgur.com/WNRdqNn.png);
background-attachment: fixed;
background-position: center center;
background-repeat:repeat;
background-size:;
font-family: Times New Roman;
font-variant: normal;
font-size: 70%;
color: #666666;
overflow:auto;}

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

 ::-webkit-scrollbar-thumb {
 background-color: #3972A9;
 -webkit-border-radius: 20px;
 border-radius: 20px;
 }

/* Tooltip container */
.tooltip {
 position: relative;
 display: inline-block;
 border-bottom: 1px dotted black; /* If you want dots under the hoverable text */
}

/* Tooltip text */
.tooltip .tooltiptext {
 visibility: hidden;
 width: 120px;
 background-color: #000;
 color: #fff;
 text-align: center;
 padding: 5px 0;
 border-radius: 6px;
z-index: 3;

 /* Position the tooltip text */
 position: absolute;
 z-index: 3;
 bottom: 125%;
 left: 50%;
 margin-left: -60px;

 /* Fade in tooltip */
 opacity: 0;
 transition: opacity 1s;
}

/* Tooltip arrow */
.tooltip .tooltiptext::after {
 content: "";
 position: absolute;
 top: 100%;
 left: 50%;
 margin-left: -5px;
 border-width: 5px;
 border-style: solid;
 border-color: #000 transparent transparent transparent;
}

/* Show the tooltip text when you mouse over the tooltip container */
.tooltip:hover .tooltiptext {
 visibility: visible;
 opacity: 1;
}



</style>
<p><div class="fr-credit-link">

 </div>
 <style>
 .fr-credit-link { padding:10px 0; font-size:11px; font-style:italic; }
 /* Reminder: do not remove this credit link, as per the terms of Forum Roleplay's licenses (http://forumroleplay.com/about/license/)*/
 </style>
<a href="#0" class="button0"></a>
<a href="#1" class="button1"></a>
<a href="#2" class="button2"></a>
<a href="#3" class="button3"></a>
<a href="#4" class="button4"></a>
<div class="op-tbl-border">
<div class="op-tbl">
<div id="0" class="inner">
<p class="ooc">

Tell me what you know! Tell me what you gone and done now!</br>
			</p>
<p>
				<div align = "center"><font face="Courier">
<img src = "http://orig08.deviantart.net/3e11/f/2016/335/5/e/f2u_dark_aesthetic_divider_by_darknyxgoddess-daq7huu.png">
<hr>
<img src="http://img02.deviantart.net/44f2/i/2006/128/e/2/0096_by_adsero.gif"> <div class="tooltip">Name
 <span class="tooltiptext">Levi</span>
</div> | <div class="tooltip">Age
 <span class="tooltiptext">24</span>
</div> | <div class="tooltip">Sexuality
 <span class="tooltiptext">Demi/Pansexual</span>
</div>| <div class="tooltip">Pronouns
 <span class="tooltiptext">She/Her/They/Them</span>
</div> <img src="http://img02.deviantart.net/44f2/i/2006/128/e/2/0096_by_adsero.gif"></br></br>
This is a purely OOC profile so please don't expect any RP. I have plenty of characters you can ask about!
<hr><img src = "http://orig01.deviantart.net/f81a/f/2016/024/4/d/you_re_creepy_by_omnivore_daydreams-d9p7xbq.png"></br>
<img src = "http://orig11.deviantart.net/27ea/f/2015/336/e/1/e152dcb5a2166539388452e0454f507f-d9irv5i.png">
<hr>
Usually coding on this alt and experimenting with stuff. If you wanna use it, go ahead. P.S I love table codes.</br>
Lots of aesthetic stuff.</br>
All the stuff here is free to use including the code.</br>
Loves music. Really bad at socializing but can be really friendly. Kicks themself way too much</br>
p.s hover over the text at the top! :D
</br>
<a href="">link 1</a>|<a href="">link 2</a>|<a href="">link 3</a>
<hr>
<img src="http://orig11.deviantart.net/634d/f/2016/187/c/5/c598467f5d82e33aa02f8555029b73cd-da90t4d.png"></br><img src="http://orig00.deviantart.net/fb3f/f/2016/129/6/f/tumblr_inline_o44oxuqzhv1u0ckd6_500_by_toujika-da1vbyb.gif"><img src="http://orig08.deviantart.net/6060/f/2016/129/c/4/tumblr_mrmjfsgasa1sfwkzwo1_500_by_toujika-da1v7e0.gif"></br>
<img src="http://orig02.deviantart.net/6527/f/2016/140/1/6/space_and_time_continuum_by_abandonedcamera-da37vlo.gif"></br><img src="http://orig07.deviantart.net/d35e/f/2016/253/1/8/i_can_t_breath___long_divider_by_thecandycoating-dah681a.gif">
<hr>
<img src = "http://orig06.deviantart.net/39bf/f/2017/004/8/9/black_and_blue___deco_divider_by_thecandycoating-dau9x5d.png"></br>
Info layout by @seochivy
			</p>
</p></div>
</p></div>

<div id="1" class="inner"><center>───── ◈ ─────</center>
text here.</br><center>───── ◈ ─────</center>
</div>
<div id="2" class="inner">
Tab2
</div>
<div id="3" class="inner">
text here
</div>

<div id="4" class="inner">
text here too
</div>