new blogroll 2.0

<html>
<head>

<!---Blogroll by Mary (shampaim.tumblr.com) don't copy, please--->

<title>{title} | blogroll</title>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>

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

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

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

tip_fade_speed:0,

attribute:"title"

});

});

})(jQuery);

</script>
</head>

<style type="text/css">

body{font-family:'arvil'; font-size: 11px;color: #696969;background: url('');background-color:#fff;background-attachment:fixed;line-height: 13px;text-align:justify;}

#content{margin: auto;margin-bottom: 15px;z-index:4;width:560px;margin-top:20px;text-align:justify;}

b, strong { color: #CEB7C4;}
u, underline {color:#D2D2D2;  border-bottom: 1px dashed #E0D0D9; text-decoration: none;}
i { color: #E5E5E5;}
s, strike { color: #D7EEEE;}
a {color:#b5b5b5; text-decoration:none;}
a:hover{color:#b5b5b5;text-decoration:none;}

.caixa{padding: 10px;margin-bottom: 15px;text-align:justify; border:0px double #fff; text-decoration:uppercase; border-top:1px dotted #696969}

.banner {;width:500px; height:45px; text-align:center; padding-top:5px; font-size:12px; font-family: 'arvil'; text-decoration:uppercase;}

.icons{border: 1px solid #b5b5b5; margin: 1px; width: 64px; height:64px; opacity: 0.9; -webkit-transition: all 1s ease; background:#fff; padding:5px; filter:gray; -webkit-filter: grayscale(0%);}
.icons:hover{ opacity:0.4; filter:gray; -webkit-filter: grayscale(0%);}

.nome{background:#b5b5b5; font-size:9px; font-family: 'arvil'; text-decoration:uppercase;}

@font-face {font-family: "arvil";
src: url('http://static.tumblr.com/nqcm3ld/G1Mmhlp7u/arvil.ttf'); format("truetype"); }

@font-face {font-family: "andy";
src: url('http://static.tumblr.com/nqcm3ld/7XSmhlotu/andyfont.ttf'); format("truetype"); }

letra{font-family: 'Cookie', cursive; font-size:75px;}

#s-m-t-tooltip {
    max-width:150px;
    padding:5px 10px 5px 10px;
    margin:20px 14px 7px 10px;
    border:1px solid #fff; /* change the border color */
    background-color:#fff; /* change the background color */
    font-family:Calibri; /* change the font */
    font-style: normal;
    font-size:10px; /* change the font size */
    line-height:11px;
    letter-spacing:1px; /* change the letter spacing */
    text-transform:uppercase; /* can be uppercase, lowercase, none*/
    color:#999; /* change the text color */
    z-index:999;
}

</head>
</style>

<body>

<div id="pagina"><center><div id="content">
<div class="banner">

<letra>Blogroll</letra><br>

</div><br>

<div class="caixa"> {block:Following} {block:Followed} <a title="{FollowedTitle}" target="blank" href="{FollowedURL}"><img src="{FollowedPortraitURL-96}"alt="{FollowedURL}"class="icons"></a>{/block:Followed}
</div>
</div>

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