about pg #04 : koi

<!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">
<head>

<!--

･.･:☆･.･:☆･.･:☆･.･:☆･.･:☆･.･:☆･.･:☆･.･:☆･.･:☆

    ABOUT PG #04 : KOI @ R-EIORA.TUMBLR.COM

       /DON'T REMOVE THIS COMMENT/

･.･:☆･.･:☆･.･:☆･.･:☆･.･:☆･.･:☆･.･:☆･.･:･.･:☆☆

-->

<title>{Title}</title>
<link rel="shortcut icon" href="{Favicon}">

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<style type="text/css">

::-webkit-scrollbar{height: 10px;width: 1.5px;background: #fff;}

::-webkit-scrollbar-thumb:vertical{background: #353a3d;}

body {font: 10px new courier; font-style:italic;color:#000;margin:0px;padding:0px;background:#fff;}

a {text-decoration:none;cursor:help;color:#000;-webkit-transition:all 0.4s ease-in-out;-moz-transition:all 0.4s ease-in-out;-o-transition:all 0.4s ease-in-out;transition:all 0.4s ease-in-out;}

a:link, a:active, a:visited {text-decoration: none; opacity: 0.8; -moz-transition: 0.3s ease-in; -webkit-transition: 0.3s ease-in; -o-transition: 0.3s ease-in; transition: 0.3s ease-in;}

a:hover{color:#ccc;}

#all{margin: 0 auto;background: url(http://static.tumblr.com/palmvjm/jo1msptc8/bg.dt.png); width: 600px;height: 254px;margin-top: 70px;box-shadow: 2px 2px 5px #e1e1e1;}

/*change the additional info box here*/#koi{background:#fff;opacity: 0.7;width: 260px;height: 235px;position: absolute;margin-left: 330px;margin-top: 10px;}

#cont{margin: 10px;width: 240px;height: 210px;overflow: auto;text-align: justify;padding-right: 5px;letter-spacing:1px;background: url(http://media.tumblr.com/tumblr_m1zct5wMeK1qim6y5.png) repeat;text-transform: lowercase;}

/*change the navi links here*/#navi{height: 150px;width: 20px;text-align: center;position:fixed;margin-left:260px;margin-top:50px;background:url(http://static.tumblr.com/5qhn83f/NdRmqx1xb/capture-20130801-21h5747.png) repeat; }

#navi a{width: 70px;height: 30px;background:url(http://static.tumblr.com/5qhn83f/NdRmqx1xb/capture-20130801-21h5747.png) repeat; opacity: 0.6;letter-spacing: 2px;text-transform: lowercase;font-style: italic;display: block;float: left;margin-right: 10px;text-align: center;line-height: 40px;box-shadow: 2px 2px 5px #e1e1e1;font-family:courier new; font-size:8px;-webkit-transition: all 0.7s ease-out;-moz-transition: all 0.7s ease-out;-o-transition: all 0.7s ease-out;border-left:6px solid #fff;}

#navi a:hover{opacity: 0.8; border-left:40px solid #fff; -webkit-transition: all 0.7s ease-out;-moz-transition: all 0.7s ease-out;-o-transition: all 0.7s ease-out;}

/*change the bg image here*/#icon{z-index:-999;position:fixed;opacity:.8;top:0px;left:-30px;margin:auto;}

#un {float:right;width: 200px;margin-top:-110px;margin-right:680px;}

.etat {font: 9px new courier;font-style:italic; margin-top: 3px; letter-spacing: 3px; color: #939393;text-transform:lowercase;border-bottom: 1px solid #ccc;}

.sub {text-align: justify; letter-spacing: 1px; margin-top: 15px;}

/*change the title name here*/.moon {font-size: 9px;font-family: tinytots;letter-spacing:7px;color:#999;padding: 3px 6px 1px 12px;margin-top:150px;background:#fff; }

</style>

</head><body><center>

<div id="un">
<div class="moon">Akeesha私について</div></a>
<div class="etat"> lazy enthusiast </div>

<!--your pre info here-->
<div class="sub">sixteen. blogger. future medical student. in love with plants, coffee, and books. i spend my days wandering blindly on endlessly nights searching for a reason to exist. <br>"who looks outside, dreams; who looks inside, awakes." – carl jung.</div>
<p></div>

<img src="http://i.imgur.com/DI89gLF.png" id="icon">

<div id="navi">
<!--your links here-->
<a href="/">01</a>
<a href="/ask">02</a>
<a href="/">03</a>
<a href="/">04</a>
<a href="http://r-eiora.tumblr.com" title="creds">05</a>
</div>

<div id="all"><div id="koi"><div id="cont">
<!--your additional info here-->
<p><b> Bold. </b> <a href="/">Link</a>. <u>Underline</u>. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.<p>

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec cursus tellus eu eros viverra id semper massa blandit. Nam condimentum commodo dui, eget volutpat enim hendrerit mollis. Praesent fringilla pharetra nunc vitae sagittis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec cursus tellus eu eros viverra id semper massa blandit. Nteger interdum odio sodales felis dictum posuere. Aliquam rhoncus, mauris eu scelerisque vehicula, mi libero ornare felis, eget facilisis turpis lorem vitae purus. Aenean ac diam ac quam facilisis convallis eget sit amet diam. Morbi eget massa urna, sed facilisis mauris. Quisque venenatis, velit a vestibulum congue, lorem purus ullamcorper massa, a commodo nunc nulla at leo.
</div></div></div>


</div>
</body>
</html>