Theme 59: Aria

<!--Theme 58- Aria By Beautifully Flawless   -->
<!-- DO NOT REMOVE CREDIT   -->
<!-- DO NOT REMOVE CREDIT   -->
<!-- DO NOT REMOVE CREDIT   -->
<!-- DO NOT REMOVE CREDIT   -->
<!-- DO NOT REMOVE CREDIT   -->
<html>
<head>

<!--DO NOT DELETE THIS CODING-->
<script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
<script type="text/javascript">
$(window).load(function () {
var $content = $('#posts');
$content.masonry({itemSelector: '.entry'}),
$content.infinitescroll({
navSelector : 'div#pagination',
nextSelector : 'div#pagination a#nextPage',
itemSelector : '.entry',
loading: {
finishedMsg: '',
img: 'http://static.tumblr.com/dbek3sy/pX1lrx8xv/ajax-loader.gif'
},
bufferPx : 600,
debug : false,
},
// call masonry as a callback.
function( newElements ) {
var $newElems = $( newElements );
$newElems.hide();
// ensure that images load before adding to masonry layout
$newElems.imagesLoaded(function(){
$content.masonry( 'appended', $newElems, true, function(){$newElems.fadeIn(300);} );


});
});
});
</script>

<title>{title}</title>
<link rel="shortcut icon" href="{favicon}">
<link rel="alternate" type="application/rss+xml" title="RSS" href="{RSS}" /><meta name="viewport" content="width=820" />

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

<script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
<!--DO NOT DELETE THIS CODING-->


<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<!--Variables-->
<meta name="color:Scrollbar BG" content="#ffffff" />
<meta name="color:Scrollbar" content="#fff" />
<meta name="color:Background" content="#fff" />
<meta name="color:Text" content="#000" />
<meta name="color:Links" content="#555" />
<meta name="color:Links Hover" content="#aaa" />
<meta name="color:Posts BG" content="#fff" />
<meta name="color:Posts Shadow" content="#555" />
<meta name="color:image Permalink BG" content="#fff" />
<meta name="color:image Permalink Border" content="#aaa" />
<meta name="color:Posts Permalink Border" content="" />
<meta name="color:Posts Header" content="#000" />
<meta name="color:Asker" content="#999" />
<meta name="color:Asker Box Border" content="#ddd" />
<meta name="color:Asker Box Shadow" content="#000" />
<meta name="color:Sidebar BG" content="#fff" />
<meta name="color:Sidebar Border" content="#ccc" />
<meta name="color:Sidebar Shadow" content="#555" />
<meta name="color:Statistics" content="#888" />
<meta name="color:Navigation BG" content="#fff" />
<meta name="color:Navigation Border" content="#888" />
<meta name="color:Navigation" content="#888" />
<meta name="color:Navigation Hover BG" content="#fff" />
<meta name="color:Navigation Hover" content="#666" />
<meta name="color:Navigation Hover Border" content="#888" />
<meta name="color:Navigation Hover Shadow" content="#555" />
<meta name="color:HOVER Title" content="#878787" />
<meta name="color:Banner" content="#777" />
<meta name="color:Banner Shadow" content="#888" />
<meta name="color:Sidebar Header" content="#878787" />
<meta name="color:Sidebar Header Shadow" content="#ddd" />
<meta name="color:Asker Portrait Shadow" content="#000" />
<meta name="color:Asker Portrait Background" content="#fff" />


<meta name="image:Sidebar" content="http://static.tumblr.com/a3b5a4be4fbef9d7958d4020a3b32bc1/gdh5wux/Cd1mpxujh/tumblr_static_358_8_284029.jpg" />
<meta name="image:Background" content="http://static.tumblr.com/5uvtpxx/Cr3mpl8ko/light__1_.jpg" />
<meta name="image:Corner Image" content="http://i.imgur.com/ImW65eV.png" />

<meta name="text:Stats 1" content="INSERT STAT HERE" />
<meta name="text:Stats 2" content="INSERT STAT HERE" />
<meta name="text:Link 1 URL" content="/submit" />
<meta name="text:Link 2 URL" content="/archive" />
<meta name="text:Link 3 URL" content="/links" />
<meta name="text:Link 1" content="Submit" />
<meta name="text:Link 2" content="Archive" />
<meta name="text:Link 3" content="Other Links" />

<!--Variables-->
<style type="text/css">

::-webkit-scrollbar {width: 9px; height: 3px; background:{color:Scrollbar BG};}
::-webkit-scrollbar-thumb {background:{color:Scrollbar}; border-radius:5px;}

#tumblr_controls{
position:fixed !important;
}

@font-face{font-family:"tinytots";src:url('http://static.tumblr.com/rmj06l2/Usellxb4i/tinytots.ttf');}

@font-face{font-family:"caviardreams";src:url('http://static.tumblr.com/alux5te/8BFltyod3/caviardreams.ttf');}

@font-face{font-family:"quicksand"; src: url('http://static.tumblr.com/fxpo5zq/ad0m5vybr/quicksand_light.otf');}

@font-face{font-family:"bebas neue";src:url('http://static.tumblr.com/cvlbtjz/cnsln9tpp/bebasneue.otf');}

@font-face{font-family:"silkscreen";src:url('http://static.tumblr.com/1kdckk4/9yjlolf0w/slkscr.ttf');}

@font-face { font-family: "Espacio"; src: url('http://static.tumblr.com/gdh5wux/cPLmoz1ma/espacio.ttf'); }

@font-face { font-family: "stemp"; src: url('http://static.tumblr.com/gdh5wux/vyHmesmtu/odstemplik.ttf'); }

@font-face { font-family: "discipuli"; src: url('http://static.tumblr.com/gdh5wux/MN6moz1m2/discipuli.ttf'); }

body {
margin: 0px;
background-color:{color:Background};
background-image:url('{image:Background}');
background-attachment: fixed;
background-repeat: repeat;
background-position: center;
}

body, div, p, textarea, submit, input {
font-family:"tinytots";
font-size:8px;
line-height:12px;
color:{color:Text};
text-transform:uppercase;
}

body, a, a:hover {cursor: url('http://media.tumblr.com/tumblr_m6ani47MHm1rqir0v.png'), progress;}

a:link, a:active, a:visited{
color:{color:Links};
text-decoration: none;
-webkit-transition: color 0.4s ease-out;
-moz-transition: color 0.4s ease-out;
}

a:hover{
color:{color:Links Hover};
-webkit-transition: color 0.4s ease-out;
-moz-transition: color 0.4s ease-out;
}

div#posts {
width:820px;
margin-left:400px;
z-index:1;
float:left;
}

.entry {
margin:4px;
float:left;
overflow:hidden;
background-color:{color:Posts BG};
box-shadow: 1px 1px 3px {color:Posts Shadow};
padding:5px;
{block:IndexPage}
width:250px;
{/block:IndexPage}
{block:PermalinkPage}
width:500px;
{/block:PermalinkPage}
}

.entry:hover #info{
opacity:1.0;
-webkit-transition: opacity 0.3s ease-out;
-webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}

#info{
position:absolute;
background-color:{color:image Permalink BG};
border-bottom:4px solid {color:image Permalink Border};
width:255px;
height:15px;
top:3px;
left:0px;
overflow:hidden;
padding:5px;
opacity:0.0;
font-family:tinytots;
font-size:8px;
line-height:15px;
text-align:center;
letter-spacing:1px;
text-transform:uppercase;
-webkit-transition: opacity 0.6s ease-out;
-webkit-transition: all 0.6s ease-out;
-moz-transition: all 0.6s ease-out;
transition: all 0.6s ease-out;
}

#infoo{
font-family:tinytots;
color:{color:Posts Permalink Border};
font-size:8px;
text-align:right;
line-height:20px;
margin-top:10px;
border-top:1px dotted {color:Posts Permalink Border};
}

#infscr-loading{
bottom: -70px;
position: absolute;
left: 50%;
margin-left:-8px;
width:16px;
height:11px;
overflow:hidden;
margin-bottom: 50px;
}

.title{
font-family:quicksand;
text-transform:uppercase;
font-size:20px;
line-height:20px;
color:{color:Posts Header};
text-align:center;
}

.quote{
font-family:caviardreams;
font-size:12px;
color:#888;
text-transform:none;
line-height:10px;
text-align:right;
}

blockquote{
padding:0px 0px 2px 5px;
margin:0px 0px 2px 10px;
border-left: 1px dotted #555555;
}

asker{
font-family:'stemp';
font-size:10px;
text-transform:uppercase;
color:{color:Asker};
}

#ask{
padding:3px;
font-family:'silkscreen';
font-size:8px;
text-transform:uppercase;
color:{color:Text};
}

#askbox{
border:3px solid {color:Asker Box Border};
margin-top:0px;
margin-left:5px;
overflow:auto;
padding:4px;
box-shadow: 1px 1px 1px {color:Asker Box Shadow};
}

ul, ol, li{list-style:none; margin:0px; padding:0px;}

.user_1 .label, .user_4 .label, .user_7 .label, .user_2 .label, .user_5 .label, .user_8 .label, .user_3 .label, .user_6 .label,
.user_9 .label {color:{color:text};}

.notes img{width:16px; position:relative; top:3px;}

#brush img{position:fixed;height:440px;left:-15px;top:0px;z-index:-999;opacity:0.6;}

#sidebar{
position:fixed;
width:260px;
height:320px;
top:80px;
left:60px;
padding:15px;
background:{color:Sidebar BG};
box-shadow: 1px 1px 3px {color:Sidebar Shadow};
border:1px dotted {color:Sidebar Border};
}

#sidebar img{
width:100%;
height:100%;
}

#des{
position:fixed !important;
width:260px;
height:10px;
top:30px;
left:60px;
padding:15px;
background:{color:Sidebar BG};
overflow:hidden;
text-align:center;
box-shadow: 1px 1px 3px {color:Sidebar Shadow};
border:1px dotted {color:Sidebar Border};
-webkit-transition: opacity 0.7s linear;
-webkit-transition: all 0.7s ease-in-out;
-moz-transition: all 0.7s ease-in-out;
-o-transition: all 0.7s ease-in-out;
z-index:999;
}

#des:hover{
height:370px;
-webkit-transition: opacity 0.7s linear;
-webkit-transition: all 0.7s ease-in-out;
-moz-transition: all 0.7s ease-in-out;
-o-transition: all 0.7s ease-in-out;
}

#statistics{
position:fixed;
width:260px;
height:0px;
top:440px;
left:60px;
padding:15px;
background:{color:Sidebar BG};
box-shadow: 1px 1px 3px {{color:Sidebar Shadow}};
border:1px dotted {color:Sidebar Border};
font-family:'silkscreen';
text-transform:uppercase;
text-align:center;
line-height:3px;
color:{color:Statistics};
}

#navigation{
width:330px;
height:auto;
left:35px;
top:480px;
position:fixed;
}

div.navigate a{
background:{color:Navigation BG};
border:2px solid {color:Navigation Border};
height:25px;
width:25px;
padding:3px;
float:left;
margin-left:20px;
margin-top:5px;
font-size:20px;
text-transform:uppercase;
text-align:center;
line-height:30px;
color:{color:Navigation};
-webkit-transition: all 1s ease-out;
-moz-transition: all 1s ease-out;
transition: all 1s ease-out;
}

div#qTip {
padding:5px;
display:none;
text-align:center;
position: absolute;
font-size:12px;
line-height:10px;
font-family:'quicksand';
z-index:99999;
color:{color:Navigation Hover};
background:{color:Navigation Hover BG};
border:1px dotted {color:Navigation Hover Border};
box-shadow: 1px 1px 3px {color:Navigation Hover Shadow};
}

#name{
font-family:"Espacio";
color:{color:HOVER Title};
font-size:45px;
line-height:15px;
text-align:center;
letter-spacing:8px;
text-transform:uppercase;
}

#blogtitle{
position:fixed;
font-family:'stemp';
text-transform:none;
color:{color:Banner};
font-size:65px;
z-index:99999999;
text-align:center;
text-shadow:0px 1px 4px {color:Banner Shadow};
left:20px;
top:550px;
}

#name2{
font-family:"discipuli";
color:{color:Sidebar Header};
font-size:20px;
line-height:25px;
text-align:center;
letter-spacing:0px;
text-transform:none;
border-bottom:1px dashed {color:Sidebar Header Shadow};
}


{CustomCSS}
</style>
<script language="JavaScript" src="http://dl.dropbox.com/u/3173073/GothicDarkness/qTip.js" type="text/JavaScript"></script>

<!-- CSS CODING -->
<div id="brush">
<img src="http://s9.postimg.org/au6pej2fj/Brush_Stroke_2.png">
</div>

<div id="sidebar">
<div id="des">
<div id="blogtitle">{title}</div>
<div id="name">HOVER</div>
<br>
<div id="name2">About The Blogette</div>
{description}
<div id="name2">Obsessions</div>
TEXT HERE TEXT HERE TEXT HERE TEXT HERE TEXT HERE TEXT HERE TEXT HERE TEXT HERE TEXT HERE TEXT HERE TEXT HERE TEXT HERE TEXT HERE TEXT HERE TEXT HERE TEXT HERE TEXT HERE TEXT HERE TEXT HERE TEXT HERE TEXT HERE TEXT HERE TEXT HERE TEXT HERE TEXT HERE TEXT HERE TEXT HERE TEXT HERE TEXT HERE TEXT HERE TEXT HERE TEXT HERE TEXT HERE TEXT HERE TEXT HERE TEXT HERE TEXT HERE TEXT HERE TEXT HERE TEXT HERE TEXT HERE TEXT HERE TEXT HERE TEXT HERE TEXT HERE TEXT HERE TEXT HERE TEXT HERE TEXT HERE
<div id="name2">Disclaimer</div>
I own none of the pictures reblogged or posted unless stated or watermarked, please notify me if proper credit hasn't been given.
</div>
<img src="{image:Sidebar}">
</div>

<div id="statistics">
{text:Stats 1}&nbsp;&hearts;&nbsp;{text:Stats 2}
</div>

<div id="navigation">
<div class="navigate">
<a href="/"title="Refresh">&#8544;</a>
<a href="/ask"title="Message">&#8545;</a>
<a href="{text:Link 1 URL}"title="{text:Link 1}">&#8546;</a>
<a href="{text:Link 2 URL}"title="{text:Link 2}">&#8547;</a>
<a href="{text:Link 3 URL}"title="{text:Link 3}">&#8548;</a>
<a href="http://beautifully-flawless.tumblr.com/"title="Credit">&#8549;</a>
</div>
</div>

<img style="position:fixed;height:550px;right:-100px;bottom:0px;" src="{image:Corner Image}">

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


{block:Text}
{block:Title}<div class="title">{Title}</div>{/block:Title}
<span class="entrytext">{Body}</span>
<div id="infoo">
<a href="{Permalink}"><a href="{permalink}">{NoteCountWithLabel}</a> . <a href="{ReblogURL}" target="_blank"> reblog</a>&nbsp;
</div>
{/block:Text}

{block:Link}
<div class="title"><a href="{URL}">{Name}</a></div>
{block:Description}{Description}{/block:Description}
<div id="infoo">
<a href="{Permalink}"><a href="{permalink}">{NoteCountWithLabel}</a> . <a href="{ReblogURL}" target="_blank"> reblog</a>&nbsp;
</div>
{block:Link}

{block:Photo}
<div id="info">
<a href="{Permalink}"><a href="{permalink}">{NoteCountWithLabel}</a> . <a href="{ReblogURL}" target="_blank"> reblog</a>&nbsp;
</div>
{block:IndexPage}
{LinkOpenTag}
<div class="photo"><a href="{permalink}">
<img class="photo"src="{PhotoURL-HighRes}"alt="{PhotoAlt}"width="250"/></a></div>
{LinkCloseTag}
{/block:IndexPage}
{block:PermalinkPage}
{LinkOpenTag}
<a href="{permalink}"><img class="photo" src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="500"/></a>
{LinkCloseTag}
{/block:PermalinkPage}
{/block:Photo}

{block:Photoset}
<div id="info">
<a href="{Permalink}"><a href="{permalink}">{NoteCountWithLabel}</a> . <a href="{ReblogURL}" target="_blank"> reblog</a>&nbsp;
</div>
{block:IndexPage}
<center>
{Photoset-250}
</center>
{/block:IndexPage}
{block:PermalinkPage}
<center>
{Photoset-500}
</center>
{/block:PermalinkPage}
{/block:Photoset}

{block:Quote}
{Quote}
</span>
{block:Source}
<div class="quote">{Source}</div>
{/block:Source}
<div id="infoo">
<a href="{Permalink}"><a href="{permalink}">{NoteCountWithLabel}</a> . <a href="{ReblogURL}" target="_blank"> reblog</a>&nbsp;
</div>
{/block:Quote}

{block:Chat}
{block:Title}
<span class="title">{Title}</span>
{/block:Title}
<ul class="chat">
{block:Lines}
<li class="user_{UserNumber}">
{block:Label}
<span class="label">{Label}</span>
{/block:Label}
{Line}
</li>
{/block:Lines}
</ul>
<div id="infoo">
<a href="{Permalink}"><a href="{permalink}">{NoteCountWithLabel}</a> . <a href="{ReblogURL}" target="_blank"> reblog</a>&nbsp;
</div>
{/block:Chat}

{block:Audio}
<center>
<div style="width:350px;height:30px;">
<div style="float:left">{AudioPlayerBlack}</div>
<div style="margin-top:10px; float:right;">
{block:ExternalAudio}
{/block:ExternalAudio}
</div></div>
</center>
<div id="infoo">
<a href="{Permalink}"><a href="{permalink}">{NoteCountWithLabel}</a> . <a href="{ReblogURL}" target="_blank"> reblog</a>&nbsp;
</div>
{/block:Audio}

{block:Video}
{block:IndexPage}
<center>
{Video-250}
</center>
{/block:IndexPage}
{block:PermalinkPage}
<center>
{Video-500}
</center>
{/block:PermalinkPage}
<div id="infoo">
<a href="{Permalink}"><a href="{permalink}">{NoteCountWithLabel}</a> . <a href="{ReblogURL}" target="_blank"> reblog</a>&nbsp;
</div>
{block:Video}

{block:Answer}
<img src="{AskerPortraitURL-40}" width="40" align="left" style="margin-right:6px; box-shadow: 1px 1px 1px {color:Asker Portrait Shadow}; padding:3px; background:{color:Asker Portrait Background};"/>
<div id="askbox">
<asker>{Asker}:</asker>
<div id="ask">{Question}</div>
</div>
<br>
<asker>I Answered:</asker>
{Answer}
{block:IndexPage}
<div id="infoo">
<a href="{Permalink}"><a href="{permalink}">{NoteCountWithLabel}</a> . <a href="{ReblogURL}" target="_blank"> reblog</a>&nbsp;
</div>
{/block:IndexPage}
{/block:Answer}

{block:PermalinkPage}
<center>
<br>
{block:Caption}
{Caption}
{/block:Caption}

{block:NoteCount}
{NoteCountWithLabel}
{/block:NoteCount}

{block:HasTags}
&middot;{block:Tags}<a href="TagURL">#{Tag}</a>{/block:Tags}
{/block:hasTags}
</center>
{/block:PermalinkPage}


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

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


{block:IndexPage}
<script type="text/javascript" src="http://static.tumblr.com/dbek3sy/iBElrgjim/jquerymasonry.js"></script>
<script type="text/javascript" src="http://static.tumblr.com/dbek3sy/Qyblrgjfn/jqueryinfintescroll.js"></script>

<script type="text/javascript">
$(window).load(function () {
var $content = $('#posts');
$content.masonry({itemSelector: '.entry'}),
$content.infinitescroll({
navSelector : 'div#pagination',
nextSelector : 'div#pagination a#nextPage',
itemSelector : '.entry',
loading: {
finishedMsg: '',
img: 'http://static.tumblr.com/dbek3sy/pX1lrx8xv/ajax-loader.gif'
},
bufferPx : 600,
debug : false,
},
// call masonry as a callback.
function( newElements ) {
var $newElems = $( newElements );
$newElems.hide();
// ensure that images load before adding to masonry layout
$newElems.imagesLoaded(function(){
$content.masonry( 'appended', $newElems, true, function(){$newElems.fadeIn(400);} );


});
});
});
</script>
{/block:IndexPage}
{block:IndexPage}
{block:Pagination}
<div id="pagination">
{block:NextPage}
<a id="nextPage" href="{NextPage}"></a>
{/block:NextPage}
{block:PreviousPage}
<a href="{PreviousPage}"></a>
{/block:PreviousPage}
</div>
{/block:Pagination}
{/block:IndexPage}
</div>
</body>
</html>