Navigation Page 01 by armyofghosts

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

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



<!--- NAVIGATION PAGE #1 BY ARMYOFGHOSTS :) --->



<!-- jquery -->

<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:100,

tip_fade_speed:300,

attribute:"title"

});

});

})(jQuery);

</script>

<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">



<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<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}" />

<style type="text/css">



/* --- SCROLLBAR ---*/

::-webkit-scrollbar {background-color:#fff; height:5px; width:7px}
::-webkit-scrollbar-thumb:vertical {background-color:#000; height:50px;border-radius:10px;border:1px solid #fff;}
::-webkit-scrollbar-thumb:horizontal {background-color:#fff; height:5px!important}



/*---TOOLTIP---*/

#s-m-t-tooltip {
    max-width:300px;
    padding:2px;
    margin:10px 0px 0px 10px;
    padding:3px 5px;
    background-color:#fbfcc7;
    border: 1px solid rgba(0, 0, 0, .1);
    text-transform:none;
    font-size:9px;
    font-family:helvetica;
    letter-spacing:1px;
    color:#000;
    z-index:999;
}



/* --- BODY ---*/

body {
    background:#333;
    line-height:10px;
}

a:link, a:active, a:visited{
    color:#999;
    text-decoration:none;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    transition: all 0.3s linear;
}

a:hover{
    color:#000;
    text-decoration: none;
    -moz-transition-duration:.3s;
    -webkit-transition-duration:.3s;
    -o-transition-duration:.3s;
}



/* --- TITLE ---*/

#header {
    margin-top:110px;
    margin-left:31px;
    background:#f1f1f1;
    width:550px;
    padding:15px 15px 25px 15px;
    text-align:left;
    border:solid 1px #f1f1f1;
    box-shadow: 8px 8px 5px #000;
    border-radius:5px;
    font-family:helvetica;
    font-size:11px;
}

#menu {
    margin:-10px 0px 0px -10px;
    width:98.3%;
    height:20px;
    background:#e8e8e8;
    padding:5px 20px 0px 20px;
    text-align:left;
    font-family:helvetica;
    font-size:11px;
}



/*---NAVI---*/

#navi {
    margin-top:-15px;
    margin-left:31px;
    background:#fff;
    width:540px;
    max-height:300px;
    padding:20px 20px 10px 20px;
    overflow:scroll;
    text-align:left;
    line-height:200%;
    border-bottom:1px solid #e8e8e8;
    border-left:1px solid #e8e8e8;
    border-right:1px solid #e8e8e8;
    box-shadow: 8px 8px 5px #000;
    font-family:helvetica;
    font-size:9px;
    text-transform:lowercase;
    letter-spacing:2px;
}

#navi a {
    display:inline-block;
    background:#fff;
    color:#000;
    width:230px;
    padding:10px;
    margin:5px;
    border:2px solid #f4f4f4;
    border-radius:5px;
}

#navi a:hover {
    background:#f4f4f4;
    color:#000;
}



/*---CREDIT---*/

#cred {
    position:fixed;
    bottom:10px;
    right:10px;
    font-size:18px;
    padding:5px;
}

#cred a {
    color:#fff;
}



</style></head>

<center>





<!---HEY so I know this looks messy and all and I'm sorry but idk don't mess with this if you want the menu bar. If you don't want it, delete the code from here until after the </span> </div>--->

<div id="menu">

<i class="fa fa-apple" style="font-size:14px;"></i> &nbsp;&nbsp;&nbsp;

<b>Chrome</b> &nbsp;&nbsp;&nbsp; File  &nbsp;&nbsp;&nbsp; Edit &nbsp;&nbsp;&nbsp; View &nbsp;&nbsp;&nbsp; History &nbsp;&nbsp;&nbsp; Bookmarks &nbsp;&nbsp;&nbsp; Window &nbsp;&nbsp;&nbsp; Help



<span style="float:right; margin-right:10px;">

<i class="fa fa-wifi" style="font-size:14px;"></i> &nbsp;&nbsp;&nbsp; <i class="fa fa-volume-up" style="font-size:14px;"></i> &nbsp;&nbsp;&nbsp;



<!---OKAY LISTEN UP so if you want it to display your city's local time, replace anywhere it says "New_York" with your city. For example, if you live in San Diego, put San_Diego and so on :) --->

<a href="http://time.is/New_York" id="time_is_link" style="font-size:12px"></a>
<span id="New_York_z161" style="font-size:12px"></span>
<script src="http://widget.time.is/en.js"></script>
<script>
time_is_widget.init({New_York_z161:{template:"DATE TIME",  date_format:"dname", time_format:"12hours:minutesAMPM"}});
</script>



&nbsp;&nbsp;&nbsp; <i class="fa fa-search" style="font-size:14px;"></i> &nbsp;&nbsp;&nbsp; <i class="fa fa-tasks" style="font-size:14px;"></i>

</span>

</div>

<!---Yeah delete the code UNTIL HERE if you don't want the menu bar :) --->





<!---HEADER--->

<div id="header">

<!---LINKS--->

<a href="/" title="home"><i class="fa fa-circle" style="color:#F28F8F;font-size:10px; margin-right:5px;"></i></a>

<a href="/" title="ask"><i class="fa fa-circle" style="color:#F2DE8F;font-size:10px; margin-right:5px;"></i></a>

<a href="https://www.tumblr.com/dashboard" title="dash"><i class="fa fa-circle" style="color:#8FF291;font-size:10px; margin-right:5px;"></i></a>

<!---TITLE--->

<span style="padding:5px; font-size:11px; letter-spacing:2px;">
navigation
</span>

</div>


<center>




<div id="navi">

<!---CHANGE YOUR TEXT HERE--->

<a href="/tagged/">link 1</a>

<a href="/tagged/">link 2</a>

<a href="/tagged/">link 3</a>

<a href="/tagged/">link 4</a>

<a href="/tagged/">link 5</a>

<a href="/tagged/">link 6</a>

<a href="/tagged/">link 7</a>

<a href="/tagged/">link 8</a>

<a href="/tagged/">link 9</a>

<a href="/tagged/">link 10</a>

<!---UNTIL HERE--->

</div>

</center>






<div id="cred"> <a title="armyofghosts" href="http://armyofghosts.tumblr.com/"><i class="fa fa-code"></i></a> </div>





</body>
</html>