theme pack 1 blogroll

<!--
theme pack #1 - blogroll by Sabina (briqhter/cutiephil)
please do not remove the credit
-->

<!DOCTYPE html>
<html lang="en">

<head>

<!------script1------>
<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(){
$("a[title]").style_my_tooltips({
tip_follows_cursor:true,
tip_delay_time:90,
tip_fade_speed:600,
attribute:"title"
});
});
})(jQuery);
</script>
<!------script2------>

<style type="text/css">

/* fonts */
@font-face { font-family:"bb"; src: url('https://dl.dropboxusercontent.com/s/mw5tqnd88mxflxw/Saniretro.ttf');}
/* basics1 */
body {
font-family:calibri;
font-size:11px;
line-height:12px;
color:#888;
background-color:#ffffff;
background-image:url(http://static.tumblr.com/bgzjy3u/0Zznfopt2/tumblr_inline_mx3lrqyox41r8f9nah.gif); /* replace this with your background image */
background-attachment:fixed;
background-repeat:repeat;
}

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

a:hover {
color: #888;
}

img {
border:0;
max-width:100%;
}

#s-m-t-tooltip {
max-width:300px;
padding:5px;
margin:20px 0px 0px 20px;
background: #fff; /* change the background color */
border:1px solid #f0b484; /* change the border color */
font-family:calibri; /* change the font */
font-size:8px; /* change the font size */
line-height:8px; /* change the font size */
text-transform:uppercase; /* can be uppercase, lowercase, none*/
color:#f0b484; /* change the text color */
letter-spacing:1px;
z-index:999999999999999999999999999999999999;
}

::-webkit-scrollbar {width: 2px; height: 4px; background: #f3e2d7; }
::-webkit-scrollbar-thumb { background-color: #f0b484; -webkit-border-radius: 1ex; }

/* basics2 */

#wrap{
margin:auto;
position: absolute;
overflow:hidden;
width:880px;
height:600px;
top: 0; left: 0; bottom: 0; right: 0;
}

#content {
z-index:10;
position:fixed;
overflow:hidden;
margin-top:0px;
margin-left:424px;
width:436px;
height:600px;
background-color:#ffffff;
background-image:url(http://static.tumblr.com/bgzjy3u/0Zznfopt2/tumblr_inline_mx3lrqyox41r8f9nah.gif); /* replace this with your background image */
background-attachment:fixed;
background-repeat:repeat;
}

#sidebar {
position:fixed;
margin-left:0px;
margin-top:0px;
width:440px;
height:600px;
background:#fff;
}

#sidebar img{
height:600px;
width:440px;
overflow:hidden;
}

#backbar {
z-index:1;
position:fixed;
margin-left:440px;
margin-top:0px;
width:440px;
height:600px;
background:#fff;
}

#backbar img{
height:600px;
width:440px;
overflow:hidden;
}

#box1 {
position:fixed;
overflow-y:scroll;
margin-top:0px;
margin-left:0px;
width:416px;
height:500px;
background:white;
font-size:11px;
line-height:15px;
padding:10px;
border-bottom:1px solid #f0b484;
border-top:1px solid #f0b484;
}

#follow{
z-index:6;
position:static;
float: left;
margin:4px;
padding:4px;
height:41px;
width:41px;
border:1px solid #eee;
background:white;
-webkit-transition: all 0.8s ease;
-moz-transition: all 0.8s ease;
-o-transition: all 0.8s ease;
transition: all 0.8s ease;
}

#follow img{
height:41px;
width:41px;
opacity:0.7;
-webkit-transition: all 0.8s ease;
-moz-transition: all 0.8s ease;
-o-transition: all 0.8s ease;
transition: all 0.8s ease;
}

#follow:hover img{
opacity:1;
}

#follow:hover{
border:1px solid #f0b484;
color:white;
}

#btitle {
z-index:3;
position:fixed;
margin-top:540px;
margin-left:12px;
width:440px;
height:100px;
color:#f0b484;
font-family:bb;
font-size:80px;
line-height:60px;
text-transform:uppercase;
}

#btitleshadow{
z-index:2;
position:fixed;
margin-top:537px;
margin-left:16px;
width:440px;
height:100px;
color:#f3e2d7;
font-family:bb;
font-size:80px;
line-height:60px;
text-transform:uppercase;
}

#credit {
z-index: 4783;
position:fixed;
bottom:10px;
right:10px;
background:white;
border: 1px solid #eee;
padding: 3px;
font-family: times;
font-size: 10px;
line-height: 15px;
font-style:italic;
transition: all 0.6s ease-out;
-o-transition-transition: all 0.4s ease-out;
-webkit-transition: all 0.4s ease-out;
-moz-transition: all 0.4s ease-out;
}

#credit a{
color:#bbb;
}

#credit:hover{
opacity: 2;
transition: all 0.6s ease-out;
-o-transition-transition: all 0.4s ease-out;
-webkit-transition: all 0.4s ease-out;
-moz-transition: all 0.4s ease-out;
}

{CustomCSS}

</style>

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

</head>

<body>

<div id="credit"><a href="http://cutiephil.tumblr.com">CP</a></div>

<div id="wrap">

<div id="sidebar">
<img src="http://static.tumblr.com/bgzjy3u/gSynfopuz/grace_helbig_robin_roemer_002snjk.jpg"><!--put the url of the image you want here-->
</div>
<div id="backbar">
<img src="http://static.tumblr.com/bgzjy3u/gSynfopuz/grace_helbig_robin_roemer_002snjk.jpg"><!--put the url of the image you want here-->
</div><!--sidebar-->

<div id="content">

<div id="box1">
{block:Following}{block:Followed}
<a href="{FollowedURL}" title="{FollowedName}"><div id="follow"><img src="{FollowedPortraitURL-48}" align="left"></div></a>
{/block:Followed}{/block:Following}
</div>

<!-----change blogroll//) to anything you want as the main title------>
<div id="btitle">blogroll//</div>
<div id="btitleshadow">blogroll//</div>

</div><!--content-->

</div><!--wrap-->
</body>

</html>