Tags: Echo

<!--

    TAG PAGE: ECHO
    by acuite

- don't steal this pls
- enjoy, ilu (ﾉ◕ヮ◕)ﾉ*:･ﾟ✧

- @acuite for more themes

-->

<!DOCTYPE html>
<html>
<head>

<title>Navigation</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
<link rel="shortcut icon" href="{Favicon}" />
<link href="https://fonts.googleapis.com/css?family=Open+Sans:400,400i,600,600i" rel="stylesheet">
<style type="text/css">

/* Scroll */

::-webkit-scrollbar {width:11px;height:11px;background:#eee;}
::-webkit-scrollbar-thumb {background:#ccc;}
::-webkit-scrollbar,::-webkit-scrollbar-thumb {border:5px solid #f8f8f8;}

/* Controls */

#tumblr_controls,.tmblr-iframe.tmblr-iframe--desktop-logged-in-controls.iframe-controls--desktop{-webkit-filter: invert(100%); -moz-filter: invert(100%); -o-filter: invert(100%); -ms-filter: invert(100%); filter: invert(100%);opacity:0.5;}

/* General */

body {
    margin:0;
    font-family:'Open Sans',Helvetica,Arial,sans-serif;
    color:#555;
    font-size:10px;
    background:#f8f8f8;
}

.box nav a {
    font-smoothing: antialiased;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

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

 /* Containers */

.c{position:fixed;right:30px;bottom:30px;}
#center {position:relative;margin:40px auto;width:741px;}
.box {width:175px;font-size:0;}

 /* Box Styling */

h2 {
    font-size:11px;
    line-height:100%;
    padding:0 0 7px;
    margin:0 0 5px;
    font-weight:400;
    letter-spacing:1px;
    text-transform:uppercase;
    border-bottom:1px solid #eee;
}

.box img{width:36px;height:36px;float:right;border-radius:50%;}
.box nav {margin-bottom:-5px;}
.box nav u{text-decoration:none;border-bottom:1px solid #bbb;}
.box nav a{display:block;margin:9px 0;}
.box nav a:hover{opacity:0.5;padding-left:10px;}
.box nav a,.box nav b {font-size:11px;line-height:100%;}
.box nav b {
    color:#333;
    font-weight:400;
    display:inline-block;
    padding-bottom:2px;
    border-bottom:1px solid #777;
}

 /* Header */

header {font-size:0;}
h1 {margin:0;font-size:12px;line-height:100%;letter-spacing:1.5px;font-weight:600;}
header nav{color:#999;text-align:right;}
header nav a:hover {color:#333;}
header nav a,header nav b {font-size:9px;line-height:100%;}
header nav b {opacity:0.5;margin:0 9px;font-weight:400;}
header nav,h1 {display:inline-block;vertical-align:middle;width:50%;}

 /* Common */

header nav a,h1,.c {letter-spacing:1px;text-transform:uppercase;}

.box,header {
    margin:15px;
    padding:20px;
    background:#fff;
    border-radius:5px;
    border:1px solid #f2f2f2;
}

</style>
<script src="http://static.tumblr.com/twte3d7/H8Glm663z/masonry.js"></script>
<script type="text/javascript">
$(window).load(function () {
$('#content').masonry({
itemSelector : ".box",
},
function() { $('#content').masonry({ appendedContent: $(this) }); }
);
});
</script>
</head>
<body>

<div id="center">

<!-- Header Start. No edit necessary. -->
<header>
<h1>navigation</h1>
<nav>
    <a href="/">return to blog</a> <b>/</b>
    <a href="/ask">message</a> <b>/</b>
    <a href="http://acuite.tumblr.com">credit</a>
</nav>
</header>
<!-- Header End -->


<div id="content">
<!-- Start Content -->


<!-- Example -->
<div class="box">
<img src="http://placehold.it/34x34"><!-- Image URL -->
<h2>category name</h2>
<nav>
    <a href="/tagged/tag-link">tag name</a>
    <a href="/tagged/tag-link">tag name</a>
    <a href="/tagged/tag-link">tag name</a>
    <a href="/tagged/tag-link">tag name</a>
</nav>
</div>


<!-- Example -->
<div class="box">
<img src="http://placehold.it/34x34"><!-- Image URL -->
<h2>category name</h2>
<nav>
    <a href="/tagged/tag-link">tag name</a>
    <a href="/tagged/tag-link">tag name</a>
    <a href="/tagged/tag-link">tag name</a>
    <a href="/tagged/tag-link">tag name</a>
</nav>
</div>


<!-- Example -->
<div class="box">
<img src="http://placehold.it/34x34"><!-- Image URL -->
<h2>category name</h2>
<nav>
    <a href="/tagged/tag-link">tag name</a>
    <a href="/tagged/tag-link">tag name</a>
    <a href="/tagged/tag-link">tag name</a>
    <a href="/tagged/tag-link">tag name</a>
</nav>
</div>


<!-- End. Do not edit below this line. -->
</div>
</div>

<a class="c" href="http://acuite.tumblr.com">acuite</a>

</body>
</html>