blogroll1

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<!--
blogroll theme #1 by pistachi-o.tumblr.com
please don't remove the credit and claim it as your own
-->

<html>
<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>{Title}{block:SearchPage}, Search results for: {SearchQuery}{/block:SearchPage}{block:PostSummary}, {PostSummary}{/block:PostSummary}</title>
{block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
<link rel="shortcut icon" href="{Favicon}" />
<link rel="alternate" type="application/rss+xml" href="{RSS}" />

<link href='http://fonts.googleapis.com/css?family=News+Cycle' rel='stylesheet' type='text/css'>
<script type="text/javascript">
  WebFontConfig = {
    google: { families: [ 'News+Cycle::latin' ] }
  };
  (function() {
    var wf = document.createElement('script');
    wf.src = ('https:' == document.location.protocol ? 'https' : 'http') +
      '://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js';
    wf.type = 'text/javascript';
    wf.async = 'true';
    var s = document.getElementsByTagName('script')[0];
    s.parentNode.insertBefore(wf, s);
  })(); </script>

<link href='http://fonts.googleapis.com/css?family=Oleo+Script' rel='stylesheet' type='text/css'>
<script type="text/javascript">
  WebFontConfig = {
    google: { families: [ 'Oleo+Script::latin' ] }
  };
  (function() {
    var wf = document.createElement('script');
    wf.src = ('https:' == document.location.protocol ? 'https' : 'http') +
      '://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js';
    wf.type = 'text/javascript';
    wf.async = 'true';
    var s = document.getElementsByTagName('script')[0];
    s.parentNode.insertBefore(wf, s);
  })(); </script>


<style type="text/css">

::-webkit-scrollbar {width: 8px; height:auto; background:#FFF;}
::-webkit-scrollbar-thumb:vertical {background:#E3F1E9;}
::-webkit-scrollbar-thumb:horizontal {background:transparent}
::-webkit-scrollbar-thumb {background:{color:border};}
::-webkit-scrollbar-track-piece {background:#FFF; width:8px;}

body {
background-color: #FFF;
background-image: url('http://static.tumblr.com/whx9ghv/QzWm5lzm6/bg.jpg');
background-attachment: fixed;
background-repeat: repeat;
font-family: 'News Cycle', sans-serif;
font-size: 11px;
text-align: justify;
line-height: 95%;
}

a:link, a:active, a:visited {
color: #778899;
text-decoration: none;
}

a:hover {
color: #E3F1E9;
}

#header {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 110px;
background: rgba(255,255,255,0.4);
}

#title {
position: relative;
color: #778899;
font-family: 'Oleo Script', cursive;
font-size: 45px;
font-weight: bold;
line-height: 100%;
text-align: center;
text-shadow: 1px 2px 2px #E3F1E9;
margin-top: 20px;
}

.links {
text-transform: uppercase;
font-size: 10px;
text-align: center;
line-height: 100%;
margin-left: 30px;
}

.links a {
color: #778899;
}

#container {
width: 840px;
height: 100%;
margin: 100px auto;
padding: 10px;
text-align: center;
position: relative;
}

.source {
margin: 0px auto;
padding: 10px;
text-align: center;
list-style: none;
}

.source li {
float: left;
}

.source li a {
margin: 5px;
list-style: none;
display: inline-block;
position: relative;
border: 4px solid #E3F1E9;
}

.source img {
width: 64px;
height: 64px;
}

.source li a span {
width: 90px;
height: 90px;
padding: 4px;
left: 50%;
margin-left: -55px;
font-family: 'PT Sans Narrow', sans-serif;
font-size: 9px;
line-height: 90px;
color: #719DAB;
text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);
text-align: center;
text-transform: uppercase;
border: 5px solid #FFF;
background: #E3F1E9;
text-indent: 0px;
position: absolute;
pointer-events: none;
border-radius: 50%;
bottom: -80px;
opacity: 0;
box-shadow: 0px 3px 8px rgba(0,0,0,0.1);
-webkit-transform: scale(0.2);
-moz-transform: scale(0.2);
-o-transform: scale(0.2);
transform: scale(0.2);
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
overflow: hidden;
z-index: 9999;
}

.source li a:hover span {
opacity: 1;
bottom: -20px;
-webkit-transform: scale(1);
-moz-transform: scale(1);
-o-transform: scale(1);
transform: scale(1);
}

@import url(http://fonts.googleapis.com/css?family=News+Cycle);
@import url(http://fonts.googleapis.com/css?family=Oleo+Script);

</style>
<style type="text/css">{CustomCSS}</style>
</head>


<body>

<div id="header">
<div id="title">blogroll title #1</div>
<div class="links"><a href="/">« BACK</a> ♦ <a href="http://www.tumblr.com/dashboard">DASHBOARD</a> ♦ <a href="http://nutty-themes.tumblr.com/">CREDITS</a>
</div>
</div>

<div id="container">

<ul class="source">
{block:Following}{block:Followed}
<li><a href="{FollowedURL}"><span>{FollowedName}</span><img src="{FollowedPortraitURL-64}" border="0" /></a></li>
{/block:Followed}{/block:Following}
</ul>

</div>

</body>
</html>