Untitled

<html>
<script language="javascript">
document.title=("~Lyend Vi Victorian~");
function paraswitch()
{
document.getElementById("demo").innerHTML="Blank!!!";
}
</script>
<style>
@font-face { font-family: "littlefont"; src: url('http://static.tumblr.com/4yxykdm/NMJlre6xz/04b_03___1_.ttf'); }
::-webkit-scrollbar {
    height: 12px;
width: 12px;
background: #ffffff;
    }
::-webkit-scrollbar-thumb {
    background: #333333;
    -webkit-border-radius: .8ex;
    -webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.75);
}
::-webkit-scrollbar-corner {
    background: #000;
</style>
<style>
#layer1
{
position:absolute;
top:0px;
left:0px;
width:100%;
height:100%;
background-color:#000000;
background-image:url('http://i.imgur.com/JxM7d.jpg')
}
#a
{
display: block;
width: 50px;
float: left;
height: 15px;
font-family: calibri;
opacity: 0.4;
filter:alpha(opacity=40);
color: transparent;
font-size: 8px;
text-align: center;
border-bottom: 0px solid#B7DFC8;
border-bottom-width: 0px;
border-bottom-style: solid;
border-bottom-color: #B7DFC8;
padding-top: 5px;
padding-bottom: 5px;
}
#a:hover
{
height: 35px;
z-index:+1;
-webkit-transition: height 0.5s ease-in-out;
		-moz-transition: height 0.5s ease-in-out;
        -ms-transition: height 0.5s ease-in-out;
        -o-transition: height 0.5s ease-in-out;
		transition: height 0.5s ease-in-out;
opacity: 0.8;
filter:alpha(opacity=80);
}
#sel
{
position:fixed;
display: block;
top:80px;
left:0px;
width:100%;
float: left;
height: 24px;
Background-color:#000;
opacity: 0.5;
filter:alpha(opacity=50);
}
/*Title for the intro Text 62px giving space for the sel*/
#title
{
font-size:62px;
position:relative;
top:0;
font-family:La Belle Aurore;
color:#fff;
}
.text
{
Font-family:times new roman;
font-size:9px;
padding-top:0px;
padding-bottom:50px;
padding-right:50px;
padding-left:50px;
position:fixed;
Top:125px;
left:40px;
opacity: 0.5;
filter:alpha(opacity=50);
Background-color:#666;
color:#fff;
overflow:auto;
}
.text:hover
{
-webkit-transition: all 0.5s linear;
		-moz-transition: all 0.5s linear;
        -ms-transition: all 0.5s linear;
        -o-transition: all 0.5s linear;
		transition: all 0.5s linear;
filter:alpha(opacity=90);
opacity: 0.9;
}
</style>
<link href="http://fonts.googleapis.com/css?family=La+Belle+Aurore" rel="stylesheet">
<div id="layer1"></div>
<div id="Title"><Center>Lyend Vi Victorian</div></center>
<div id="sel">
<span onclick=
"document.getElementById('info').innerHTML=document.getElementById('1').innerHTML; "><div id="a" style="background-color:#626262" ;><font color="#ffffff">Reference Guide</font></div></span>
<span onclick=
"document.getElementById('info').innerHTML=document.getElementById('2').innerHTML; "><div id="a" style="background-color:#626262" ;><font color="#ffffff">Lyend Vi Victorian</font></div></span>
<span onclick=
"document.getElementById('info').innerHTML=document.getElementById('3').innerHTML; "><div id="a" style="background-color:#626262" ;><font color="#ffffff">Weapons</font></div></span>
<span onclick=
"document.getElementById('info').innerHTML=document.getElementById('4').innerHTML; "><div id="a" style="background-color:#626262" ;><font color="#ffffff">Abilities</font></div></span>
<span onclick=
"document.getElementById('info').innerHTML=document.getElementById('5').innerHTML; "><div id="a" style="background-color:#626262" ;><font color="#ffffff">History</font></div></span>
<span onclick=
"document.getElementById('info').innerHTML=document.getElementById('6').innerHTML; "><div id="a" style="background-color:#626262" ;><font color="#ffffff">Family/Clan</font></div></span>
<span onclick=
"document.getElementById('info').innerHTML=document.getElementById('7').innerHTML; "><div id="a" style="background-color:#626262" ;><font color="#ffffff">Battle Requirements</font></div></span></div>
<div id="1" style="display:none"><div class="Text">11</div>
</div>
<div id="2" style="display:none"><div class="Text">1</div>
</div>
<div id="3" style="display:none"><div class="Text">2</div>
</div>
<div id="4" style="display:none"><div class="Text">3</div>
</div>
<div id="5" style="display:none"><div class="Text">4</div>
</div>
<div id="6" style="display:none"><div class="Text">5</div>
</div>
<div id="7" style="display:none"><div class="Text">6</div>
</div>
<div id="info"><div class="Text">Welcome to my</div>
</div></div></html>