About me 01

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

             <!-------------------------------------------
                           Theme by Clara
                  http://mandrakescry.tumblr.com/
                      DON'T REMOVE THE CREDITS
            -------------------------------------------->

<head>


<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>{Title}</title>
<link rel="shortcut icon" href="{Favicon}" />
<link rel="alternate" type="application/rss+xml" href="{RSS}" />

<script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>

<link href='http://fonts.googleapis.com/css?family=Crete+Round' rel='stylesheet' type='text/css'>

<link href='http://fonts.googleapis.com/css?family=Coustard' rel='stylesheet' type='text/css'>


<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
<script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
<script>
(function($){
$(document).ready(function(){
$("a[title]").style_my_tooltips({
tip_follows_cursor:true,
tip_delay_time:90,
tip_fade_speed:600,
attribute:"title"
});
});
})(jQuery);
</script>


<style type="text/css">

#s-m-t-tooltip{
max-width:250px;
z-index:999999;
margin-top:-5px;
margin-left:-45px;
padding:2px 2px;
border-radius:3px;
letter-spacing:2px;
text-transform:uppercase;
border:1px solid #fff;
background:#313231;
color:#fff;
font-family:trebuchet ms;
font-size:8px;
box-shadow:1px 1px 3px rgba(0,0,0,.1);}


a {
color:#000000;
text-decoration:none;
-moz-transition-duration:0.5s;
-webkit-transition-duration:0.5s;
-o-transition-duration:0.5s;
}

a:hover {
color:#90b2bb;
text-decoration:none;
-moz-transition-duration:0.5s;
-webkit-transition-duration:0.5s;
-o-transition-duration:0.5s;
}


::-webkit-scrollbar {
height:8px;
width:5px}

::-webkit-scrollbar-thumb:vertical {
background-color:#313231;
height:50px;
}

::-webkit-scrollbar-thumb:horizontal {
background-color:#313231;
height:8px!important;
}


body {
background-image: url('http://static.tumblr.com/j0zksi4/LBGmyrhue/dark_geometric.png');
background-color:#313231;
background-attachment:fixed;
background-repeat:repeat;
background-position:right;
font-family:cambria;
font-weight:normal;
}


h1 {
font-weight:normal;
font-size:10px;
text-align:center;
font-style:normal;
line-height:80%;
letter-spacing:1px;
text-transform:uppercase;
color:#a8a6a6;
}

h2 {
font-size:18px;
text-align:left;
line-height:100%;
letter-spacing:-0.5px;
font-family: vernada;
color:#3c657c;
font-weight:normal;
padding:5px;
padding-bottom:2px;
}


blockquote {
border-left:2px solid #000;
padding-left:5px;
margin:5px;
}


#content {
position:fixed;
left:35%;
top:30%;
background-image: url('http://static.tumblr.com/c95706edcd409f8184e1bbaa6a8c53cd/9gqe4bq/UGSmu3tio/tumblr_static_tumblr_mizm45muwe1raxlx4o3_250.jpg');
width:510px;
height:290px;
padding:30px;
border-radius:3px;
}


#menu{
speak:normal;
width:130px;
}


.stitle {
background-color: transparent;
display: inline-block;
padding: 3px;
text-align: center;
background: #313231;
color: #fff;
margin:1px;
width:140px;
font-family: 'Crete Round', serif;
letter-spacing:5px;
font-size:15px;
margin-left:8px;
margin-bottom:8px;
cursor: pointer;
text-transform:uppercase;
border-radius: 3px;
-webkit-transition: all 0.5s linear;
-moz-transition: all 0.5s linear;
transition: all 0.5s linear;
}


.sb img {
background: #ededed;
width:100px;
height:100px;
margin-left:8px;
border: 8px solid #313231;
padding:15px;
margin-bottom:5px;
}

#things{
width:135px;
margin-bottom:8px;
margin-left:9px;
font-size: 10px;
color:#fff;
background:#313231;
line-height: 18px;
letter-spacing:2px;
text-align:left;
line-height:10px;
padding:5px;
text-transform:uppercase;
border-radius: 3px;
-webkit-transition: all 0.5s linear;
-moz-transition: all 0.5s linear;
transition: all 0.5s linear;
}

#box{
width:320px;
height:265px;
margin-left:159px;
margin-top:-298px;
font-size: 10px;
color:#a8a6a6;
background: #ededed;
border: 8px solid #313231;
line-height: 18px;
letter-spacing:2px;
text-align:left;
line-height:10px;
padding:5px;
border-radius: 3px;
overflow:auto;
-webkit-transition: all 0.5s linear;
-moz-transition: all 0.5s linear;
transition: all 0.5s linear;
}

h2 {
color:#90b2bb;
margin:0px 0px 5px 0px;
font-weight:500;
border-bottom:1px solid #d4d4d4;
padding-bottom:5px;
font-size:18px;
}
h2 span {
color:#313231;
font-family:georgia;
font-size:22px;
font-weight:500;
text-transform:uppercase;
}

#links {
float:left;
margin-top:-280px;
margin-left:-10px;
display: inline-block;
text-align: center;
background: #313231;
width: 10px;
height: 10px;
border-radius: 10px;
-webkit-transition-duration: 1s;
-moz-transition-duration: 1s;
transition-duration: 1s;
z-index:10000000000;
}


    {CustomCSS}
</style>

</head>

<body>

<div id="content">

<div id="menu">
<div class="sb"><img src="http://static.tumblr.com/j0zksi4/uQnmys1zo/untitled-1.jpg"/>
<div class="stitle">about me</div><br>
<div id="things">Name: </div>
<div id="things">Age: </div>
<div id="things">Gender: </div>
<div id="things">Country: </div>
</div>
<div id="box">
<h2><span>i</span>ntroduction</h2>
<p>
PUT YOUR TEXT HERE
<p>
<h2><span>T</span>itle</h2>
<p>
PUT YOUR TEXT HERE
<p>

<br/>
</div>


<a href="/" title="home" id="links"></a><br>
<a href="/ask" title="askbox" id="links"></a><br>
<a href="http://mandrakescry.tumblr.com/" title="credit" id="links"></a><br>

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


</body>


</html>