Blogroll 02: Royals

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>

<!---

BLOGROLL PAGE 02: ROYALS BY LUNECERISE AKA ROMULVS

-keep credit intact
-don't steal any code
-don't use as a basecode

--->

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

<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(){
$("[title]").style_my_tooltips({
tip_follows_cursor:true,
tip_delay_time:1,
tip_fade_speed:100,
attribute:"title"
});
});
})(jQuery);
</script>

<style type="text/css">
body {
    font-family:trebuchet ms;
    font-size:10px;
    background: #f2f2f2 url(https://41.media.tumblr.com/653da9957797dc3ed2715268e4ea854a/tumblr_njj5xy4ras1tnrgpko3_250.png) repeat fixed left top;
    -moz-font-smoothing:subpixel-antialiased;
    -webkit-font-smoothing:subpixel-antialiased;
    font-smoothing:subpixel-antialiased;
}

#s-m-t-tooltip {
    max-width:300px;
    padding:5px 8px;
    margin:10px;
    background-color:#fff;
    font-size:8px;
    letter-spacing:1px;
    text-transform:uppercase;
    border-radius:1px;
    color:#aaa;
    z-index:10000000000000000;
    box-shadow:2px 2px 0.2em #eee;
    transition-duration:0.5s;
    -moz-transition-duration:0.5s;
    -webkit-transition-duration:0.5s;
    -o-transition-duration:0.5s;
    }

::-webkit-scrollbar {background-color:#fff; height:4px; width:4px;}
::-webkit-scrollbar-thumb:vertical {background-color:#000;}
::-webkit-scrollbar-thumb:horizontal {background:#000; height:4px!important}

*, body, img { cursor:url(http://static.tumblr.com/vmteopo/yYInjhg6e/small_black_cursor.png), auto;}

a, a:hover, a:active {cursor:url(http://static.tumblr.com/vmteopo/DH3njhg50/help_cursor.png), crosshair; }

a {
    text-decoration:none;
    color:#bbb;
    transition:0.5s ease-in-out;
    -webkit-transition:0.5s ease-in-out;
    -moz-transition:0.5s ease-in-out;
    -ms-transition:0.5s ease-in-out;
    -o-transition:0.5s ease-in-out;
}

a:hover {color:#eee;}

.container {width:677px;margin:auto;overflow:hidden;}

#title {margin:120px auto 10px;text-align:center;font-size:50px;width:500px;}
#links {text-align:center;padding:10px;background:#fff;border:3px solid #000;}
#links a {display:inline-block;padding:2px 10px;color:#000;text-transform:uppercase;}

.user {
    display:inline-block;
    width:50px;
    padding:10px;
    margin:5px;
    text-align:center;
    height:50px;
    background:#fff;
    border:1px solid #eee;
}

.user a {color:#000;text-transform:uppercase;}
.user img {float:left;height:30px;width:30px;padding:10px;}
#blogs {margin:10px 0;text-align:center;}

#credit, #credit a {
    position:fixed;
    bottom:5px;
    right:5px;
    padding:5px 4px;
    font-family:helvetica;
    text-transform:uppercase;
    color:#bbb;
    font-size:8px;
    transition:0.4s ease-in-out;
    -webkit-transition:0.4s ease-in-out;
    -moz-transition:0.4s ease-in-out;
    -ms-transition:0.4s ease-in-out;
    -o-transition:0.4s ease-in-out;
}

#credit:hover, #credit a:hover {text-shadow:#aaa 2px 2px 0.1em;}

</style></head>
<body>
<!---- title ---->
  <div id="title">R O Y A L S</div>

<div class="container">

<!---- links ---->
<div id="links">
<a href="/">index</a>
<a href="/ask">message</a>
<a href="/atlas">navigation</a>
<a href="/past">archive</a>
</div>

<div id="blogs">
{block:Following}
{block:Followed}
<div class="user">
<a href="{FollowedURL}" title="{FollowedName}"><img src="{FollowedPortraitURL-30}"></a>
</div>
{/block:Followed}
{/block:Following}
</div>

</div>

<div id="credit"><a href="http://lunecerise.co.vu" title="lunecerise">LC</a></div>
</body>
</html>