page #15 (tags)

<!-- page #15 (tags) by nerdydean. don't remove the credit. -->


<!DOCTYPE html>
<head>


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

<script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
<script src="http://static.tumblr.com/rzl30kg/eAxm7a751/jquery.style-my-tooltips.js"></script>
<script>
   (function($){
       $(document).ready(function(){
           $("[title]").style_my_tooltips({
               tip_follows_cursor:true,
               tip_delay_time:200,
               tip_fade_speed:300
           }
               );
       });
   })(jQuery);
</script>

<style type="text/css">

body{
font-family:Arial;
}

#s-m-t-tooltip{
max-width:300px;
margin:15px;
padding:5px 5px;
background:#000;
color:#fff;
z-index:999999;
font-family:arial;
text-transform:uppercase;
font-size:8px;
letter-spacing:1px;
font-weight:bold;
}

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

a:hover {
-webkit-transition-duration:.6s;
-moz-transition-duration:.6s;
-o-transition-duration:.6s;
-ms-transition-duration:.6s;
}

#content {
margin:0 auto;
width:650px;
}

#content img {
margin-left:5px;
width:100px;
padding:10px;
-webkit-transition-duration:.6s;
-moz-transition-duration:.6s;
-o-transition-duration:.6s;
-ms-transition-duration:.6s;
}

#title{
color:#000;
width:650px;
margin:0 auto;
margin-top:30px;
margin-bottom:10px;
font-family:arial;
text-transform:uppercase;
font-size:12px;
letter-spacing:1px;
font-weight:bold;
padding-bottom:20px;
text-align:center;
border-bottom:1px dotted #eee;
}

#group {
width:650px;
text-align:left;
border:1px solid #eee;
padding:5px;
}

#tit {
font-family:arial;
text-transform:uppercase;
font-size:8px;
letter-spacing:1px;
font-weight:bold;
width:650px;
text-align:center;
text-decoration:none;
padding:5px;
background:#fff;
color:#000;
margin-top:30px;
}

::-webkit-scrollbar {
width: 3px;
height:auto;
background:#fff;
}

::-webkit-scrollbar-thumb {
background: #000;
}


</style>
</head>
<body>

<div id="title">
<!-- this is your title -->
tags
<br><br><small><small>
<!-- these are your links -->
<a href="/">home</a>
<a href="/ask">ask</a>
<!-- please don't remove this -->
<a title"theme by nerdydean" href="http://hellish.co.vu">cr.</a>
</small></small></div>

<div id="content">

<div style="width:700px; height:400px; overflow-Y:scroll;">

<!-- this is the title of a group -->
<div id="tit">television</div>
<div id="group">
<!-- these are your tags. title="___" is what you want it to say when someone hovers. if you don't want it to say anything, get rid of the title="___". for href="/tagged/TAG", replace TAG with whatever the tag you use is. you don't need to worry about typing your entire url before /tagged/. img src="[url]" is where you put the url of the image you are going to use, which should be 100x100. i recommend uploading it to http://imgur.com (imgur) or https://www.tumblr.com/themes/upload_static_file (tumblr static). i coded this theme so that you can fit five 100x100 images in each row. if you have any less, it won't mess it up or anything, it will just look uneven. if you have any more, it will start another row. you can have as many groups as you want by the way, i made it so that a scrollbar will appear after you add more than two rows. i left three example groups for you including this one. feel free to change them, i left them for you to see how the page works and to maybe use as a template. i hope you like this page, because that's all i have to say c:  -->
<a title="supernatural" href="/tagged/spn"><img src="http://i.imgur.com/JiWcIG7.png"></a>
<a title="orphan black" href="tagged/orphan black"><img src="http://i.imgur.com/aM6tqjQ.png"></a>
<a title="the 100" href="/tagged/the-100"><img src="http://i.imgur.com/gUyslMd.png"></a>
<a title="american horror story" href="/tagged/ahs"><img src="http://i.imgur.com/k74iIRg.png"></a>
<a title="doctor who" href="/tagged/doctor who"><img src="http://i.imgur.com/qsWRksD.png"></a>
</div>

<!-- this is the title of your group -->
<div id="tit">movies</div>
<div id="group">
<!-- these are your tags -->
<a title="captain america: the winter soldier" href="/tagged/captain america"><img src="http://i.imgur.com/FzLREk9.png"></a>
<a title="captain america: the first avenger" href="tagged/captain america"><img src="http://i.imgur.com/2ofaHAy.png"></a>
<a title="harry potter and the deathly hallows: part 1" href="/tagged/hp"><img src="http://i.imgur.com/uA5u5NN.png"></a>
<a title="the hunger games" href="/tagged/hg"><img src="http://i.imgur.com/OVJGcWf.png"></a>
<a title="harry potter and the prisoner of azkaban" href="/tagged/hp"><img src="http://i.imgur.com/6y6xjZa.png"></a>
</div>

<!-- this is the title of your group -->
<div id="tit">people</div>
<div id="group">
<!-- these are your tags -->
<a title="emma watson" href="/tagged/emma-watson"><img src="http://i.imgur.com/0UIZbq3.png"></a>
<a title="jennifer lawrence" href="tagged/jennifer-lawrence"><img src="http://i.imgur.com/i4oDpeL.png"></a>
<a title="rachel miner" href="/tagged/rachel-miner"><img src="http://i.imgur.com/L3DdktS.png"></a>
<a title="hilary duff" href="/tagged/hilary-duff"><img src="http://i.imgur.com/W64LzBM.png"></a>
<a title="evanna lynch" href="/tagged/evanna-lynch"><img src="http://i.imgur.com/e5OB93h.png"></a>
</div>

</div>


</body>
</html>