redirect theme 01

<!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>

<!--- theme by jasnahdavar
------ do not steal or remove credit! please ask me if you want to use as a base code i swear i'm nice
------ the image will resize to 400px wide, max height is 200px! (you can remove it too without affecting the code)
------ the description in the second box is the same as your blog description. you can edit it directly from your customize page
------ to REMOVE the description just click the button that says show description and it's gone
------ when writing your url do NOT write the full url (http://url.tumblr.com) but JUST the url (eg: jasnahdavar, booksinvolved, etc) otherwise the link will not work
------ EVERYTHING can be edited from the customize page without editing the html
------ that's it i guess my askbox is always open
 --->

<title>{Title}</title>
<link rel="shortcut icon" href="{Favicon}">
<link rel="alternate" type="application/rss+xml" href="{RSS}">
{block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}

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


<script type="text/javascript">
                 function unhide(divID) {
                 var item = document.getElementById(divID);
                 if (item) {
                 item.className=(item.className=='hidden')?'unhidden':'unhidden';
                 }
                 }
                </script>

                <script type="text/javascript">
                 function hide(divID) {
                 var item = document.getElementById(divID);
                 if (item) {
                 item.className=(item.className=='unhidden')?'hidden':'hidden';
                 }
                 }
                </script>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js" type="text/javascript"></script>
<script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js" type="text/javascript"></script>
<script type="text/javascript">// <![CDATA[
(function($){

$(document).ready(function(){

$("a[title]").style_my_tooltips({

tip_follows_cursor:true,

tip_delay_time:30,

tip_fade_speed:300,

attribute:"title"

});

});

})(jQuery);
// ]]></script>

<meta name="color:background" content="#fff">
<meta name="color:text" content="#999">
<meta name="color:link" content="#ff0066">
<meta name="color:link hover" content="#000">
<meta name="color:box border" content="#cfcfcf">

<meta name="text:url" content="your url here">

<meta name="image:image" content="http://37.media.tumblr.com/10c5f308faf86d3b86da80aaca97423b/tumblr_mxyl2cOdYO1si19q8o2_500.gif">

<meta name="if:show description" content="1">

<style type="text/css">
::-webkit-scrollbar-thumb:vertical {
background-color:#cfcfcf; /*scrollbar color*/
height:100px;
}

::-webkit-scrollbar-thumb:horizontal {
background-color:#cfcfcf; /*scrollbar color*/
height:100px !important;
}

::-webkit-scrollbar {
height:10px;
width:8px;
background-color:#eeeeee; /*scrollbar bg color*/
}

::selection {
    background:#000;
    color:#fff;
}


/*----------------- TOOLTIP -----------------*/
#s-m-t-tooltip{
    font-size:10px;
    position:absolute;
    margin-top: 15px;
    margin-left:15px;
    letter-spacing:1px;
    z-index:9999;
    background:white;
    color:#666;
    text-transform:uppercase;
    padding:2px 3px 2px 3px;
    -webkit-transition:all 0.3s;
    -moz-transition:all 0.3s;
    -ms-transition:all 0.3s;
    -o-transition:all 0.3s;
    transition:all 0.3s;
    border:2px solid #999;
}


body {
    background:{color:background};
    margin:0px;
    color:{color:text};
    font-family:cambria;
    font-size:11px;
    line-height:100%;
    font-style: none;
    }


a:link, a:visited, a:active {
    color:{color:link};
    text-decoration: none;
    font-weight: normal;
    -webkit-transition: .6s;
    -moz-transition: .6s;
    transition: .6s;
    }

a:hover {
    color:{color:link hover};
    text-decoration: none;
    font-weight: normal;
    -webkit-transition: .6s;
    -moz-transition: .6s;
    transition: .6s;
    }

.hidden {
    display:none;
}

.unhidden {
    display:block;
}

/*---------- CIRCLES --------*/

#circles {
    position:fixed;
    top:50%;
    left:50%;
    margin-left:220px;
    width:20px;
    height:200px;
    display:inline;
    text-align:right;
}

.tab {
    color:transparent;
    border:1px solid {color:box border};
    width:20px;
    height:20px;
    border-radius:20px;
    -webkit-border-radius:20px;
    -moz-border-radius:20px;
    text-align:right;
    display:inline-block;
    margin-bottom:10px;
}

.tab:hover {
    background:{color:box border};
}

/*--------- CONTAINER -----------------*/

#box1 {
    position:fixed;
    width:380px;
    height:180px;
    padding:10px;
    left:50%;
    top:50%;
    margin-left:-200px;
    border:1px solid {color:box border};
    border-style:double;
    border-width:5px;
    box-shadow:5px 5px 0px #eee;
}

#box2 {
    position:fixed;
    width:380px;
    height:180px;
    padding:10px;
    left:50%;
    top:50%;
    margin-left:-200px;
    border:1px solid {color:box border};
    border-style:double;
    border-width:5px;
    box-shadow:5px 5px 0px #eee;
}

/* box 1 */

.nowat {
    text-align:center;
    text-transform:uppercase;
    font-size:14px;
    margin-top:50px;
}

.newurl {
    text-align:center;
    font-family:arial;
    font-size:30px;
    text-transform:lowercase;
    margin-top:20px;
}

/*----- IMAGE --------*/

#image {
    position:fixed;
    top:50%;
    left:50%;
    width:400px;
    height:200px;
    margin-top:-200px;
    margin-left:-200px;
}

#image img {
    width:400px;
    max-height:200px;
}

/*box 2*/

.desc {
    margin-top:50px;
    font-family:helvetica;
    line-height:120%;
    text-align:Center;
}

{CustomCSS}</style>


</head><body>

<div id="image">
    <img src="{image:image}">
</div>
<div id="circles">
{block:ifshowdescription}
   <a href="javascript:unhide('box1');hide('box2');" title="new url"><div class="tab"></div></a>

   <a href="javascript:unhide('box2');hide('box1');" title="+ more"><div class="tab"></div></a>{/block:ifshowdescription}
   <a href="http://jasnahdavar.tumblr.com" target="_blank" title="credit"><div class="tab"></div></a>
</div>

<div id="box1" class="unhidden">
<div class="nowat">now at</div>
<div class="newurl"><a href="http://{text:url}.tumblr.com">{text:url}</a></div>
</div>
<div id="box2" class="hidden"><div class="desc">{description}
</div></div>


</body></html>