Minato Profile

<!--
PAGE CODE: MINATO by minatoos

- pls don't steal or repost as your own
- hope you enjoy it!

- @minatoos for more themes
-->

<!DOCTYPE html>
<html>
<head>

<script src="https://code.jquery.com/jquery-1.10.0.min.js"></script>

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

<style type="text/css">

/*CREDITS DO NOT REMOVE-------------------------------------------------*/

.c {
    position: fixed;
    bottom: 30px;
    right: 30px;
    text-align: center;
    border: 1px solid #f3f3f3;
    padding: 2px 4px 2px 4px;
}

.c a {
    color: #f3f3f3;
    text-decoration: none;
    font-size: 8px;
}

.c a:hover {
    opacity: 0.5;
        -moz-transition:0.4s ease-in;
        -webkit-transition:0.4s ease-in;
        -o-transition:0.4s ease-in;
    transition: 0.4s ease-in;
}

/*SCROLLBAR-------------------------------------------------------------*/

::-webkit-scrollbar {
    background-color: #ffffff;
    height: 8px;
    width: 5px
}

::-webkit-scrollbar-thumb:vertical {
    background-color: #ffffff;
    height:5px
}

/*PAGE------------------------------------------------------------------*/

body {
    background-color: white;
    background-attachment: fixed;
    font-family: Verdana;
    font-size: 10px;
    font-weight: lighter;
    color: #000000;
    word-wrap: break-word;
    margin: 0;
}

a {
    text-decoration: none;
    transition: 0.5s ease;
        -o-transition: 0.5s ease;
        -moz-transition: 0.5s ease;
        -webkit-transition: 0.5s ease;
}


/*LINKS-----------------------------------------------------------------*/

ul {
    text-align: left;
    text-transform: lowercase;
    margin-left: -30px;
}

ul a {
    color: #000000;
    text-decoration: none;
    font-size: 8px;
}

ul a:hover {
    opacity: 0.5;
        -moz-transition:0.4s ease-in;
        -webkit-transition:0.4s ease-in;
        -o-transition:0.4s ease-in;
    transition: 0.4s ease-in;
    padding-left: 8px;
}

/*CONTENT---------------------------------------------------------------*/

#content {
    position: fixed;
    width: 500px;
    height: auto;
    background-color: #f8f8f8;
    margin: 200px 0px 50px 400px;
    padding: 10px;
    overflow: auto;
}


#navigation {
    position: absolute;
    margin-left: 650px;
    margin-top: 180px;
    z-index: 999999;
}

.navi {
    padding: 5px 10px 10px;
}

.navi a {
    display: inline-block;
    margin: 5px 8px 0px 0px;
    text-transform: lowercase;
    font-size: 8px;
    word-break: break-all;
    text-decoration: none;
    color: #000000;
}

.nav a {
    margin-left: 15px;
    color:#000;
}

.nav a:hover {
    opacity: 0.5;
        -moz-transition:0.4s ease-in;
        -webkit-transition:0.4s ease-in;
        -o-transition:0.4s ease-in;
    transition: 0.4s ease-in;
}

.nav {
    text-align: right;
    padding: 0px 20px 20px;
    font-family: verdana;
    font-size: 8px;
    text-transform: uppercase;
}

/*--------------------------------------------------------------------*/

p {
    width: 460px;
    text-align: justify;
    text-transform: lowercase;
    font-weight: lighter;
    font-size: 10px;
    margin-left: 20px;
}

p a {
    text-decoration: none;
    color: #444444;
}

p a:hover {
    opacity: 0.5;
}

h2 {
    text-align: left;
    text-transform: uppercase;
    font-weight: bold;
    font-size: 8px;
    margin-left: 20px;
}

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

<body>


<div id="navigation">
<div class="nav">
    <a href="/">Home</a>
    <a><b>Profile</b></a>
    <a href="/tags">Tags</a>
    <a href="/blogroll">Blogroll</a>
</div>
</div>

<div id="content">
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam vestibulum metus diam, nec bibendum velit rhoncus ut. Maecenas faucibus accumsan enim in fermentum. Cras sed magna augue. Nam porta fermentum diam, ut porttitor massa consequat nec. Sed in diam eleifend, finibus ex in, varius magna. Nulla id felis ligula. Duis at elit nisl. Donec nec neque eget tellus viverra ultrices.
<br>
<br>
Cras condimentum, mi sed lobortis maximus, sem justo rhoncus elit, quis posuere libero eros eget metus. Fusce ac magna vel ex lobortis finibus mattis in enim. Pellentesque blandit arcu sed consequat bibendum. Etiam et nisi lacinia, iaculis erat et, mattis lacus. In non diam tincidunt, tempor justo in, auctor sapien. Sed ut malesuada lacus. Cras semper dui efficitur lectus tincidunt, eu molestie erat egestas. Suspendisse dapibus, arcu pellentesque posuere aliquet, nulla arcu tincidunt nulla, ut vulputate eros augue non orci.
<br>
<br>
Duis ultricies, ex ut molestie semper, sapien felis ultricies elit, nec semper odio quam quis nulla. Phasellus consectetur metus at ultricies aliquet. Sed cursus, libero quis pharetra interdum, nulla massa ullamcorper nulla, eget ultricies nisi dolor non dolor. Proin et mauris tristique, euismod erat nec, pellentesque arcu. Curabitur lobortis egestas viverra. Donec egestas leo lectus, quis elementum odio pharetra non. Proin aliquet imperdiet rutrum. Donec scelerisque pulvinar vestibulum. Donec in nibh id mi mollis suscipit. Sed consectetur dapibus ex eu accumsan. Suspendisse potenti.

<h2>Inbox Title</h2>
<p><b>bold</b>, <i>cursive</i>, <u>underline</u></p>
</div>
</div>

<div class="c"><a href="http://minatoos.tumblr.com">M</a></div>
</div>
</body>
</html>