P5 -- tags

<!DOCTYPE html>
<head>

<!-- PAGE 5 BY CRIMICAL; TAGS

    DO NOT CLAIM AS YOUR OWN, DO NOT REMOVE CREDIT
    thank you for using my theme :)

-->

<title>tags &mdash; {Title}</title>

<link rel="shortcut icon" href="{Favicon}">
<link rel="alternate" type="application/rss+xml" href="{RSS}">

<script src="//use.edgefonts.net/yeseva-one;vidaloka;averia-serif-libre:n4,i4,n7.js"></script>

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

<style type="text/css">

/* basic */

::-webkit-scrollbar-thumb{
    background-color:#333;
    border:7px solid #fff;
    height:auto;
}

::-webkit-scrollbar {
    height:auto;
    width:15px;
    background-color:#333;
    border:8px solid #fff;
}

body{
    margin:0px;
    padding:0px;
    background-color:white;
    color:#222;
    font-family:arial;
    font-size:10px;
    line-height:160%;
    text-align:center;
}

a{
    text-decoration:none;
    color:#333;
}

/* main */

#m{
    width:809px;
    margin:120px auto 150px;
}

h2{
    font-size:40px;
    letter-spacing:1px;
    font-family:'vidaloka';
    margin-bottom:100px;
    font-weight:normal;
    width:789px;
    margin-left:10px;
}

/* body */

h1{
    font-family:'inconsolata';
    padding:0 12px 0;
    font-size:13px;
    letter-spacing:1px;
    margin:100px 0 25px;
    text-align:center;
    font-weight:bold;
    font-style:;
    text-transform:uppercase;
}

.i{
    width:150px;
    height:40px;
    overflow:hidden;
    background:#f7f7f7;
    padding:15px;
    margin:10px;
    display:inline-block;
}

.i .d{
    width:150px;
    height:43px;
    background:#f7f7f7;
    padding-top:12px;
    padding-bottom:20px;
    font-size:14px;
    font-family:'inconsolata';
    font-weight:bold;
    text-transform:uppercase;
}

.i .d#l{
    padding-top:3px;
    line-height:18px;
}

.i img{
    position:absolute;
    width:180px;
    margin:-15px 0 0 -90px;
    height:70px;
    opacity:0;
    -webkit-transition:1s ease-in-out;
}

.i:hover img{
    opacity:1;
}

/* */

.credit{
    position:fixed;
    bottom:20px;
    right:20px;
}

.credit a{
    border:1px solid #f4f4f4;
    padding:5px;
    height:10px;
    width:10px;
    text-transform:uppercase;
    font-size:8px;
    font-family:arial;
    color:gray;
}

</style>
</head>

<body>

    <div class="credit">
        <a href="http://crimicalthemes.tumblr.com/">cr</a>
    </div>

<div style="text-align:left; margin:2px 5px; font-family:'inconsolata'; font-size:8px; text-transform:uppercase; opacity:.8"><a href="/">back</a></div>

<div id="m">

<h2>tags</h2>

<div class="line1"> </div>
<div class="line2"> </div>


<!-- LINKS -->


<a href="/tagged/TAG"> <div class="i">
    <img src="http://i.imgur.com/EbQjLLX.jpg" /> <!-- optional background -->
    <div class="d"> TAG </div>
</div> </a>

<a href="/tagged/TAG"> <div class="i">
    <div class="d"> TAG </div>
</div> </a>

<a href="/tagged/TAG"> <div class="i">
    <div class="d"> TAG </div>
</div> </a>

<!--
    IF you want to break off a line of tags after one, two or three (instead of four) links, just add <br> after the last link!
-->

<a href="/tagged/TAG"> <div class="i">
    <div class="d"> TAG </div>
</div> </a>


<!-- SUBGROUP -->

<h1> SUBHEADER </h1>

<a href="/tagged/TAG"> <div class="i">
    <img src="http://i.imgur.com/ofL138Q.jpg" /> <!-- optional background -->
    <div class="d"> TAG </div>
</div> </a>


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