Saturn Theme

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

<!--

THEME BY APPUBITO. PLEASE DO NOT REDISTRIBUTE AS YOUR OWN. YOU ARE FREE TO CHANGE THE COLOR OF THE CREDIT LINK, BUT PLEASE LEAVE IT RECOGNIZABLE AND DO NOT MOVE IT TO ANOTHER PAGE. THANK YOU & HAVE FUN !!

-->


<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>

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

<link href='https://fonts.googleapis.com/css?family=Abel' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Anton' rel='stylesheet' type='text/css'>

<meta name="color:background" content="#f8f8f5">
<meta name="color:post background" content="#ffffff">
<meta name="color:text" content="#bbbbbb"/>
<meta name="color:textshadow" content="#a2a9d9"/>
<meta name="color:menulink" content="#000000"/>
<meta name="color:menulink hover" content="#bbbbbb"/>
<meta name="color:bold" content="#000">
<meta name="color:italic" content="#b3c9c6">
<meta name="color:link" content="#aaaaaa"/>
<meta name="color:tags" content="#cccccc"/>
<meta name="color:hover" content="#f1f1f1"/>
<meta name="color:scrollbar" content="ffffff"/>
<meta name="color:scrollbar background" content="ffffff"/>
<meta name="color:tagline" content="000000"/>
<meta name="color:tagline hover" content="ffffff"/>

<meta name="image:sidebar" content="http://static.tumblr.com/129cdcfa1f08153969404753f7f5c1de/cmd8and/Extnv514m/tumblr_static_3d5r2dha0h2cwcg08skco8sos.png"/>
<meta name="image:render" content="">

 <meta name="text:tagline" content="how light carries on endlessly even after death." />
 <meta name="text:subtitles" content="with shortness of breath, you explained the infinite; how rare and beautiful it is to even exist" />
 <meta name="text:url 1" content="/" />
 <meta name="text:name 1" content="■" />
 <meta name="text:link title 1" content="link" />
 <meta name="text:url 2" content="/ask" />
 <meta name="text:name 2" content="■" />
 <meta name="text:link title 2" content="link" />
 <meta name="text:url 3" content="/" />
 <meta name="text:name 3" content="■" />
 <meta name="text:link title 3" content="link" />
 <meta name="text:url 4" content="/" />
 <meta name="text:name 4" content="■" />
 <meta name="text:link title 4" content="link" />

 <script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>

<script>

$(document).ready(function() {
$('a.poplight[href^=#]').click(function() {
    var popID = $(this).attr('rel');
    var popURL = $(this).attr('href');
    var query= popURL.split('?');
    var dim= query[1].split('&');
    var popWidth = dim[0].split('=')[1];
    $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('');
    var popMargTop = ($('#' + popID).height() + 80) / 2;
    var popMargLeft = ($('#' + popID).width() + 80) / 2;
    $('#' + popID).css({
        'margin-top' : -popMargTop,
        'margin-left' : -popMargLeft
    });
    $('body').append('<div id="fade"></div>');
    $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn();
    return false;
});
$('a.close, #fade').live('click', function() {
    $('#fade , .popup_block').fadeOut(function() {
        $('#fade, a.close').remove();
    });
    return false;
});
});
</script>

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

<style type="text/css">


iframe#tumblr_controls { white-space:nowrap; -webkit-filter: invert(100%); -moz-filter: invert(100%); -o-filter: invert(100%); -ms-filter: invert(100%); filter: invert(100%); opacity:.2;transition: .8s ease-in-out; -webkit-transition: .8s ease-in-out;-moz-transition: .8s ease-in-out;-o-transition: .8s ease-in-out; }


::-webkit-scrollbar-thumb{
background:{color:post background};
border:9px solid {color:tagline};
height:auto;
}

::-webkit-scrollbar {
width:8px;
background:{color:scrollbar};
border:3px solid {color:scrollbar background};
}

::-moz-selection { background: #464a48; color: #000; }
::selection { background: #464a48; color: #000; }

#s-m-t-tooltip {
max-width:300px;
background-color:#000;
font-family:consolas;
font-size:10px;
text-transform:uppercase;
color:#fff;
padding:3px 4px 3px 4px;
margin:10px 0px 0px 10px;
z-index:999999999999999999999999999999999999;

}

body {
background:{color:background};
font-family: 'Abel', sans-serif;
font-size:13px;
text-shadow:1px 1px 1px {color:textshadow};
line-height:10px;
text-align:left;
color:{color:text};
overflow-x: hidden;
}

#container {
width:520px;
padding:20px;
position:fixed;
left:368px;
top:249px;
height:270px;
background:{color:post background};
}


small {
    font-size:12px;
    text-shadow:1px 0px 0px {color:textshadow};
}

pre {
    font-size:8px;
    background:#eeeeee;
    padding:2px;
    padding-left:10px;
    margin-left:30px;
    width: 300px;
    white-space: pre-wrap;
    white-space: -moz-pre-wrap;
    white-space: -pre-wrap;
    white-space: -o-pre-wrap;
    word-wrap: break-word;
}

h2 {
font-family: 'Anton', sans-serif;
font-size:20px;
line-height:18px;
text-align:center;
text-transform:uppercase;
color:{color:tagline};;
}


b, strong {
color:{color:bold};
font-weight:bold;


}
i, em {
color:{color:italic};
font-style:italic;
}



ol, ul {
list-style-type:square;
margin-left:12px;
}

blockquote {
border-left:0px solid #f0f0f0;
padding:0px 0px;
background:#fafafa;
padding:10px;
    margin-left:10px;
width:90%;

}

a {
    text-decoration:none;
    -moz-outline-style:none;
    color:{color:link};
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease
}

a:hover {
    opacity:1;
    color:{color:hover};
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease
}

img {
    border:none;
    opacity: 1;
}


#sidebarimage {
    position:fixed;
    width:150px;
    height:310px;
    left:217px;
    top:249px;
    background:#a3a3a3;
}

#sidebarimage img {
    width:150px;
    height:310px;
    opacity:1;
}

.pagi {
position:fixed;
left:870px;
top:225px;
font-size:9px;
text-align:center;
}

.pagi a {
font-size:9px;
color:{color:tagline};
}

.pagi a:hover {
font-size:9px;
color:{color:menulink hover};
}


#entries {
}


#posts {
    padding-bottom:20px;
    padding:10px;
    margin-top:20px;
}

#info {
border-top:1px solid #E6E6E6;
width:500px;
padding-top:8px;
font-size:8px;
margin-left:-1px;
font-style:normal;
text-shadow:none;
text-align:left;
text-transform:uppercase;
font-family:consolas;
-moz-transition-duration:0.5s;
-webkit-transition-duration:0.5s;
-o-transition-duration:0.5s;
    }

#info a{
margin-top:-20px;
color:{color:info};
}

#info a:hover{
color:{color:links};
}

.tags {
font-family:arial;
width:500px;
line-height:100%;
text-align:left;
padding-top:7px;
text-transform: lowercase;
font-size:8px;
-moz-transition-duration:0.5s;
-webkit-transition-duration:0.5s;
-o-transition-duration:0.5s;
    }

.tags a {
font-style:italic;
color:{color:info};
margin-right:5px;
line-height:120%;
    }

.tags a:hover {
text-decoration:underline;
color:{color:info};
}

.notes {
background-color:#FFFFFF;
text-transform:normal;
letter-spacing:0px;
font-size:9px;
margin-top:20px;
font-style:normal;
margin-left:-20px;
text-align:left;
line-height:30px;
border-bottom:1px solid #D8D8D8;
}

.notes img{
padding:2px;
border:1px solid #eee;
margin-bottom:-4px;
-webkit-transition:all 0.5s ease-in-out;
-moz-transition:all 0.5s ease-in-out;
-o-transition:all 0.5s ease-in-out;
-ms-transition:all 0.5s ease-in-out;
transition:all 0.5s ease-in-out;
}

.notes img:hover {opacity: 0.6;
-webkit-transition:all 0.5s ease-in-out;
    -moz-transition:all 0.5s ease-in-out;
    -o-transition:all 0.5s ease-in-out;
    -ms-transition:all 0.5s ease-in-out;
    transition:all 0.5s ease-in-out;}

.quote {
    font-size:30px;
    font-family: 'Anton', sans-serif;
    font-style:normal;
    line-height:25px;
    margin-bottom:15px;
    text-transform:uppercase;
    text-align:left;
    font-weight:normal;
    font-style:none;
    color:{color:tagline};
}

.quotesource {
    font-size:9px;
    text-align:right;
    font-style:none;
    text-transform:uppercase;
    margin-bottom:5px;
    color:{color:text};
}


.audio {
    height:60px;
    margin-bottom:40px;
}

.audio-album {
    position:absolute;
    width:80px;
    padding:2px;
    border:1px solid #E1E1E1;
    -webkit-transition: opacity 0.1s linear;
    margin-bottom:5px;
    opacity: 1;
}

.audio-player {
    opacity:1;
    filter:alpha(opacity=90);
    width:25px;
    height:25px;
    overflow:hidden;
    position:absolute;
    border:30px;
    z-index:2;
    margin-left:33px;
    margin-top:33px;
    opacity:0;
       -webkit-transition: all 0.6s ease-out;
       -o-transition: all 0.6s ease-out;
       -webkit-transition: all 0.6s ease-out;
       -moz-transition: all 0.6s ease-out;
}

.audio-info {
    margin-top:7px;
    position:relative;
    margin-left:120px;
    line-height:90%;
    padding:2px;
    text-transform:uppercase;
}

.audio:hover .audio-player {
    opacity:.6;
       -webkit-transition: all 0.6s ease-out;
       -o-transition: all 0.6s ease-out;
       -webkit-transition: all 0.6s ease-out;
       -moz-transition: all 0.6s ease-out;
}


.user_1 .label {color:{color:text}; font-weight:normal; font-style:italic;}
.user_2 .label {color:{color:text}; font-weight:normal; font-style:italic; }
.user_3 .label {color:{color:text}; font-weight:normal; font-style:italic;}
.user_4 .label {color:{color:text}; font-weight:normal; font-style:italic; }
.user_5 .label {color:{color:text}; font-weight:normal; font-style:italic;}
.user_6 .label {color:{color:text}; font-weight:normal; font-style:italic; }
.ul.chat {}
.chat ol {}
.chat li {list-style:none; margin-left:-38px; padding:2px; font-style: none; font-size: 9px; }


#maker{
float:right;
position:fixed;
bottom:5px;
right:10px;
padding:7px;
font-size:8px;
text-align:center;
line-height:210%;
text-transform:uppercase;
}

#maker a{
padding:7px;
color:#A4A4A4;
}

#maker a:hover{
color:#fff;
padding:7px;
background-color:{color:hover};
}


 #menu {
position:fixed;
font-family:consolas;
font-size:12px;
font-weight:bold;
line-height:32px;
text-transform:none;
letter-spacing:-1px;
left:457px;
top:157px;
color:{color:menulink};
z-index:99999;
writing-mode: rl-bt;
}

#menu a {
color:{color:menulink};
text-transform:none;
}

#menu a:hover {
color:{color:menulink hover};
text-transform:none;
}

#tagline a {
color:{color:tagline};
text-transform:uppercase;
font-size:32px;
line-height:28px;
font-family: 'Anton', sans-serif;
position:fixed;
left:407px;
top:182px;
width:360px;
text-align:left;
}

#tagline a:hover {
color:{color:tagline hover};
}

#desc {
position:fixed;
color:{color:tagline};
width:240px;
left:680px;
top:568px;
font-size:12px;
text-align:justify;
direction: rtl;
text-shadow:none;
z-index:999;
}

#credit {
position:fixed;
bottom:5px;
right:5px;
font-family:consolas;
font-size:9px;
font-weight:lighter;
line-height:8px;
text-transform:uppercase;
letter-spacing:-1px;
color:#e0dcd7;
text-shadow: 0px 0px 6px #e0dcd7;
writing-mode: rl-bt;
border:1px solid #e0dcd7;
padding:3px;
opacity:.5;
box-shadow: 0px 0px 6px #e0dcd7;
}

#credit a {
    color:#b9acab;
    text-shadow: 0px 0px 6px #b9acab;
}


    .popup_block{
    display:none;
    background:#fff;
    color:#000;
    padding:20px;
    border:1px solid #eeeeee;
    float:left;
    position:fixed;
    top:50%;left:50%;
    z-index: 99999;
    -webkit-box-shadow: 0px 0px 20px #fff;
    -moz-box-shadow: 0px 0px 20px #fff;
    box-shadow: 0px 0px 20px #fff;
}

*html #fade {position: absolute;}
*html .popup_block {position: absolute;}
#fade {
    display:none;
    position:fixed;
    left:0px;
    top:0px;
    width:100%;
    height:100%;
    z-index:9999;
    background:#fff;
    opacity:0.5;
}

#box1 b, strong {
    color: #9c9c9c;
}

#box1 a {
    color:{color:Link};
}

#box1 a:hover {
   letter-spacing:2px;
}


#box1 ul {
    margin-left:-15px;
}


#box2 {
}

#box2 td {
    color: #fff;
    background-color:#000000;
    width: 200px;
    padding:5px;
    text-align:center;
}

#box2 a {
       color: #ffffff;
       text-decoration:none;
        -moz-transition-duration: 0.5s;
        -o-transition-duration: 0.5s;
        -webkit-transition-duration: 0.5s;
        transition-duration: 0.5s;
}

box2 a:hover {
    letter-spacing:9px;
}

#box2 table {
 margin-left:40px;
}


{CustomCSS}</style></head><body>

<img src="{image:render}" style="position:fixed;top:0px;left:0px;z-index:-999"/>

<div id="tagline"><a href="/">{text:tagline}</a></div>

<div id="menu"><a href="{text:url 1}" title="{text:link title 1}">{text:name 1}</a> &nbsp;
    <a href="#?w=300" rel="box0" class="poplight" title="{text:link title 2}">{text:name 2}</a> &nbsp;
    <a href="#?w=300" rel="box1" class="poplight" title="{text:link title 3}">{text:name 3}</a> &nbsp;
    <a href="#?w=300" rel="box2" class="poplight" title="{text:link title 4}">{text:name 4}</a> &nbsp;
</div>

<div id="sidebar"><div id="sidebarimage"><img src="{image:sidebar}"></div>

<div id="desc">
{text:subtitles}
</div>

{block:Pagination}
<div class="pagi">
{block:PreviousPage}
<a href="{PreviousPage}">rise &</a>
{/block:PreviousPage}

{block:NextPage}
<a href="{NextPage}"> fall</a>
{/block:NextPage}
</div>
{/block:Pagination}


</div>

 <div id="container" style="overflow-y: scroll;">
  <div style="padding: 3px;">

<div id="entries">{block:Posts}<div id="posts">


{block:Text}<h1>{block:Title}{Title}{/block:Title}</h1>{Body}{/block:Text}


{block:Photo}{LinkOpenTag}<img src="{PhotoURL-500}">{LinkCloseTag}{block:Caption}{Caption}{/block:Caption}{/block:Photo}


{block:Link}<h1><a href="{URL}" {Target}>{Name}</a></h1>{block:Description}{Description}{/block:Description}{/block:Link}


{block:Photoset}{Photoset-500}{block:Caption}{Caption}{/block:Caption}{/block:Photoset}


{block:Quote}<div class="quote">" {Quote} "</div>{block:Source} <div class="quotesource">—{Source}</div>{/block:Source}{/block:Quote}


{block:Audio}
<div class="audio">
{block:AlbumArt}<img class="audio-album" src="{AlbumArtURL}">{/block:AlbumArt}
<div class="audio-player">{block:AudioPlayer}{AudioPlayerWhite}{/block:AudioPlayer}</div>


<div class="audio-info">
{block:TrackName}<b>Title:</b> {TrackName}<BR>{/block:TrackName}
{block:Artist}<b>Artist:</b> {Artist}<BR>{/block:Artist}
{block:Album}<b>Album:</b> {Album}<BR>{/block:Album}
{block:PlayCount}<b>Plays:</b> {PlayCount}<BR>{/block:PlayCount}
</div></div>
<div class="audiocaption">{block:Caption}{Caption}{/block:Caption}</div>
{/block:Audio}


{block:Video}{Video-500}{block:Caption}{Caption}{/block:Caption}{/block:Video}


{block:Chat}<ul class="chat">{block:Title}{Title}{/block:Title} {block:Lines}<li class="user_{UserNumber}">{block:Label}<span class="label">{Label}</span>{/block:Label}&nbsp;{Line}</li>{/block:Lines}</ul>{/block:Chat}



{block:Answer}
<table style="width:100%; border:2px dotted #a69e9c;padding:10px;margin-bottom:5px;">
<tr>
<td style="vertical-align:top;padding-right:10px;"><img src="{AskerPortraitURL-64}" style="-webkit-border-radius: 50px;
-moz-border-radius: 50px; border:1px solid #a69e9c"></td>
<td style="vertical-align:top;"><strong><span style="text-transform:lowercase">{Asker}</span> <span style="color:#000;">asked:</span></strong><span style="font-size:12px;"> {Question}</span></td>
</tr>
</table>
{Answer}
{/block:Answer}


<div id="info"> posted <a href="{Permalink}">{ShortMonth} {DayOfMonth}{DayOfMonthSuffix} at {12Hour}:{Minutes} </a> {block:RebloggedFrom} from <a href="{ReblogParentURL}">{ReblogParentName}</a>{/block:RebloggedFrom} {block:ContentSource} <a href="{SourceURL}">© <a href="{SourceURL}">{SourceLink}</a> {/block:ContentSource}{block:RebloggedFrom} <a href="{ReblogParentURL}" target="_blank"></a>{/block:RebloggedFrom} with <a href="{Permalink}">{NoteCountWithLabel}</a>
{block:HasTags}<div id="tags">{block:Tags} #<a href="{TagURL}">{Tag}</a> {/block:Tags}</div>{/block:HasTags}</div></div>
{/block:Posts}
{block:PostNotes}<div id="notes">{PostNotes}</div>{/block:PostNotes}

{/block:Posts}</div></div></div>
 </div>

{block:ContentSource}
<!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
{/block:SourceLogo}
{block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
{/block:ContentSource}


    <div id="box0" class="popup_block"><h2>ASKBOX</h2>
<iframe frameborder="0" height="200" id="ask_form" scrolling="yes" src="http://www.tumblr.com/ask_form/{Name}.tumblr.com" width="100%"></iframe>
</div>

<div id="box1" class="popup_block">
<h2>POPUP PAGE</h2><p>
CONTENT.
</div>

<div id="box2" class="popup_block">
<h2>navigation</h2><p>
<table>
        <tr><td><a href="/">LINK</a></td></tr>
        <tr><td><a href="/">LINK</a></td></tr>
        <tr><td><a href="/">LINK</a></td></tr>
        <tr><td><a href="/">LINK</a></td></tr>
        <tr><td><a href="/">LINK</a></td></tr>
        <tr><td><a href="/">LINK</a></td></tr>
        <tr><td><a href="/">LINK</a></td></tr>
        <tr><td><a href="/">LINK</a></td></tr>
        <tr><td><a href="/">LINK</a></td></tr>
</table>
</div>

  <div id="credit"><a href="http://appubito.tumblr.com" title="theme by appubito">A2</a></div>

    </body>
</html>