Lancer of Red

<style type="text/css">
.pfor { display: none; }
#profile { background-color: transparent; border: none; }
</style>

<style type="text/css">

@import url(http://fonts.googleapis.com/css?family=Great+Vibes);

body {

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

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

	::-webkit-scrollbar-thumb {
	background-color: white;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	}

	a {color: #B30000;
	text-decoration: none;
	}

	a:hover {color: #ccc;
	text-decoration: line-through;
	cursor:
url('http://media.tumblr.com/e7f72e808c4dbe5006b9c3a30dbc9b79/tumblr_inline_mh67vhwGnR1rdqsqf.png');
	}

	*{cursor: url('http://media.tumblr.com/7c3edb626c8cf9435c5c0b2d6acceffd/tumblr_inline_mh67v6xNXM1rdqsqf.png'), default;
	}

#mainfuckinimage { position:fixed; left:-12px; top:-12px; border: solid 10px #A9221E; }
#imagetwo { position:fixed; left:572px; top:105px; border: double 3px #B30000; z-index: 10;}

.boxone {
background-color: #FFF;
background-image: url("");
color: #000;
border: 3px solid #B30000;
font-family: Calibri;
font-size: 12px;
line-height: 15px;
position: absolute;
left: 875px;
top: 105px;
height: 330px;
width: 250px;
margin: 5px;
z-index: 1;
overflow-y: hidden;
}

.slide {
Position: fixed;
Left: -300;
Top: 0px;
Height: 900px;
Width: 900px;
transition: all 1s ease-in-out; -webkit-transition: all 1s ease-in-out; -moz-transition: all 1s ease-in-out; -o-transition: all 1s ease-in-out; -ms-transition: all 1s ease-in-out;}

.slide:target {
Position: fixed;
Left: 10px;
transition: all 1s ease-in-out; -webkit-transition: all 1s ease-in-out; -moz-transition: all 1s ease-in-out; -o-transition: all 1s ease-in-out; -ms-transition: all 1s ease-in-out;

}

#padding { padding: 5px; }

#navi {
   position: fixed;
   left: 400;
   top: 170;
   text-align: center;
   width: 200px;
   z-index: 11; }
#navi a {
   display:inline-block;
   width: 20%;
   padding: 4px;
   font-family: tunga;
   font-size: 12px;
   text-transform: none;
   text-align: center;
   color: red;
   border: 1px solid #B30000;
   background-color: #000000;
   transition: all 0.8s ease-in-out;
   -moz-transition: all 0.8s ease-in-out;
   -webkit-transition: all 0.8s ease-in-out;}
#navi a:hover {
   color: #000000;
   background-color: #ffdd00;
   transition: all 0.5s ease-in-out;
   -moz-transition: all 0.5s ease-in-out;
   -webkit-transition: all 0.5s ease-in-out;}

h2 {

position: fixed;
right: 10px;
bottom: 0px;
font-family: Arial;
font-variant: normal;
font-weight: normal;
font-size: 100%;
color: #FFFFFF;}
</style>

<h2>Layout © <a href="http://pastebin.com/u/A_Bad_Bitch" target="_blank"><font color="#B30000">A Bad Bitch</font></a></h2>

<div id="navi">
<b><a href="#01">1</a><br><br><br>
<a href="#02">2</a><br><br><br>
<a href="#03">3</a><br><br><br>
<a href="#04">4</a></b>
</div>

<div id="mainfuckinimage">
<img src="MAIN IMG HERE" class="image" height="680px;" width="430px;">
</div>

<div id="imagetwo">
<img src="IMG OR GIF HERE" class="image" height="337px;" width="270px;">
</div>

<div id="01" class="slide">
<div class="boxone">
<div id="padding" align="justify">

This is a box that is supposed to be filled with info, though, it doesn't scroll unless you make it. Have fun with that though. You only get three boxes. So use the spaces carefully, alright?

</div></div></div>

<div id="02" class="slide">
<div class="boxone">
<div id="padding" align="justify">

tab 2

</div></div></div>

<div id="03" class="slide">
<div class="boxone">
<div id="padding" align="justify">

tab 3

</div></div></div>