Theme 77; Violet

<!--Theme 77- Violet, Made By Vanilla-Beaux -->
<!--PLEASE KEEP CREDIT-->
<!--PLEASE KEEP CREDIT-->
<!--PLEASE KEEP CREDIT-->
<!--PLEASE KEEP CREDIT-->
<!--PLEASE KEEP CREDIT-->
<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="#000" />
<meta name="color:Links" content="#FFA6C9" />
<meta name="color:Posts BG" content="#fff" />
<meta name="color:Posts Border" content="#ddd" />
<meta name="color:Permalink BG" content="#fff" />
<meta name="color:Permalink Border" content="#ddd" />
<meta name="color:Title" content="#777" />
<meta name="color:Permalink Text" content="#777" />
<meta name="color:Quote" content="#aaa" />
<meta name="color:Asker Text" content="#888" />
<meta name="color:Ask Text" content="#999" />
<meta name="color:Asker Image BG" content="#fff" />
<meta name="color:Ask Border" content="#aaa" />
<meta name="color:Quotebar BG" content="#fff" />
<meta name="color:Quotebar Text" content="#bbb" />
<meta name="color:Quotebar Border" content="#FFC1CC" />
<meta name="color:Blogtitle" content="#FF91AF" />
<meta name="color:Sidepic BG" content="#fff" />
<meta name="color:Description BG" content="#fff" />
<meta name="color:Heading Text" content="#aaa" />
<meta name="color:Navigation BG" content="#fff" />
<meta name="color:Navigation Border" content="#F0F0F0" />
<meta name="color:Navigation Text" content="#666" />

<meta name="image:Background" content="http://static.tumblr.com/gdh5wux/F7Tmj7amr/tumblr_static_tumblr_ltqq73kh5g1qhvdofo10_400.png" />
<meta name="image:Sidebar" content="http://static.tumblr.com/2858d7e0591e8973dcf018bd823a38e6/gdh5wux/c2in0fj49/tumblr_static_hqdiesel2_67.jpg" />

<meta name="text:Heading 1" content="Description" />
<meta name="text:Heading 2" content="Statistics" />
<meta name="text:Link 1 URL" content="/" />
<meta name="text:Link 2 URL" content="/ask" />
<meta name="text:Link 3 URL" content="/submit" />
<meta name="text:Link 4 URL" content="/faves" />
<meta name="text:Link 5 URL" content="/links" />
<meta name="text:Link 1" content="Home" />
<meta name="text:Link 2" content="Ask" />
<meta name="text:Link 3" content="Submit" />
<meta name="text:Link 4" content="Faves" />
<meta name="text:Link 5" content="Links" />
<meta name="text:Stats 1" content="INSERT STAT HERE" />
<meta name="text:Stats 2" content="INSERT STAT HERE" />
<meta name="text:Quote" content="You cannot change your past, as well as your present but future is yours to control" />


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

::-webkit-scrollbar{width:5px;height:4px;background:#fff;}
::-webkit-scrollbar-thumb{background-color:#FFA6C9;-webkit-box-shadow: inset 0 0 12px #888;border-radius:6px;}

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

@font-face { font-family: "lovenote"; src: url('http://static.tumblr.com/4yxykdm/k6plrfhwf/ck_love_note.ttf'); }

@font-face { font-family:"champagne"; src:url('http://static.tumblr.com/xekbux7/zVim6yitc/champagne___limousines.ttf'); }

@font-face { font-family: "lainie"; src: url('http://static.tumblr.com/oetadgc/Uialyjfaa/laine.ttf'); }

@font-face{font-family:'Basic';src:url('http://static.tumblr.com/9wzbixa/Cf3mj2g0f/basicl.ttf');}

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


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

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:"Calibri";
font-size:10px;
line-height:11px;
color:{color:Text};
text-transform:none;
}

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;
transition: color 0.4s ease-out;
}

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

div#posts {
float:left;
width:880px;
z-index:99;
margin-top:40px;
margin-left:380px;
}

.entry {
float:left;
margin:6px;
padding:6px;
overflow:hidden;
background-color:{color:Posts BG};
border:4px double {color:Posts Border};
{block:IndexPage}
width:250px;
{/block:IndexPage}
{block:PermalinkPage}
width:500px;
margin-left:0px;
{/block:PermalinkPage}
}

.entry:hover #permalink{
opacity:1.0;
bottom:0px
-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;
}

#permalink{
position:absolute;
background:{color:Permalink BG};
border-top:2px solid {color:Permalink Border};
width:250px;
height:20px;
bottom:0px;
left:0px;
padding:6px;
opacity:0.0;
font-family:'tinytots';
font-size:8px;
line-height:10px;
text-align:center;
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;
}

#info{
color:{color:Permalink Text};
font-family:'tinytots';
font-size:8px;
text-align:right;
line-height:15px;
margin-top:1px;
border-top:1px solid {color:Permalink Border};
text-transform:uppercase;
}

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

.title{
font-family:'champagne';
text-transform:uppercase;
text-decoration:none;
font-size:20px;
line-height:20px;
color:{color:Title};
text-align:center;
}

.title a{text-decoration:none;}

.quote{
font-family:'Arial';
font-size:10px;
text-transform:uppercase;
line-height:15px;
text-align:right;
color:{color:Quote};
}

asker{
font-family:'Basic';
font-size:15px;
text-transform:none;
color:{color:Asker Text};
line-height:20px;
}

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

.askerimg img{
width:40px;
align:left;
float:left;
padding:1px;
background:{color:Asker Image BG};
margin-right:6px;
box-shadow:0px 1px 1px #888;
}

#askbox{
overflow:auto;
padding:4px;
border-bottom:1px dotted {color:Ask Border};
}

#DoNotRemove a{
position:fixed;
opacity:1;
right:10px;
width:30px;
height:7px;
bottom:20px;
color:grey;
z-index:999999;
font-size:10px;
overflow:hidden;
background:white;
text-align:center;
border-radius:4px;
letter-spacing:0px;
font-family:'Calibri';
border:3px double #ccc;
padding:1px 4px 5px 1px;
-webkit-transition: all 0.4s linear;
-moz-transition: all 0.4s linear;
transition: all 0.4s linear;
}

#DoNotRemove a:hover{
background:white;
width:100px;
border-radius:5px;
font-style:italic;
text-shadow:none;
-webkit-transition: all 0.4s linear;
-moz-transition: all 0.4s linear;
transition: all 0.4s linear;
}

blockquote{
padding:0px 0px 2px 5px;
margin:0px 0px 2px 10px;
border-left: 7px solid #999999;
}


ul, ol, li{list-style:circle; margin:5px; margin-left:10px; padding-left:3px;}
.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:text};}

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


#quotebar{
position:fixed;
width:100%;
height:30px;
top:0px;
left:0px;
background:{color:Quotebar BG};
text-transform:none;
text-decoration:none;
font-size:30px;
line-height:30px;
color:{color:Quotebar Text};
z-index:99999999;
font-family:'lainie';
text-align:center;
border-bottom:6px solid {color:Quotebar Border};
box-shadow:0px 1px 3px #555;
}

#blogtitle{
position:fixed;
left:20px;
top:60px;
color:{color:Blogtitle};
font-size:50px;
z-index:999;
text-align:center;
font-family:'lovenote';
text-transform:none;
text-shadow:0px 1px 3px #666;
}

#sidebarpic{
position:fixed;
left:50px;
top:90px;
width:260px;
height:260px;
z-index:99;
padding:6px;
background:{color:Sidepic BG};
box-shadow:0px 1px 4px #888;
-webkit-transition: opacity 1s linear;
-webkit-transition: all 1s ease-in-out;
-moz-transition: all 1s ease-in-out;
-o-transition: all 1s ease-in-out;
}

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

#sidebarpic:hover #des{
opacity:1;
bottom:0px;
-webkit-transition: opacity 1s linear;
-webkit-transition: all 1s ease-in-out;
-moz-transition: all 1s ease-in-out;
-o-transition: all 1s ease-in-out;
}

#des{
position:absolute;
left:0px;
z-index:9;
bottom:20px;
opacity:0;
width:260px;
height:260px;
padding:6px;
font-size:10px;
overflow:hidden;
line-height:12px;
text-align:center;
font-style:italic;
text-transform:none;
background:{color:Description BG};
-webkit-transition: opacity 1s linear;
-webkit-transition: all 1s ease-in-out;
-moz-transition: all 1s ease-in-out;
-o-transition: all 1s ease-in-out;
}

#name{
font-family:"lovenote";
color:{color:Heading Text};
font-size:30px;
line-height:20px;
text-align:center;
text-transform:none;
}

#lace{
background-image:url('http://static.tumblr.com/3yblkz0/S8omdno3x/jaja.png');
repeat:repeat-x;
left:0px;
width:100%;
bottom:0px;
height:18px;
position:fixed;
-webkit-transform: rotate(180deg);
}

#linksbox{
position:fixed;
width:370px;
height:4px;
left:23px;
top:370px;
}

.links a{
float:left;
width: 30px;
height:30px;
padding:6px;
margin-top:0px;
overflow:hidden;
margin-right:25px;
display:inline-block;
background:{color:Navigation BG};
border:2px solid {color:Navigation Border};
color:{color:Navigation Text};
font-size:10px;
line-height:27px;
text-align:center;
font-family:'calibri';
text-transform:uppercase;
box-shadow:0px 1px 3px #999;
}

{CustomCSS}
</style>
<body>

<div id="quotebar">"{text:Quote}"</div>

<div id="blogtitle">{title}</div>

<div id="sidebarpic">
<div id="des">
<div id="name">{text:Heading 1}</div>
{Description}
<br>
<div id="name">{text:Heading 2}</div>
{text:Stats 1}&nbsp;&hearts;&nbsp;{text:Stats 2}
</div>
<img src="{image:Sidebar}">
</div>

<div id="linksbox">
<div class="links">
<a href="{text:Link 1 URL}">{text:Link 1}</a>
<a href="{text:Link 2 URL}">{text:Link 2}</a>
<a href="{text:Link 3 URL}">{text:Link 3}</a>
<a href="{text:Link 4 URL}">{text:Link 4}</a>
<a href="{text:Link 5 URL}">{text:Link 5}</a>
</div>
</div>

<img style="position:fixed;width:400px;left:10px;top:420px;opacity:0.5;" src="http://static.tumblr.com/gdh5wux/4Ghn0g5wx/png134.png">




<div id="lace"></div>
<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="info">
<a href="{Permalink}"><a href="{permalink}">{NoteCountWithLabel}</a> . <a href="{ReblogURL}" target="_blank"> reblog</a> . {timeago}
</div>
{/block:Text}

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

{block:Photo}
{block:IndexPage}
<div id="permalink">
posted {timeago} / {dayofweek}, {shortmonth} {dayofmonth}{dayofmonthsuffix}
<br>
<a href="{Permalink}"><a href="{permalink}">{NoteCountWithLabel}</a> / <a href="{ReblogURL}" target="_blank">Share This Post</a>&nbsp;
</div>
{LinkOpenTag}
<div class="photo"><a href="{permalink}">
<img 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="500"/></a>
{LinkCloseTag}
{/block:PermalinkPage}
{/block:Photo}

{block:Photoset}
{block:IndexPage}
<div id="permalink">
posted {timeago} / {dayofweek}, {shortmonth} {dayofmonth}{dayofmonthsuffix}
<br>
<a href="{Permalink}"><a href="{permalink}">{NoteCountWithLabel}</a> / <a href="{ReblogURL}" target="_blank">Share This Post</a>&nbsp;
</div>
<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="info">
<a href="{Permalink}"><a href="{permalink}">{NoteCountWithLabel}</a> . <a href="{ReblogURL}" target="_blank"> reblog</a> . {timeago}
</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="info">
<a href="{Permalink}"><a href="{permalink}">{NoteCountWithLabel}</a> . <a href="{ReblogURL}" target="_blank"> reblog</a> . {timeago}
</div>
{/block:Chat}

{block:Audio}
<center>
{AudioPlayerWhite}
</center>
<div id="info">
<a href="{Permalink}"><a href="{permalink}">{NoteCountWithLabel}</a> . <a href="{ReblogURL}" target="_blank"> reblog</a> . {timeago}
</div>
{/block:Audio}

{block:Video}
{block:IndexPage}
<center>
{Video-500}
</center>
<div id="info">
<a href="{Permalink}"><a href="{permalink}">{NoteCountWithLabel}</a> . <a href="{ReblogURL}" target="_blank"> reblog</a> . {timeago}
</div>
{/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>
<div id="ask">{Question}</div>
</div>
{Answer}
<div id="info">
<a href="{Permalink}"><a href="{permalink}">{NoteCountWithLabel}</a> . <a href="{ReblogURL}" target="_blank"> reblog</a> . {timeago}
</div>
{/block:Answer}

{block:PermalinkPage}
<center>
<br>

{block:Caption}
{Caption}
{/block:Caption}

{block:ContentSource}
<a href="{SourceURL}"> </a>
{block:ContentSource}

{block:RebloggedFrom}
<a href="{ReblogParentURL}"> </a>
<a href="{ReblogRootURL}"> </a>
{/block:RebloggedFrom}

{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}
{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}
{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}
</div>
</body>
<div id="DoNotRemove"><a href="http://vanillabeaux.co.vu/">Theme By Vanilla-Beaux</a></div>
</html>