Theme 29: Annabelle

<!--Theme 29: Annabelle
By Beautifully Flawless
DO NOT REMOVE CREDIT, OR YOU WILL BE REPORTED.
DO NOT REMOVE CREDIT, OR YOU WILL BE REPORTED.
DO NOT REMOVE CREDIT, OR YOU WILL BE REPORTED.
DO NOT REMOVE CREDIT, OR YOU WILL BE REPORTED.
DO NOT REMOVE CREDIT, OR YOU WILL BE REPORTED.
DO NOT REMOVE CREDIT, OR YOU WILL BE REPORTED.
-->
<html>
<head>


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

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

<!--Variables-->

<meta name="color:Background" content="#fff"/>
<meta name="color:Text" content="#000000"/>
<meta name="color:Title" content="#000000"/>
<meta name="color:Link" content="#f8989a"/>
<meta name="color:Hover" content="#888888"/>
<meta name="color:Posts BG" content="#fff"/>
<meta name="color:Posts Border" content="#f8989a"/>
<meta name="color:Navigation BG" content="#f8989a" />
<meta name="color:Navigation Text" content="#000" />
<meta name="color:Navigation Hover BG" content="#F8C1EC" />
<meta name="color:Navigation Hover Shadow" content="#f8989a" />
<meta name="color:Favorites Shadow" content="#f8989a" />
<meta name="color:Sidebar BG" content="#fff"/>
<meta name="color:Sidebar Border" content="#f8989a"/>
<meta name="color:Sidebar Hover Shadow" content="#f8989a"/>
<meta name="color:First Letter" content="#f8989a"/>
<meta name="color:Box Border" content="#f8989a"/>
<meta name="color:Banner" content="#f8989a"/>
<meta name="color:Banner Shadow" content="#888"/>
<meta name="color:Portrait BG"content="#fff"/>
<meta name="color:Scrollbar"content="#f8989a"/>

<meta name="image:Background" content=""/>
<meta name="image:fav 1" content="http://i42.tinypic.com/fk2o3r.png"/>
<meta name="image:fav 2" content="http://i40.tinypic.com/33xtz7r.png"/>
<meta name="image:fav 3" content="http://i43.tinypic.com/2nsqr7p.png"/>
<meta name="image:fav 4" content="http://i44.tinypic.com/121vot5.png"/>
<meta name="image:fav 5" content="http://i41.tinypic.com/r0sew6.png"/>

<meta name="text:STATS 1" content="INSERT STAT HERE" />
<meta name="text:STATS 2" content="INSERT STAT HERE" />
<meta name="text:STATS 3" content="INSERT STAT HERE" />
<meta name="text:STATS 4" content="INSERT STAT HERE" />
<meta name="text:Favorite 1 URL" content=""/>
<meta name="text:Favorite 2 URL" content=""/>
<meta name="text:Favorite 3 URL" content=""/>
<meta name="text:Favorite 4 URL" content=""/>
<meta name="text:Favorite 5 URL" content=""/>
<meta name="text:Favorite 1" content="BLOG NAME"/>
<meta name="text:Favorite 2" content="BLOG NAME"/>
<meta name="text:Favorite 3" content="BLOG NAME"/>
<meta name="text:Favorite 4" content="BLOG NAME"/>
<meta name="text:Favorite 5" content="BLOG NAME"/>

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


::-webkit-scrollbar {width: 9px; height: 3px; background:transparent;}
::-webkit-scrollbar-thumb {background:{color:Scrollbar}; border-radius:5px; -webkit-box-shadow:0px 0px 10px {color:Scrollbar};}

#tumblr_controls{
position:fixed !important;
-webkit-filter: invert(100%);
}

@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:"lainie";src:url('http://static.tumblr.com/oetadgc/Uialyjfaa/laine.ttf');}

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

@font-face { font-family: "edwardian"; src: url('http://static.tumblr.com/oetadgc/sUtm6d6kz/ufonts.com_edwardian-script-itc-2.ttf'); }

@font-face { font-family:"arsenale"; src: url('http://static.tumblr.com/emvmfcr/fVPlulq0f/arsenale_white.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;
}

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

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

div#posts {
float:left;
width:740px;
margin-left:580px;
margin-top:0px;
}

.entry {
margin:3px;
float:left;
padding:5px;
overflow:hidden;
background-color:{color:Posts BG};
border:3px double {color:Posts Border};
{block:IndexPage}
width:320px;
{/block:IndexPage}
{block:PermalinkPage}
width:500px;
{/block:PermalinkPage}
}

.perma{
opacity: 0.0;
filter:alpha(opacity = 0);
margin-top:-21px;
width:0px;
height:30px;
line-height:30px;
font-size:9px;
position:absolute;
text-align:center;
z-index:800;
color:#000;
}

a.p{color:#fff;}


.entry:hover .perma {
opacity: 1;
transition: all 0.4s linear;
filter: alpha(opacity = 100);
-webkit-transition: opacity 0.4s linear;
-moz-transition: all 0.4s linear;
}

.likep{
top:26px;
left:5px;
z-index:99;
width:21px;
height:20px;
overflow:hidden;
position: absolute;
}

.likep img {
width:21px;
height:20px;
webkit-transition: all 0.2s linear;
-webkit-transition: all 0.2s linear;
-moz-transition: all 0.2s linear;
transition: all 0.2s linear;
}

.rep{
top:26px;
left:29px;
width:24px;
height:20px;
overflow:hidden;
position:absolute;
z-index:99;
}

.rep img{
width:24px;
height:20px;
line-height:30px;
display:inline;
}


.likep a:hover{background-position: 0px 0px;}

.likep a{
background-image: url("http://static.tumblr.com/uiqhh9x/BPnlzww8v/like.png");
background-position:0px 0px;
display:block;
z-index:99;
webkit-transition: all 0s linear;
-webkit-transition: all 0s linear;
-moz-transition: all 0s linear;
transition: all 0s linear;
}

.not{
position:absolute;
background: url("http://static.tumblr.com/uiqhh9x/X6Ym17xp2/middle.png");
height:20px;
font-size:11px;
line-height:20px;
color:#fff;
position:absolute;
top:26px;
left: 56px;
padding-left:4px;
padding-right:4px;
-moz-border-radius:2px;
border-radius:2px;
}

.not a{
color:#fff;
font-weight:bold;
font-family:Arial, Helvetica, sans-serif;
}

.entry:hover .not, .entry:hover .rep, .entry:hover .likep{opacity: 0.8;filter: alpha(opacity = 80);}

.not:hover , .rep:hover, .likep:hover{opacity: 1!important;filter: alpha(opacity = 100)!important;}


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

.title{
font-family:'edwardian';
text-transform:none;
font-size:30px;
line-height:30px;
color:#000;
text-align:center;
}

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

asker{
letter-spacing:1px;
padding:3px;
margin-right:5px;
font-family:'arsenale';
font-size:25px;
text-align:center;
background:#eeeeee;
text-transform:none;
}

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

.askerimg img{
width:40px;
align:left;
float:left;
padding:1px;
background:#ddd;
margin-right:6px;
border-radius:10px;
box-shadow:0px 1px 1px #888;
}

#askbox{
overflow:hidden;
padding:5px;
border-radius:5px;
border:2px solid #ddd;
}

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

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:10px; position:relative; top:3px;}

#sidebar{
position:fixed;
width:270px;
height:640px;
top:0px;
left:300px;
text-align:center;
background-color:{color:Sidebar BG};
border:2px double {color:Sidebar Border};
-webkit-transition: all 1s ease-in-out;
-moz-transition: all 1s ease-in-out;
transition: all 1s ease-in-out;
}

#sidebar:hover{
box-shadow:0px 0px 10px {color:Sidebar Hover Shadow};
-webkit-transition: all 1s ease-in-out;
-moz-transition: all 1s ease-in-out;
transition: all 1s ease-in-out;
}

#name{
color:#000;
font-family:"edwardian";
font-size:25px;
line-height:25px;
text-align:center;
text-transform:none;
}

#name:first-letter{
font-family:"chopin";
font-size:22px;
color:{color:First Letter};
line-height:22px;
}

.heart{display:block;font-size: 8px;text-align:center;font-family: 'tinytots';line-height:15px;vertical-align:middle;background:url('http://www.hellostar.org/wp-admin/images/q1.gif') no-repeat left;}


div.navigate a{
height:20px;
width: 60px;
float:left;
margin:3px;
margin-left:20px;
font-family:tinytots;
font-size:8px;
text-align:center;
text-transform:uppercase;
line-height:20px;
border-radius:5px;
color:{color:Navigation Text};
background-color:{color:Navigation BG};
-webkit-transition: all 1s ease-in-out;
-moz-transition: all 1s ease-in-out;
transition: all 1s ease-in-out;
}


div.navigate a:hover{
background-color:{color:Navigation Hover BG};
text-shadow:1px 0px 1px {color:Navigation Hover Shadow};
}

#bigbox{
position:fixed;
width:295px;
height:241px;
top:400px;
left:2px;
}

#faves img{
width:50px;
height:50px;
opacity:0.8;
margin:2px;
border-radius:30px;
-webkit-transition-duration:.7s;
box-shadow:0px 0px 5px {color:Favorites Shadow};
}

#faves img:hover{
opacity:1;
border-radius:5px;
-webkit-transition: 0.2s ease-in;
box-shadow:0px 0px 10px {color:Favorites Shadow};
}

#banner{
position:fixed;
left:0px;
top:30px;
text-transform:none;
font-size:50px;
font-family:"edwardian";
z-index:9999;
text-align:center;
color:{color:Banner};
text-shadow:0px 2px 2px {color:Banner Shadow};
}

#portraitpic img{
margin-left:2px;
margin-top:0px;
float:left;
padding:2px;
background-color:{color:Portrait BG};
border:1px solid {color:Portrait Border};
}

#sidebarpic img{
position:fixed;
width:300px;
}

#lace-top{
background-image:url('http://media.tumblr.com/a0bd179f2a15ff78d7b3823b21ff16d4/tumblr_inline_msi5759s8Y1s5uslz.gif');
repeat:repeat-x;
left:0px;
width:100%;
top:-5px;
height:37px;
position:absolute;
z-index:999;
}

#lace-bottom{
background-image:url('http://media.tumblr.com/0f2d03ac8c5e3acc81b5f7dae6b47189/tumblr_inline_msi5azbuhy1s5uslz.gif');
repeat:repeat-x;
left:0px;
width:100%;
bottom:0px;
height:37px;
position:absolute;
z-index:999;
}



{CustomCSS}
</style>
<body>

<div id="sidebarpic">
<img src="http://static.tumblr.com/gdh5wux/4DQmb2ay1/1209-blake-lively-3-de_large.png">
</div>

<div id="banner"><span id="bubble">{title}</span></div>

<div id="sidebar">
<div id="lace-top"></div>
<br><br><br>
<div id="name">About This Princess</div>
<div id="portraitpic"><a href="/"><img src="{PortraitURL-64}"/></a></div>
<!--DESCRIPTION-->
{description}
<br>

<!--JADORE OR OBSESSIONS-->
<div id="name">Jadore</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
<!--JADORE OR OBSESSIONS-->
<br>
<!--DISCLAMER-->
<div id="name">Disclaimer</div>
NONE OF THE PICTURES REBLOGGED OR POSTED UNLESS STATED OR WATERMARKED
<br>
If you have edited any part in this theme, state here, but the credit link still goes to beautifully flawless
<!--DISCLAMER-->

<!--STATISTICS-->
<br><br>
<div id="name">Statistics</div>
<div class="heart">{text:STATS 1}</div>
<div class="heart">{text:STATS 2}</div>
<div class="heart">{text:STATS 3}</div>
<div class="heart">{text:STATS 4}</div>
<!--STATISTICS-->


<!--NAVIGATION-->
<br>
<div id="name">Navigation</div>
<div class="navigate">
<center>
<a href="/">Home</a>
<a href="/ask">Inbox</a>
<a href="/submit">Submit</a>
<a href=".faves">Favs</a>
<a href="/links">Links</a>
<a href="http://beautifully-flawless.tumblr.com/">Credit</a>
</center>
</div>
<div id="lace-bottom"></div>
</div>


<!--fAVORITES-->
<div id="bigbox">

<div id="faves" >
<div id="name">Favorites</div>
<a href="{text:Favorite 1 URL}"><img src='{image:Fav 1}'title="{text:Favorite 1}"/></a>
<a href="{text:Favorite 2 URL}"><img src='{image:Fav 2}'title="{text:Favorite 2}"/></a>
<a href="{text:Favorite 3 URL}"><img src='{image:Fav 3}'title="{text:Favorite 3}"/></a>
<a href="{text:Favorite 4 URL}"><img src='{image:Fav 4}'title="{text:Favorite 4}"/></a>
<a href="{text:Favorite 5 URL}"><img src='{image:Fav 5}'title="{text:Favorite 5}"/></a>
</div>
<!--fAVORITES-->
<br>
<!--BLOGROLL-->
<div id="name">Blogroll</div>
<marquee behavior="scroll" scrollamount="5" direction="left" onmouseover="this.stop();" onmouseout="this.start();">{block:Following}{block:Followed}<a target='_blank' href='{FollowedURL}'><img border='0' src='{FollowedPortraitURL-96}' width="50px" height="50px" />{/block:Followed}{/block:Following}</marquee>
<!--BLOGROLL-->
</div>

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

{block:IndexPage}
<div class="perma">

<div class="likep">
<a id="like{PostID}"href="javascript:likelink('{PostID}','{Permalink}','');"><img src="http://static.tumblr.com/lba83dv/OUUltd958/spacer.gif"width="21" height="20"alt="Like this post"id="likeimage{PostID}"/></a>
</div>

<div class="rep"><a href="{reblogurl}"target="_blank"><img src="http://static.tumblr.com/uiqhh9x/OAClzwwao/reblog.png"width="30"/></a></div>

<div class="not">
<a id="notes{PostID}"href="{Permalink}">{NoteCount}</a></div>
</div>
{/block:IndexPage}

{block:Text}
{block:Title}
<div class="title">{Title}</div>
{/block:Title}
<span class="entrytext">{Body}</span>
{/block:Text}

{block:Link}
<div class="title"><a href="{URL}">{Name}</a></div>
{block:Description}{Description}{/block:Description}
{block:Link}

{block:Photo}
{block:IndexPage}
{LinkOpenTag}
<div class="photo"><a href="{permalink}">
<img class="photo"src="{PhotoURL-HighRes}"alt="{PhotoAlt}"width="100%"></a></div>
{LinkCloseTag}
{/block:IndexPage}
{block:PermalinkPage}
{LinkOpenTag}
<a href="{permalink}"><img class="photo"src="{PhotoURL-HighRes}"alt="{PhotoAlt}"width="100%"></a>
{LinkCloseTag}
{/block:PermalinkPage}
{/block:Photo}

{block:Photoset}
{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}
{/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>
{/block:Chat}

{block:Audio}
<center>{AudioPlayerWhite}</center>
{/block:Audio}

{block:Video}
{block:IndexPage}
<center>
{Video-250}
</center>
{/block:IndexPage}
{block:PermalinkPage}
<center>
{Video-500}
</center>
{/block:PermalinkPage}
{block:Video}

{block:Answer}
<div id="askbox">
<div class="askerimg"><img src="{AskerPortraitURL-40}"></div>
<asker>{Asker}:</asker>
<br><br>
<ask>{Question}</ask>
</div>{Answer}
{/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>

{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>
<script type="text/javascript" src="http://.ic.tumblr.com/uiqhh9x/aK8m1cpdr/like2.js"></script>
<iframe id="likeiframe" style="width: 0px; height: 0px; border:0px;"></iframe>
<span id="scriptsinsert"> </span>
</body>
</html>