Create a new version of paste:

<!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" class="no-js">

<!--THEME 01 Sparks Fly (Revamp) by hermionegrangcr (hermionejean.co.vu)
 
THEME BLOG: grangersdesigns (granger.cf)
 
 
          ♛       ♛       ♛                                
        ♛♛♛    ♛♛♛   ♛♛♛                      
         ♛ ♛ ♛ ♛ ♛ ♛ ♛ ♛              
         ♛♛♛  ♥ G♚D ♥ ♛♛♛  
         ♛ ♛ ♛ ♛ ♛ ♛ ♛ ♛                            
          ♛ ♛ ♛ ♛ ♛ ♛ ♛      © hermionegrangcr (hermionejean.co.vu)      
 
                           
                        TERMS OF USE:
 
♚ BASIC RULES (see http://hermionejean.co.vu/rules) APPLY
 
♚ PLEASE RESPECT THEM IF USING! ANY FORMS OF THEFTS WILL BE HUNTED DOWN.
 
♚ PLEASE DO NOT ALTER OR COVER THE CREDIT

♚ FAILURE TO ABIDE TO THE RULES WILL LEAD TO AN IMMEDIATE BLOCK & REPORT & A PERMANENT PLACE ON HTTP://HERMIONEJEAN.CO.VU/WOS  
 
THAT'S IT! ENJOY USING MY CODE AND DON'T BE AFRAID TO ASK ME IF YOU ENCOUNTER ANY PROBLEMS c:
 
-->
    
    <head>
<title>{Title}</title> 

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta name="keywords" content=""/>
<link rel="shortcut icon" href="{Favicon}"/>
<link rel="alternate" type="application/rss+xml" href="{RSS}" />

<link href='http://fonts.googleapis.com/css?family=Lato:100,300,400,700' rel='stylesheet' type='text/css'>
 <link href='http://fonts.googleapis.com/css?family=Raleway:400,800,300' rel='stylesheet' type='text/css'>
 
 {block:Description}
<meta name="description" content="{MetaDescription}"/>
{/block:Description}

<meta name="if:400px" content="0">
<meta name="if:show likes" content="0">
<meta name="if:transparent permalink" content="1">
<meta name="if:caption" content="1">
<meta name="if:gradient lightbox" content="1">
<meta name="if:update tabs" content="1">

<meta name="image:sidebar" content="http://static.tumblr.com/048d750c85c78fabef2568f232dd64df/xbvpdcx/FyVniqi34/tumblr_static_a63s16mbywgss4wc4s8ss044k.jpg">
<meta name="image:blogger" content="http://tympanus.net/Development/HoverEffectIdeas/img/15.jpg">


<meta name="color:lightbox" content="#fff">
<meta name="color:grad1" content="#fefefe">
<meta name="color:grad2" content="#ababab">
<meta name="color:links" content="#bcbcbc">
<meta name="color:hover" content="#fafafa">
<meta name="color:tags" content="#cdcdcd">
<meta name="color:blockquote" content="#fafafa">


<meta name="color:accent1" content="#000">
<meta name="color:accent2" content="#fff">

<meta name="text:nom" content="Name">
<meta name="text:info" content="Age, MBTI, etc">
<meta name="text:bio" content="optional; write more about yourself">

<meta name="text:Link1" content="Link1">
<meta name="text:link1 URL" content="/">
<meta name="text:Link2" content="Link2">
<meta name="text:link2 URL" content="/">
<meta name="text:Link3" content="Link3">
<meta name="text:link3 URL" content="/">
<meta name="text:Link4" content="Link4">
<meta name="text:link4 URL" content="/">
<meta name="text:Link5" content="Link5">
<meta name="text:link5 URL" content="/">
<meta name="text:Link6" content="Link6">
<meta name="text:link6 URL" content="/">
<meta name="text:Link7" content="Link7">
<meta name="text:link7 URL" content="/">
<meta name="text:Link8" content="Link8">
<meta name="text:link8 URL" content="/">
<meta name="text:Link9" content="Link9">
<meta name="text:link9 URL" content="/">

<meta name="text:Link10" content="Extra Link">
<meta name="text:link10 URL" content="/">


<meta name="text:updates" content="Updates here">
<meta name="text:reading" content="books">
<meta name="text:watching" content="movies">
<meta name="text:listening" content="music">
<meta name="text:working on" content="stuff">


<script src="http://tympanus.net/Development/CreativeLinkEffects/js/modernizr.custom.js"></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>
 
<!--Tooltip-->
 
<script>
 
(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>

<!--sidebar on scroll script-->
<script>
$(window).scroll(function() {
var scrollTopVal = $(this).scrollTop();
if ( scrollTopVal > 200 ) {
$('#sidebar').css({'opacity':'1'});

} else {
$('#sidebar').css({'opacity':'0'});
}
});
</script>

<script>
$(window).scroll(function() {
var scrollTopVal = $(this).scrollTop();
if ( scrollTopVal > 200 ) {
$('#sidebar2').css({'opacity':'1'});

} else {
$('#sidebar2').css({'opacity':'0'});
}
});
</script>

<script>
$(document).ready(function() {
//
$('a.poplight[href^=#]').click(function() {
var popID = $(this).attr('rel'); //Get Popup Name
var popURL = $(this).attr('href'); //Get Popup href to define size
var query= popURL.split('?');
var dim= query[1].split('&');
var popWidth = dim[0].split('=')[1]; //Gets the first query string value
$('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"></a>');
var popMargTop = ($('#' + popID).height() + 80) / 2;
var popMargLeft = ($('#' + popID).width() + 80) / 2;
//Apply Margin to Popup
$('#' + popID).css({
'margin-top' : -popMargTop,
'margin-left' : -popMargLeft
});
$('body').append('<div id="fade"></div>');
$('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'})
return false;
});
$('a.close, #fade').live('click', function() {
$('#fade , .popup_block').fadeOut(function() {
$('#fade, a.close').remove(); //fade them both out
});
return false;
});
});
</script>
        
<style type="text/css">

::selection {background:#fff; color:#000000;}
::-moz-selection {background:#fff;color:#000000;}
::-webkit-selection {background:#fff;color:#000000;}
    
    
::-webkit-scrollbar {width: 5px; height: 3px; background: #FFFFFF; }

::-webkit-scrollbar-thumb { background-color: {color:accent1}; }

/*Tooltip*/
#s-m-t-tooltip{
    position:absolute;
    margin-top: 10px;
    z-index:9999999999;
    padding:5px;
    color:#fff;
    background: {color:accent1};
    font-size:12px;

}

/*Basics*/

body {
    font-family:'Lato',Arial, sans-serif;
    font-weight:400;
    font-size:12px;
    line-height:140%;
    letter-spacing:1.5px;
    margin:0;

}

a {
    text-decoration: none;
    color: {color:links};
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;    
}

a:hover {
    color: {color:hover};
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
   
}

b, strong {
    font-weight:700;
}

strike {
    text-decoration: line-through;
}

em, i {
    text-decoration:italic;
}
u {
    text-decoration:underline;
}

pre { 
white-space: pre-wrap;
white-space: -moz-pre-wrap;
white-space: -pre-wrap;
white-space: -o-pre-wrap;
word-wrap: break-word;
}

blockquote { 
 border-left: 1px {color:blockquote} solid; 
 padding-left: 20px;
 margin-left: 15px; 
 max-width: 100%;
    
}

blockquote blockquote {
 padding: 0 0 0 20px;
 margin: 0 0 0 15px; 
    
}

blockquote ul {
    padding-left:0;
}

blockquote li {
    list-style:none;
    padding:5px;
}

li {
    padding:3px;
}

/*Important*/

iframe, img:not(.lightbox-image), embed, object, video, pre, li, blockquote {
    max-width: 100% !important;
}

#container {
    top:30px;
    margin:0 auto;
{block:ifnot400px}    
    width:1000px;
{/block:ifnot400px}  

{block:if400px} 
    width:900px;
{/block:if400px} 

    height:100%;
    position: relative;
  
}


/*Sidebar*/

#sb1 {
    height:100%;
    width:200px;
    position:fixed;
    border-right:1px solid {color:blockquote};
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;    
}

#sb2 {
    height:100%;
    width:200px;
    {block:ifnot400px} 
    margin-left:800px;
    {/block:ifnot400px} 
    
    {block:if400px} 
    margin-left:700px;
    {/block:if400px}
    position:fixed;
    border-left:1px solid {color:blockquote};
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out; 
    display:flex;
    display:-webkit-flex;
    display:-moz-flex;
    display:-ms-flex;
    align-items:center;
    -webkit-align-itens:center;
    -moz-align-items:center;
    -ms-align-items:center;
    justify-content:center;
    -webkit-justify-content:center;
    -moz-justify-content:center;
    -ms-justify-content:center; 
     display: -webkit-box;
    -webkit-box-align: center;
    -webkit-box-pack: center;   
}

@media screen and (max-width: 900px) {
	#container {
    {block:ifnot400px} 
    width:600px;
    {/block:ifnot400px} 
    
    {block:if400px} 
    width:500px;
    {/block:if400px}
	    
	}
	
	#sb1, #sb2 {display:none;}
	
	
}

/*Left Sidebar*/

#sidebar {
    text-align:center;
    position:relative;
    width: 200px;
    opacity:0;
    top:25%;
    transition: all .5s ease-in-out;
    -webkit-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    -ms-transition: all .5s ease-in-out;
}

.lside {
    width:180px;
    position:relative;
    top:0;
    left:0;
    margin:0;
    padding:0;
    transition: all .5s ease-in-out;
    -webkit-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    -ms-transition: all .5s ease-in-out;    
}

.lside img {
    height:auto;
    border-radius:100%;
    -moz-border-radius:100%;
    -webkit-border-radius:100%;
    border: 3px solid {color:accent1};
}

.circle {

    z-index:100;
    width:186px;
    opacity:0;
    top:0;
    position:absolute;
    left:0;
    margin:0;
    padding:0;
    transition: all .5s ease-in-out;
    -webkit-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    -ms-transition: all .5s ease-in-out;
    
    
}

#sidebar:hover .circle {
    opacity:1;
    transition: all .5s ease-in-out;
    -webkit-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    -ms-transition: all .5s ease-in-out;
}

@media screen and (max-width: 1080px) {
 
 
 #sidebar {
     width:170px;
     left:20px;
        transition: all .5s ease-in-out;
    -webkit-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    -ms-transition: all .5s ease-in-out;     
 }   
    .lside {
        width:150px;
        transition: all .5s ease-in-out;
    -webkit-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    -ms-transition: all .5s ease-in-out;    
    }
    
    .circle {
        width:156px;
        transition: all .5s ease-in-out;
    -webkit-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    -ms-transition: all .5s ease-in-out;    
    }
}

/*Right Sidebar*/

#sidebar2 {
    width: 200px;
    text-align:center;
    opacity:0;
    margin-left:15px;
    transition: all .5s ease-in-out;
    -webkit-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    -ms-transition: all .5s ease-in-out;
    padding:0;
}

#sidebar2 > h2 {
    color: {color:accent1};
    font-weight:300;
    text-align:center;
    text-transform:uppercase;
    font-family:'Raleway',Arial, sans-serif;
}

#sidebar2 > a {
    width:100%;
    padding:8px;
    letter-spacing:2px;
    color:#000;
    background:#fafafa;
    margin:10px auto;
    display:block;
    text-align:center;
    font-weight:normal;
    text-transform:uppercase; 
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;    

}

#sidebar2 > a:hover {
    background:#000;
    color:#fff;
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;     
}

 
/*Likes*/
#likes_container {
   margin:10px auto 15px auto;
   padding:5px;
   width:100%;
   font-size:90%;
   max-height:50vh;
   overflow:auto;
   position:relative;
   text-align:left;
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;    
   
}

#likes_container::-webkit-scrollbar {display:none; }

#likes_container::-webkit-scrollbar-thumb { display:none; }


#likes_container ul {
    list-style:none;
    padding:0;
}

#likes_container li {
    padding:10px 0 10px 0;
    min-height:25px;
}

li.like_post {
    width:100% !important;
    position:relative;
}

li.like_post p {
    display:none !important;
}

li.like_post blockquote {
margin: 0;
padding: 0 0 0 10px;
border-left: 1px solid {color:blockquote};
}

.like_title {
    text-align:center;
    text-transform:uppercase !important;
    font-size:12px !important;
    line-height:160%;
    letter-spacing:1.5px;
}


li.like_post *, li.like_post *:after, li.like_post *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }


li.like_post .post_info_bottom {

text-align:center;
position:absolute;
top:0;
left:0;
height:100%;
width:100%;
opacity:0;
z-index:10;
background:#fff;
padding-top:20px;
display: block !important;
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}


li.like_post:hover .post_info_bottom {
    opacity:0.8;
        transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}

li.like_post .post_info_bottom a{

font-weight:bold;
text-transform:uppercase;
color:{color:accent1};
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    
}

li.like_post .post_info_bottom a:hover {
    color:{color:hover};
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;    
}

@media screen and (max-width: 1080px) {

#sidebar2 {
   width:150px;
   margin-left:-10px;
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;    
}

.like_title {

    font-size:10px !important;

}


li.like_post .post_info_bottom {
    padding-top:10px;
}

li.like_post .post_info_bottom a {
    text-transform:none;
}
    
}


/*header*/

#header {
    {block:ifnot400px} 
    width:600px;
    {/block:ifnot400px} 
    
    {block:if400px} 
    width:500px;
    {/block:if400px}
    
    margin:0 auto;
    padding-top:10px;
    padding-bottom:5px;
    position:static;
    width:100%;
    text-align: center;
    border-bottom: 1px solid {color:blockquote};
 
}

/*Title*/

.link {
	outline: none;
	text-decoration: none;
	position: relative;
	font-size: 3em;
	line-height: 1;
	color: {color:accent1};
	display: inline-block;
}

.siriusblack {
    
	font-weight:800;
	color: {color:accent1};
	text-transform:uppercase;
	-webkit-transition: color 0.5s 0.25s;
	transition: color 0.5s 0.25s;
	overflow: hidden;
}

.siriusblack:hover {
	-webkit-transition: none;
	transition: none;
	color: transparent;
}

.siriusblack::before {
	content: '';
	width: 100%;
	height: 6px;
	margin: -3px 0 0 0;
	background: {color:hover};
	position: absolute;
	left: 0;
	top: 50%;
	-webkit-transform: translate3d(-100%,0,0);
	transform: translate3d(-100%,0,0);
	-webkit-transition: -webkit-transform 0.4s;
	transition: transform 0.4s;
	-webkit-transition-timing-function: cubic-bezier(0.7,0,0.3,1);
	transition-timing-function: cubic-bezier(0.7,0,0.3,1);
}

.siriusblack:hover::before {
	-webkit-transform: translate3d(100%,0,0);
	transform: translate3d(100%,0,0);
}

.siriusblack span {
	position: absolute;
	height: 50%;
	width: 100%;
	left: 0;
	top: 0;
	overflow: hidden;
}

.siriusblack span::before {
	content: attr(data-letters);
	color: {color:accent1};
	position: absolute;
	left: 0;
	width: 100%;
	color: {color:hover};
	-webkit-transition: -webkit-transform 0.5s;
	transition: transform 0.5s;
}

.siriusblack span:nth-child(2) {
	top: 50%;
}

.siriusblack span:first-child::before {
	top: 0;
	-webkit-transform: translate3d(0,100%,0);
	transform: translate3d(0,100%,0);
}

.siriusblack span:nth-child(2)::before {
	bottom: 0;
	-webkit-transform: translate3d(0,-100%,0);
	transform: translate3d(0,-100%,0);
}

.siriusblack:hover span::before {
	-webkit-transition-delay: 0.3s;
	transition-delay: 0.3s;
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
	-webkit-transition-timing-function: cubic-bezier(0.2,1,0.3,1);
	transition-timing-function: cubic-bezier(0.2,1,0.3,1);
}

/*header links*/

nav *,
nav *:after,
nav *::before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

nav a {
	position: relative;
	display: inline-block;
	margin: 15px auto 15px auto;
	outline: none;
	color: {color:accent1};
	text-decoration: none;
	text-transform: uppercase;
	letter-spacing: 1.5px;
	font-weight: 400;
	text-shadow: 0 0 1px rgba(255,255,255,0.3);
	font-size: 1.2em;
}

nav a:hover,
nav a:focus {
	outline: none;
}

.prongs {
    margin-top:20px;
}

.prongs a {
    
    font-size:1.2em;
    text-align:center;
	line-height: 1em;
	height:1em;
	-webkit-perspective: 800px;
	-moz-perspective: 800px;
	perspective: 800px;
	letter-spacing:1px;
	
}

.prongs a span {
    
    height:1em;
    text-align:center;
	position: relative;
	display: inline-block;
	padding: 3px 15px 0;
	background: #fff;
	box-shadow: inset 0 3px #fff;
	-webkit-transition: background 0.6s;
	-moz-transition: background 0.6s;
	transition: background 0.6s;
	-webkit-transform-origin: 50% 0;
	-moz-transform-origin: 50% 0;
	transform-origin: 50% 0;
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-transform-origin: 0% 50%;
	-moz-transform-origin: 0% 50%;
	transform-origin: 0% 50%;

}

.prongs a span::before {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	padding: 3px 15px 0;
	background: #fff;
	color: {color:accent1};
	content: attr(data-hover);
	-webkit-transform: rotateX(270deg);
	-moz-transform: rotateX(270deg);
	transform: rotateX(270deg);
	-webkit-transition: -webkit-transform 0.6s;
	-moz-transition: -moz-transform 0.6s;
	transition: transform 0.6s;
	-webkit-transform-origin: 0 0;
	-moz-transform-origin: 0 0;
	transform-origin: 0 0;
	pointer-events: none;

}

.prongs a:hover span,
.prongs a:focus span {
	background: #fff;
}

.prongs a:hover span::before,
.prongs a:focus span::before {
	-webkit-transform: rotateX(10deg);	
	-moz-transform: rotateX(10deg);
	transform: rotateX(10deg);
}

/*Pop-Ups*/


.popup_block{
    display:none;
    padding:20px;
    float:left;
    position:fixed;
    top:50%;
    left:51.5%;
    z-index: 99999;
    background:transparent;
    text-align:center;
   
}

@media screen and (max-width: 1100px) {

.popup_block {
    left:52%;
    top:53%;
 
}
	
	
}

.popup_block h1 {
    
    color:{color:accent2};
    padding:5px 0 5px 0;
    width:100%;
    white-space:nowrap;
    text-overflow:ellipsis;
    overflow:hidden;
    font-family:'Raleway',Arial,Sans-serif;
    font-weight:300;
    text-transform:uppercase;
}
 
 
*html #fade {position: absolute;}
*html .popup_block {position: absolute;}
#fade {
    display:none;
    position:fixed;
    left:0px;
    top:0px;
    width:100%;
    height:100%;
    z-index:19999;
    {block:ifnotgradientlightbox}
    background:rgba({RGBcolor:lightbox}, 0.9);
    {/block:ifnotgradientlightbox}  
    
    {block:ifgradientlightbox}
  background: -webkit-linear-gradient(90deg, rgba({RGBcolor:grad1},0.9) 10%, rgba({RGBcolor:grad2},0.8) 90%)!important; /* Chrome 10+, Saf5.1+ */
  background:    -moz-linear-gradient(90deg, rgba({RGBcolor:grad1},0.9) 10%, rgba({RGBcolor:grad2},0.8) 90%)!important; /* FF3.6+ */
  background:     -ms-linear-gradient(90deg, rgba({RGBcolor:grad1},0.9) 10%, rgba({RGBcolor:grad2},0.8) 90%)!important; /* IE10 */
  background:      -o-linear-gradient(90deg, rgba({RGBcolor:grad1},0.9) 10%, rgba({RGBcolor:grad2},0.8) 90%)!important; /* Opera 11.10+ */
  background:         linear-gradient(90deg, rgba({RGBcolor:grad1},0.9) 10%, rgba({RGBcolor:grad2},0.8) 90%)!important; /* W3C */     
    {/block:ifgradientlightbox}
    opacity:1; /* change to opacity:1; */
}

/*info*/
figure *,figure *:after,figure *:before { -webkit-box-sizing: border-box; box-sizing: border-box; }

.grid {
	position: relative;
	margin: 0 auto;
	padding: 0;
	max-width: 450px;
	list-style: none;
	text-align: center;
}

/* Common style */
.grid figure {
	position: relative;
	overflow: hidden;
	margin: 10px auto;
    width:400px;
    height:350px;
	background: #000;
	text-align: center;

}

.grid figure img {
	position: relative;
	display: block;
	min-height: 100%;
	max-width: 100%;
	opacity: 0.95;
}

.grid figure figcaption {
	padding: 2em;
	color: #fff;
	text-transform: uppercase;
	font-size: 1.25em;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

.grid figure figcaption::before,
.grid figure figcaption::after {
	pointer-events: none;
}

.grid figure figcaption {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}


.grid figure h2 {
    font-size: 1.2em;
	word-spacing: -0.15em;
	font-weight: 300;
}

.grid figure h2 span {
	font-weight: 800;
}

.grid figure h2,
.grid figure p {
	margin: 0;
}

.grid figure p {
	letter-spacing: 1px;
	font-size: 80%;
	text-transform:none;
}

.grid figure a {
    color:{color:links};
}

.grid figure a:hover {
    text-decoration: line-through;
}

figure.anto img {
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
	-webkit-transform: scale(1.12);
	transform: scale(1.12);
}

figure.anto:hover img {
	opacity: 0.4;
	-webkit-transform: scale(1);
	transform: scale(1);
}

figure.anto figcaption {
	padding: 3em;
}

figure.anto figcaption::before {
	position: absolute;
	top: 30px;
	right: 30px;
	bottom: 30px;
	left: 30px;
	border: 1px solid #fff;
	content: '';
	-webkit-transform: scale(1.1);
	transform: scale(1.1);
}

figure.anto figcaption::before,
figure.anto p, figure.anto h2 {
	opacity: 0;
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
}

figure.anto h2 {
	padding: 20px 0 20px 0;
}

figure.anto p {
	margin: 0 auto 1.2em auto;
	max-width: 350px;
	-webkit-transform: scale(1.5);
	transform: scale(1.5);
}

figure.anto:hover figcaption::before,
figure.anto:hover p, figure.anto:hover h2 {
	opacity: 1;
	-webkit-transform: scale(1);
	transform: scale(1);
}

/*navi*/

.popup_block nav a {
	position: relative;
	display: inline-block;
	margin: 10px;
	outline: none;
	color: #fff;
	text-decoration: none;
	text-transform: uppercase;
	letter-spacing: 1px;
	font-weight: 400;
	text-shadow: 0 0 1px rgba(255,255,255,0.3);
	font-size: 1.35em;
}

.popup_block nav a:hover,
.popup_block nav a:focus {
	outline: none;
}

.iniesta {
    margin:30px auto;
    letter-spacing:2px;
}

.iniesta a {
	line-height: 2.8em;
	margin: 15px;
	-webkit-perspective: 800px;
	-moz-perspective: 800px;
	perspective: 800px;
	width: 200px;
    text-align:center;
    white-space: nowrap;
    overflow:hidden;
    text-overflow: ellipsis;	
}

.iniesta a:empty {
    visibility:hidden;
}

.iniesta a span {
	position: relative;
	display: inline-block;
	width: 100%;
	padding: 0 14px;
	background: {color:accent1};
	-webkit-transition: -webkit-transform 0.4s, background 0.4s;
	-moz-transition: -moz-transform 0.4s, background 0.4s;
	transition: transform 0.4s, background 0.4s;
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-transform-origin: 50% 50% -100px;
	-moz-transform-origin: 50% 50% -100px;
	transform-origin: 50% 50% -100px;
}

.csstransforms3d .iniesta a span::before {
	position: absolute;
	top: 0;
	left: 100%;
	width: 100%;
	height: 100%;
    text-align:center;
    white-space: nowrap;
    overflow:hidden;
    text-overflow: ellipsis;    
    visibility:visible;	
	background: {color:grad2};
	content: attr(data-hover);
	-webkit-transition: background 0.4s;
	-moz-transition: background 0.4s;
	transition: background 0.4s;
	-webkit-transform: rotateY(90deg);
	-moz-transform: rotateY(90deg);
	transform: rotateY(90deg);
	-webkit-transform-origin: 0 50%;
	-moz-transform-origin: 0 50%;
	transform-origin: 0 50%;
	pointer-events: none;
}

.iniesta a:hover span,
.iniesta a:focus span {
	background: {color:grad1};
	-webkit-transform: rotateY(-90deg);
	-moz-transform: rotateY(-90deg);
	transform: rotateY(-90deg);
}

.csstransforms3d .iniesta a:hover span::before,
.csstransforms3d .iniesta a:focus span::before {
	background: {color:hover};	
}

/*updates*/

#updates {
    margin:20px auto;
    text-align:center;
    font-size:16px;
    line-height:160%;
    color:{color:accent2};
}

#updates p {
    padding:1em;
}

#tumblr_controls {
    z-index:999 !important;
}


/*posts*/

#entries {
    {block:ifnot400px} 
    width:600px;
    {/block:ifnot400px} 
    
    {block:if400px} 
    width:500px;
    {/block:if400px}
    
    margin:0 auto 50px auto;
    
}

.posts {
 
    {block:ifnot400px} 
    width:500px;
    {/block:ifnot400px} 
    
    {block:if400px} 
    width:400px;
    {/block:if400px}
    
    word-wrap: break-word;
    text-transform:none;
    font-size:12px;
    text-align:left;
    {block:ifnottransparentpermalink}
    margin:50px auto 0 auto;
    {/block:ifnottransparentpermalink}
    
    {block:iftransparentpermalink}

    margin:0px auto;

    {/block:iftransparentpermalink}
}

/*Tumblr embed image fix*/

.posts img {
    max-width:100%;
    height:auto;
}

{block:iftransparentpermalink}
section {
    
    {block:ifnot400px} 
    width:500px;
    {/block:ifnot400px} 
    
    {block:if400px} 
    width:400px;
    {/block:if400px}
    position:relative;
    margin:50px auto 30px auto;
    overflow:hidden;
}

section:hover .perma_hold {
    opacity:1;
    -webkit-transform: scale(1);
   -moz-transform: scale(1);
   -o-transform: scale(1);
   -ms-transform: scale(1);
   transform: scale(1);

}
.perma_hold {
    width:100%;
    height:100%;
    top:0px;
    left:0px;
    position:absolute;
    opacity:0;
    z-index:9999;
    background:rgba(255,255,255,0.9);
    transition:0.6s ease;
    -o-transition:0.6s ease;
    -moz-transition:0.6s ease;
    -webkit-transition:0.6s ease;
    -webkit-transform: scale(10);
   -moz-transform: scale(10);
   -o-transform: scale(10);
   -ms-transform: scale(10);
   transform: scale(10);

}
 
.perma {
    top:40%;
    position:relative;
    font-size:14px;
    text-align:center;
    text-transform:uppercase;
}

.perma_hold a {
    font-weight:bold;
    color: {color:accent1};

}

 
.info a{margin:0px 3px;}
.info {margin-top:10px;font-size:8px;letter-spacing:0.5px;}
.tags a{margin:0px 3px;}
.tags {
    
    font-weight:normal;
    font-family:'lato', arial, sans-serif;
    margin-top:10px;
    text-transform:none;
    font-size:10px;
    font-style:italic;
    white-space: nowrap; 
    overflow: hidden;
    text-overflow: ellipsis; 
}

{/block:iftransparentpermalink}


/*lightbox*/
{block:ifnotgradientlightbox}
#tumblr_lightbox, .tmblr-lightbox {background:rgba({RGBcolor:lightbox}, 0.9)!important;}
{/block:ifnotgradientlightbox}

{block:ifgradientlightbox}
#tumblr_lightbox, .tmblr-lightbox {
  background: -webkit-linear-gradient(90deg, rgba({RGBcolor:grad1},0.9) 10%, rgba({RGBcolor:grad2},0.8) 90%)!important; /* Chrome 10+, Saf5.1+ */
  background:    -moz-linear-gradient(90deg, rgba({RGBcolor:grad1},0.9) 10%, rgba({RGBcolor:grad2},0.8) 90%)!important; /* FF3.6+ */
  background:     -ms-linear-gradient(90deg, rgba({RGBcolor:grad1},0.9) 10%, rgba({RGBcolor:grad2},0.8) 90%)!important; /* IE10 */
  background:      -o-linear-gradient(90deg, rgba({RGBcolor:grad1},0.9) 10%, rgba({RGBcolor:grad2},0.8) 90%)!important; /* Opera 11.10+ */
  background:         linear-gradient(90deg, rgba({RGBcolor:grad1},0.9) 10%, rgba({RGBcolor:grad2},0.8) 90%)!important; /* W3C */    
    
}
{/block:ifgradientlightbox}
#tumblr_lightbox img, .tmblr-lightbox .vignette {
    opacity:0;
    border-radius:0!important;
    -moz-border-radius: 0!important;
    -webkit-border-radius: 0!important;
    -o-border-radius: 0!important;
    -webkit-box-shadow:none!important;
    box-shadow:none!important;
}
#tumblr_lightbox_center_image, #tumblr_lightbox_left_image, #tumblr_lightbox_right_image, .tmblr-lightbox .lightbox-image {
    opacity: 1!important;
    box-shadow: 0 0 0 transparent !important;
    border-radius: 0!important;
    -moz-border-radius: 0!important;
    -webkit-border-radius: 0!important;
    -o-border-radius: 0!important;
    padding: 10px!important;
    border: 1px solid #fff!important;
    background-color: #fff!important;
    
    
}

.tmblr-lightbox .lightbox-caption { visibility: hidden; }

/*t*/

.titre {
    text-align:center;
    font-weight:bold;
    font-size:1.5em;
    margin-bottom:15px;
    line-height:160%;
    text-transform:uppercase;
}

/*quotes*/

.quotes {
    font-weight:400;
    font-size:1.5em;
    text-transform:uppercase;
    display:inline;
    line-height:160%;
}

.speaker {
    margin-top:25px;
    text-align:right;
}

/*chat*/

.chats {
    line-height:22px;
    padding:5px;
}

.chats strong {
    font-family:'century gothic', arial, sans-serif;
}

/*links*/

.remus a {
	color: {color:accent1};
	text-shadow: 0 0 1px rgba(111,134,134,0.3);
	width:100%;
	text-align:center;
	font-size:2em;
	background:#fafafa;
	padding:15px;
	margin-top:0;
}

.remus a::before {
	color: {color:accent1};
	content: attr(data-hover);
	position: absolute;
	opacity: 0;
	text-shadow: 0 0 1px rgba(255,255,255,0.3);
	-webkit-transform: scale(1.1) translateX(10px) translateY(-10px) rotate(4deg);
	-moz-transform: scale(1.1) translateX(10px) translateY(-10px) rotate(4deg);
	transform: scale(1.1) translateX(10px) translateY(-10px) rotate(4deg);
	-webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
	-moz-transition: -moz-transform 0.3s, opacity 0.3s;
	transition: transform 0.3s, opacity 0.3s;
	pointer-events: none;
}

.remus a:hover::before,
.remus a:focus::before {
	-webkit-transform: scale(1) translateX(0px) translateY(0px) rotate(0deg);
	-moz-transform: scale(1) translateX(0px) translateY(0px) rotate(0deg);
	transform: scale(1) translateX(0px) translateY(0px) rotate(0deg);
	opacity: 1;
}

/*ask posts*/

.ask_cont {
    width:100%;
    padding:10px;
    display:flex;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    align-items: center;
    -webkit-align-items:center;
    -ms-align-items:center;
}

.questions a {
    
    font-size:16px;
    font-weight:700;
    color:{color:accent1};
    text-decoration:underline;
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}

.questions a:hover {
    color:{color:hover};
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}

.questions {
    
    left:15px;
    position:relative;
    text-align:left;
    {block:if400px}
    width:300px;
    {/block:if400px}
    {block:ifnot400px}
    width:400px;
    {/block:ifnot400px}
    color:#000;
    font-weight:normal;
    padding:10px 15px 20px 15px;
    background: transparent;
    word-wrap:break-word;
}


.asker img {
    border-radius:50px;
    -moz-border-radius: 50px;
    -webkit-border-radius: 50px;
    -o-border-radius: 50px;
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;

}

.asker img:hover {
    
    opacity:0.5;
    -moz-transform: rotate(360deg); /* IE 9 */
    -webkit-transform: rotate(360deg); /* Chrome, Safari, Opera */
    transform: rotate(360deg);
    
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}

/*audio posts*/

.flitwick {
    width:100%;
    display:flex;
    display:-webkit-flex;
    display:-moz-flex;
    display:-ms-flex;
    align-items:center;
    -webkit-align-itens:center;
    -moz-align-items:center;
    -ms-align-items:center;
     display: -webkit-box;
    -webkit-box-align: center;
    position:relative;
}

.grammy {
    width:100px;
    height:100px;
    position:relative;
    margin-left:0;
}


.mariah {
    position:absolute;
    background:#fff;
    z-index:10;
    opacity:0;
    margin-top:10px;
    margin-left:10px;
    width:80px;
    height:80px;
    text-align:center;
	transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;    
}

.mariah:hover {
    opacity:0.8;
	transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;    
}

.playbox {
    width:40px;
    height:40px;
    margin-top:25px;
    margin-left:20px;
    overflow:hidden;
}


.taylor {
    {block:if400px}
    width:300px;
    {/block:if400px}
    {block:ifnot400px}
    width:400px;
    {/block:ifnot400px}
    height:100px;
    padding:0;
    margin-left:0px;
    background:#fafafa;
    display:flex;
    display:-webkit-flex;
    display:-moz-flex;
    display:-ms-flex;
    align-items:center;
    -webkit-align-itens:center;
    -moz-align-items:center;
    -ms-align-items:center;
    justify-content:center;
    -webkit-justify-content:center;
    -moz-justify-content:center;
    -ms-justify-content:center;
     display: -webkit-box;
    -webkit-box-align: center;
    -webkit-box-pack: center;
}

.swift {
    {block:if400px}
    max-width:250px;
    {/block:if400px}
    {block:ifnot400px}
    max-width:350px;
    {/block:ifnot400px}
    color:#000;
    font-weight:normal;
}

.swift b {
    font-family:'raleway', arial,sans-serif;
    font-weight:bold;
    color:{color:accent1};
}

/*post info*/

.footer {
    position:relative;
    {block:if400px}
    width:400px;
    {/block:if400px}
    {block:ifnot400px}
    width: 500px;
    {/block:ifnot400px}
    margin:0 auto;
    padding:5px 0 5px 0;
    text-align:center;
}

.footer a {
    font-weight:bold;
    display:inline-block;
    padding:5px;
    margin-left:10px;
    color:{color:accent1};
    text-transform:uppercase;
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;    
}

.footer a:hover {
    color:{color:hover};
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;    
}

.tgs {
    text-align:center;
    {block:if400px}
    width:400px;
    {/block:if400px}
    {block:ifnot400px}
    width: 500px;
    {/block:ifnot400px}
    margin:5px auto;
    word-wrap: break-word;
    color:transparent;
    
}

.tgs a {
    font-weight:normal;
    display:inline-block;
    padding:5px;
    color:{color:tags};
    text-transform:none;
    font-style:italic;

}

/*notes*/
.notes {
    {block:ifnot400px}
    width:500px;
    {/block:ifnot400px}
    {block:if400px}
    width:400px;
    {/block:if400px}
    padding: 10px;
    text-align:left;
    margin-top:30px;
    margin-left:auto;
    margin-right:auto;
}
 
ol.notes {
                padding: 0px;
                margin: 20px 0px;
                list-style-type: none;
            }
 
ol.notes li.note {
                padding: 10px;
            }
 
ol.notes li.note img.avatar {
                vertical-align: -4px;
                margin-right: 10px;
                width: 16px;
                height: 16px;
            }
 
ol.notes li.note span.action {
                font-weight: normal;
            }
 
ol.notes li.note .answer_content {
                font-weight: normal;
            }
 
ol.notes li.note blockquote {
                border-color: {color:blockquote};
                padding: 4px 10px;
                margin: 10px 0px 0px 25px;
            }
           
ol.notes li.note blockquote a {
                text-decoration: none;
            }


/*pagination*/

.pg {
    position:fixed;
    bottom:0;
    font-size:16px;
    line-height:25px;
    height:25px;
    width:100%;
    z-index:10000;
    background:#fff;
    text-align:center;
    word-spacing:20px;
}

.pg a {
    display:inline-block
    margin-left:15px;
    color:{color:accent1};
} 

#tumblr_teaser_follow, .tmblr-iframe--follow-teaser {z-index:100000!important;}


/*PLEASE DO NOT ALTER OR COVER THE CREDIT, THANKS! C: */
#leo {

    font-family: Arial, Sans-Serif;
    text-transform:uppercase;
    text-align:center;
    z-index:99999;
    box-sizing:content-box;
    -webkit-box-sizing:content-box;
    
}

#leo a {
    z-index:99999;
    position:fixed;
    font-size:12px;
    line-height:16px;
    width:18px;
    height:18px;
    font-weight:300;
    bottom:10px;
    right:10px;
    color:#000;
    background:rgba(255,255,255,0.4);
    padding:5px;
    transition: all 1s ease-in-out;
    -webkit-transition: all 1s ease-in-out;
    -o-transition: all 1s ease-in-out;
    -moz-transition: all 1s ease-in-out;
    box-sizing:content-box;
    -webkit-box-sizing:content-box;
}

#leo a:hover {
    background-color:rgba(0,0,0,1);
    color:#fff;
    border-radius:50%;
   -webkit-animation: hermione 1s; /* Chrome, Safari, Opera */
   -moz-animation: hermione 1s;
   -o-animation: hermione 1s;
    animation: hermione 1s;
    animation-timing-function: ease-in-out;
    -webkit-animation-timing-function: ease-in-out;
    -moz-animation-timing-function: ease-in-out;
    -o-animation-timing-function: ease-in-out;
    
    -moz-transform: rotate(720deg); /* IE 9 */
    -webkit-transform: rotate(720deg); /* Chrome, Safari, Opera */
    transform: rotate(720deg);
    
    transition: all 1s ease-in-out;
    -webkit-transition: all 1s ease-in-out;
    -o-transition: all 1s ease-in-out;
    -moz-transition: all 1s ease-in-out;
    

}

@-webkit-keyframes hermione {
    0%   {color:#000;}
    25%  {color:#ACE4EA;}
    50%  {color:#FFFBDD;}
    75%  {color:#ACE4EA;}
    100% {color:#fff;}
}
@-moz-keyframes hermione {
    0%   {color:#000;}
    25%  {color:#ACE4EA;}
    50%  {color:#FFFBDD;}
    75%  {color:#ACE4EA;}
    100% {color:#fff;}
}
@-o-keyframes hermione {
    0%   {color:#000;}
    25%  {color:#ACE4EA;}
    50%  {color:#FFFBDD;}
    75%  {color:#ACE4EA;}
    100% {color:#fff;}
}

@keyframes hermione {
    0%   {color:#000;}
    25%  {color:#ACE4EA;}
    50%  {color:#FFFBDD;}
    75%  {color:#ACE4EA;}
    100% {color:#fff;}
}
/*END OF CREDIT*/
    
</style>        
    </head>
<body>


<div id="container">

    <div id="sb1">

<div id="sidebar">
    <div class="lside">
<img src="{image:sidebar}">        
    </div>
    
    <div class="circle">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="-2 -2 504 504" id="menu" style="transform-origin: 50% 50% 0px; transform: translate3d(0px, 0px, 0px); touch-action: none; -webkit-user-select: none;">
                    <style>
 #menu {
            display: block;
            margin: 0 auto;
            overflow: visible;
        }

        .item .sector {
            fill: #fff;
            stroke: #eee;
            stroke-width: 1;
        transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;        
        }

        .item:hover .sector {
            fill: #fafafa;
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;            
        }
        
        .item:focus, .item:active {
            outline:none;
        }

        .menu-trigger {
            fill: {color:accent1};
            pointer-events: auto;
        }

        .menu-trigger:hover {
            cursor: pointer;
        }
      use { fill: {color:accent1}; }
      .item:hover use { fill: #fff; }
</style>

<g id="symbolsContainer">    <symbol class="icon icon-" id="icon-1" viewBox="0 0 39 39"><path d="M2 6h28v6h-28zM2 14h28v6h-28zM2 22h28v6h-28z" fill="#000"></path></symbol>

    <symbol class="icon icon-" id="icon-2" viewBox="0 0 39 39"><!--Replace the contents of this symbol with the content of your icon--><path d="M32 19l-6-6v-9h-4v5l-6-6-16 16v1h4v10h10v-6h4v6h10v-10h4z" fill="#000"></path></symbol>

    <symbol class="icon icon-" id="icon-3" viewBox="0 0 39 39"><!--Replace the contents of this symbol with the content of your icon--><path d="M34 28.161c0 1.422 0.813 2.653 2 3.256v0.498c-0.332 0.045-0.671 0.070-1.016 0.070-2.125 0-4.042-0.892-5.398-2.321-0.819 0.218-1.688 0.336-2.587 0.336-4.971 0-9-3.582-9-8s4.029-8 9-8c4.971 0 9 3.582 9 8 0 1.73-0.618 3.331-1.667 4.64-0.213 0.463-0.333 0.979-0.333 1.522zM16 0c8.702 0 15.781 5.644 15.995 12.672-1.537-0.685-3.237-1.047-4.995-1.047-2.986 0-5.807 1.045-7.942 2.943-2.214 1.968-3.433 4.607-3.433 7.432 0 1.396 0.298 2.747 0.867 3.993-0.163 0.004-0.327 0.007-0.492 0.007-0.849 0-1.682-0.054-2.495-0.158-3.437 3.437-7.539 4.053-11.505 4.144v-0.841c2.142-1.049 4-2.961 4-5.145 0-0.305-0.024-0.604-0.068-0.897-3.619-2.383-5.932-6.024-5.932-10.103 0-7.18 7.163-13 16-13z" fill="#000"></path></symbol>

    <symbol class="icon icon-" id="icon-4" viewBox="0 0 39 39"><!--Replace the contents of this symbol with the content of your icon--><path d="M8 4v28l10-10 10 10v-28zM24 0h-20v28l2-2v-24h18z" fill="#000"></path></symbol>

    <symbol class="icon icon-" id="icon-5" viewBox="0 0 39 39"><!--Replace the contents of this symbol with the content of your icon--><path d="M28 0h-28v32h32v-28l-4-4zM16 4h4v8h-4v-8zM28 28h-24v-24h2v10h18v-10h2.343l1.657 1.657v22.343z" fill="#000"></path></symbol>

    <symbol class="icon icon-" id="icon-6" viewBox="0 0 39 39"><!--Replace the contents of this symbol with the content of your icon--><path d="M16 32c8.837 0 16-7.163 16-16s-7.163-16-16-16-16 7.163-16 16 7.163 16 16 16zM16 3c7.18 0 13 5.82 13 13s-5.82 13-13 13-13-5.82-13-13 5.82-13 13-13zM16 18.711c3.623 0 7.070-0.963 10-2.654-0.455 5.576-4.785 9.942-10 9.942s-9.544-4.371-10-9.947c2.93 1.691 6.377 2.658 10 2.658zM8 11c0-1.657 0.895-3 2-3s2 1.343 2 3c0 1.657-0.895 3-2 3s-2-1.343-2-3zM20 11c0-1.657 0.895-3 2-3s2 1.343 2 3c0 1.657-0.895 3-2 3s-2-1.343-2-3z" fill="#000"></path></symbol>

</g>
                    <g id="itemsContainer">        
<a class="item poplight" id="item-1" role="link" tabindex="0" href="#?w=700" rel="navi" xlink:title="Navi" xlink:target="_parent" transform="matrix(1,0,0,1,0,0)" data-svg-origin="250 250" style=""><path fill="none" stroke="#111" stroke-width="1" class="sector" d="M250,250 l250,0 A250,250 0 0,0 375,33.49364905389035 z"></path><use xlink:href="#icon-1" width="39" height="39" x="374.2602233886719" y="147.5" transform="rotate(60 393.7602233886719 167)"></use></a>

<a class="item" id="item-2" role="link" tabindex="0" xlink:href="/" xlink:title="Home" xlink:target="_parent" transform="matrix(0.5,-0.86602,0.86602,0.5,-91.5063509461097,341.5063509461096)" data-svg-origin="250 250" style=""><path fill="none" stroke="#111" stroke-width="1" class="sector" d="M250,250 l250,0 A250,250 0 0,0 375,33.49364905389035 z"></path><use xlink:href="#icon-2" width="39" height="39" x="374.2602233886719" y="147.5" transform="rotate(60 393.7602233886719 167)"></use></a>


<a class="item poplight" id="item-3" role="link" tabindex="0" href="#?w=500" rel="owl" xlink:title="Message" xlink:target="_parent" transform="matrix(-0.49999,-0.86602,0.86602,-0.49999,158.49364905389024,591.5063509461097)" data-svg-origin="250 250" style=""><path fill="none" stroke="#111" stroke-width="1" class="sector" d="M250,250 l250,0 A250,250 0 0,0 375,33.49364905389035 z" style="cursor:pointer;"></path><use xlink:href="#icon-3" width="39" height="39" x="374.2602233886719" y="147.5" transform="rotate(60 393.7602233886719 167)"></use></a>

{block:ifnotupdatetabs}
<a class="item" id="item-4" role="link" tabindex="0" xlink:href="{text:link10 URL}" xlink:title="{text:link10}" xlink:target="_parent" transform="matrix(-1,0,0,-1,500,500)" data-svg-origin="250 250" style=""><path fill="none" stroke="#111" stroke-width="1" class="sector" d="M250,250 l250,0 A250,250 0 0,0 375,33.49364905389035 z"></path><use xlink:href="#icon-4" width="39" height="39" x="374.2602233886719" y="147.5" transform="rotate(60 393.7602233886719 167)"></use></a>
{/block:ifnotupdatetabs}

{block:ifupdatetabs}
<a class="item poplight" id="item-4" role="link" tabindex="0" href="#?w=400" rel="upd" xlink:title="Updates" xlink:target="_parent" transform="matrix(-1,0,0,-1,500,500)" data-svg-origin="250 250" style=""><path fill="none" stroke="#111" stroke-width="1" class="sector" d="M250,250 l250,0 A250,250 0 0,0 375,33.49364905389035 z"></path><use xlink:href="#icon-4" width="39" height="39" x="374.2602233886719" y="147.5" transform="rotate(60 393.7602233886719 167)"></use></a>
{/block:ifupdatetabs}


<a class="item poplight" id="item-5" role="link" tabindex="0" href="#?w=800" rel="arch" xlink:title="Archive" xlink:target="_parent" transform="matrix(-0.5,0.86602,-0.86602,-0.5,591.5063509461097,158.4936490538905)" data-svg-origin="250 250" style=""><path fill="none" stroke="#111" stroke-width="1" class="sector" d="M250,250 l250,0 A250,250 0 0,0 375,33.49364905389035 z"></path><use xlink:href="#icon-5" width="39" height="39" x="374.2602233886719" y="147.5" transform="rotate(60 393.7602233886719 167)"></use></a>


<a class="item poplight" id="item-6" role="link" tabindex="0" href="#?w=500" rel="ab" xlink:title="Info" xlink:target="_parent" transform="matrix(0.5,0.86602,-0.86602,0.5,341.5063509461096,-91.5063509461097)" data-svg-origin="250 250" style=""><path fill="none" stroke="#111" stroke-width="1" class="sector" d="M250,250 l250,0 A250,250 0 0,0 375,33.49364905389035 z"></path><use xlink:href="#icon-6" width="39" height="39" x="374.2602233886719" y="147.5" transform="rotate(60 393.7602233886719 167)"></use></a>

</g>
    <g id="trigger" class="trigger menu-trigger">
        <circle cx="250" cy="250" r="60"></circle>
        <text id="label" text-anchor="middle" x="250" y="260" fill="#fff" font-size="3.5em">+</text>
    </g>
</svg>        
    </div>
</div>    
    
    </div>

    <div id="sb2">
    
        {block:Likes}
        {block:ifshowlikes}
        <div id="sidebar2">
 
           
                <h2>Liked Posts</h2>
          
            <div id="likes_container">
            {Likes limit=10 summarize="25" width="200"}<br>
       
         </div>

<a href="http://www.tumblr.com/liked/by/{Name}" style="width:100%;">More</a>

        
        </div> 
        {/block:ifshowlikes}
        {/block:Likes}  
    
    </div>
    
    <div id="header">
<a class="link siriusblack" href="/">{Title}<span data-letters="{Title}"></span><span data-letters="{Title}"></span></a>

<nav class="prongs" id="prongs">
<a href="/"><span data-hover="Home">Home</span></a>
<a href="#?w=500" rel="owl" class="poplight"><span data-hover="Ask">Ask</span></a>
<a href="#?w=500" rel="ab" class="poplight"><span data-hover="Info">Info</span></a>
<a href="#?w=700" rel="navi" class="poplight"><span data-hover="Links">Links</span></a>

{block:ifupdatetabs}
<a href="#?w=400" rel="upd" class="poplight"><span data-hover="Updates">Updates</span></a>
{/block:ifupdatetabs}


</nav>

    </div>    
    
    <div id="entries">

		   {block:Posts} 
	   

{block:IndexPage}
{block:iftransparentpermalink}	


{block:Photo}
<section>
 {block:Date}
<div class="perma_hold">
    <div class="perma">
<a href="{Permalink}">{ShortMonth} {DayOfMonth}</a>    
{block:NoteCount}
    / <a href="{Permalink}">{NoteCountWithLabel}</a>
{/block:NoteCount}    
    <div class="info">
        <a href="{ReblogURL}">reblog</a>
        {block:RebloggedFrom} 
        <a href="{ReblogParentURL}">via</a>
        {block:ContentSource}
        <a href="{SourceURL}">source</a>
        {/block:ContentSource}
        {/block:RebloggedFrom} 
    </div>
    {block:HasTags}<div class="tags">{block:Tags}
        <a href="{TagURL}">#{Tag}</a>
    {/block:Tags}</div>{/block:HasTags}
</div>
</div>
{/block:Date}

		   <div class="posts">
{LinkOpenTag}
<img src="{PhotoURL-500}" width="100%" height="auto"/>{LinkCloseTag}

{block:ifcaption}
{block:Caption}{Caption}{/block:Caption}
{/block:ifcaption}
		   </div>    

</section>

{/block:Photo}

{block:Photoset}
<section>
 {block:Date}
<div class="perma_hold">
    <div class="perma">
<a href="{Permalink}">{ShortMonth} {DayOfMonth}</a>    
{block:NoteCount}
    / <a href="{Permalink}">{NoteCountWithLabel}</a>
{/block:NoteCount}    
    <div class="info">
        <a href="{ReblogURL}">reblog</a>
        {block:RebloggedFrom} 
        <a href="{ReblogParentURL}">via</a>
        {block:ContentSource}
        <a href="{SourceURL}">source</a>
        {/block:ContentSource}
        {/block:RebloggedFrom} 
    </div>
    {block:HasTags}<div class="tags">{block:Tags}
        <a href="{TagURL}">#{Tag}</a>
    {/block:Tags}</div>{/block:HasTags}
</div>
</div>
{/block:Date}

		   <div class="posts">
{Photoset}

{block:ifcaption}
{block:Caption}{Caption}{/block:Caption}
{/block:ifcaption}
		   </div>    

</section>

{/block:Photoset}

{block:Video}

<section>
 {block:Date}
<div class="perma_hold">
    <div class="perma">
<a href="{Permalink}">{ShortMonth} {DayOfMonth}</a>    
{block:NoteCount}
    / <a href="{Permalink}">{NoteCountWithLabel}</a>
{/block:NoteCount}    
    <div class="info">
        <a href="{ReblogURL}">reblog</a>
        {block:RebloggedFrom} 
        <a href="{ReblogParentURL}">via</a>
        {block:ContentSource}
        <a href="{SourceURL}">source</a>
        {/block:ContentSource}
        {/block:RebloggedFrom} 
    </div>
    {block:HasTags}<div class="tags">{block:Tags}
        <a href="{TagURL}">#{Tag}</a>
    {/block:Tags}</div>{/block:HasTags}
</div>
</div>
{/block:Date}

		   <div class="posts">
{block:if400px}
{Video-400}
{/block:if400px}
{block:ifnot400px}
{Video-500}
{/block:ifnot400px}

{block:ifcaption}
{block:Caption}{Caption}{/block:Caption}
{/block:ifcaption}
		   </div>    

</section>

{/block:Video}


{block:Quote}
<section>
 {block:Date}
<div class="perma_hold">
    <div class="perma">
<a href="{Permalink}">{ShortMonth} {DayOfMonth}</a>    
{block:NoteCount}
    / <a href="{Permalink}">{NoteCountWithLabel}</a>
{/block:NoteCount}    
    <div class="info">
        <a href="{ReblogURL}">reblog</a>
        {block:RebloggedFrom} 
        <a href="{ReblogParentURL}">via</a>
        {block:ContentSource}
        <a href="{SourceURL}">source</a>
        {/block:ContentSource}
        {/block:RebloggedFrom} 
    </div>
    {block:HasTags}<div class="tags">{block:Tags}
        <a href="{TagURL}">#{Tag}</a>
    {/block:Tags}</div>{/block:HasTags}
</div>
</div>
{/block:Date}

		   <div class="posts">
“
<div class="quotes">{Quote}</div>
”
{block:Source}
<div class="speaker">
     {Source}
</div>
{/block:Source}
{/block:ifcaption}
		   </div>    

</section>

{/block:Quote}

{block:Chat}

<section>
 {block:Date}
<div class="perma_hold">
    <div class="perma">
<a href="{Permalink}">{ShortMonth} {DayOfMonth}</a>    
{block:NoteCount}
    / <a href="{Permalink}">{NoteCountWithLabel}</a>
{/block:NoteCount}    
    <div class="info">
        <a href="{ReblogURL}">reblog</a>
        {block:RebloggedFrom} 
        <a href="{ReblogParentURL}">via</a>
        {block:ContentSource}
        <a href="{SourceURL}">source</a>
        {/block:ContentSource}
        {/block:RebloggedFrom} 
    </div>
    {block:HasTags}<div class="tags">{block:Tags}
        <a href="{TagURL}">#{Tag}</a>
    {/block:Tags}</div>{/block:HasTags}
</div>
</div>
{/block:Date}

		   <div class="posts">
		   
{block:Title}<div class="titre">{Title}</div>{/block:Title}
{block:Lines}
<div class="chats">
{block:Label}<strong>{Label}</strong>{/block:Label} {Line}<br  />    
</div>
{/block:Lines}
		   </div>    

</section>

{/block:Chat}

{block:Answer}
<div class="posts" style="margin-top:50px;">

<div class="ask_cont">
<div class="asker">
    <a href="{AskerURL}">
        <img src="{AskerPortraitURL-48}" align="left"> 
    </a>
</div>
<div class="questions">
   <p>{Asker}: {Question}</p>

</div>
</div>

{Answer}

</div>

{block:date}

<div class="footer">
   <a href="{Permalink}" title="{TimeAgo}">{ShortMonth}{DayOfMonth}</a> 
   
   {block:NoteCount}
    <a href="{Permalink}">{NoteCount}+</a>
    {/block:NoteCount}

{block:RebloggedFrom}
    <a href="{ReblogParentURL}" title="{ReblogParentName}">via</a>
   
     {block:ContentSource}
    <a href="{SourceURL}"  title="{ReblogRootName}">source</a>
    {/block:ContentSource}
{/block:RebloggedFrom}
   
    <a href="{ReblogURL}">reblog</a>    
    
</div>

{block:HasTags}
     <div class="tgs">
    {block:Tags}
    <a href="{TagURL}">{Tag}</a>
    {/block:Tags}
    </div>
{/block:HasTags} 

{/block:date}

{/block:Answer} 

{block:Link}
<div class="posts" style="margin-top:50px;">
<nav class="remus" id="remus">
<a href="{URL}" data-hover="{Name}">{Name}</a>

</nav>
{block:Description}{Description}{/block:Description}    
</div>

{block:date}

<div class="footer">
   <a href="{Permalink}" title="{TimeAgo}">{ShortMonth}{DayOfMonth}</a> 
   
   {block:NoteCount}
    <a href="{Permalink}">{NoteCount}+</a>
    {/block:NoteCount}

{block:RebloggedFrom}
    <a href="{ReblogParentURL}" title="{ReblogParentName}">via</a>
   
     {block:ContentSource}
    <a href="{SourceURL}"  title="{ReblogRootName}">source</a>
    {/block:ContentSource}
{/block:RebloggedFrom}
   
    <a href="{ReblogURL}">reblog</a>    
    
</div>

{block:HasTags}
     <div class="tgs">
    {block:Tags}
    <a href="{TagURL}">{Tag}</a>
    {/block:Tags}
    </div>
{/block:HasTags} 

{/block:date}

{/block:Link}

{block:Text}
<div class="posts" style="margin-top:50px;">
{block:Title}<div class="titre">{Title}</div>{/block:Title}
{Body}    
</div>

{block:date}

<div class="footer">
   <a href="{Permalink}" title="{TimeAgo}">{ShortMonth}{DayOfMonth}</a> 
   
   {block:NoteCount}
    <a href="{Permalink}">{NoteCount}+</a>
    {/block:NoteCount}

{block:RebloggedFrom}
    <a href="{ReblogParentURL}" title="{ReblogParentName}">via</a>
   
     {block:ContentSource}
    <a href="{SourceURL}"  title="{ReblogRootName}">source</a>
    {/block:ContentSource}
{/block:RebloggedFrom}
   
    <a href="{ReblogURL}">reblog</a>    
    
</div>

{block:HasTags}
     <div class="tgs">
    {block:Tags}
    <a href="{TagURL}">{Tag}</a>
    {/block:Tags}
    </div>
{/block:HasTags} 

{/block:date}

{/block:Text}

{block:Audio}
<div class="posts" style="margin-top:50px;">
<div class="flitwick">

<div class="mariah">
    <div class="playbox">{AudioPlayerWhite}</div>
</div>

<div class="grammy">
<img src="http://static.tumblr.com/jn9hrij/20Ul2zzsr/albumart.jpg" style="position:absolute;" width="100" height="100" />
{block:AlbumArt}
<img src="{AlbumArtURL}" style="position:absolute;">
{/block:AlbumArt}    
</div>


<div class="taylor">
    <div class="swift">
{block:TrackName}
<b>Song:</b> {TrackName}
{/block:TrackName}<br>

{block:Artist}
<b>Artist:</b> {Artist}
{/block:Artist}<br>

{block:Album}
<b>Album:</b> {Album}
{/block:Album}

    </div>
</div>

</div>
{block:ifcaption}
{block:Caption}<p>{Caption}</p>{/block:Caption}
{/block:ifcaption}  
</div>

{block:date}

<div class="footer">
   <a href="{Permalink}" title="{TimeAgo}">{ShortMonth}{DayOfMonth}</a> 
   
   {block:NoteCount}
    <a href="{Permalink}">{NoteCount}+</a>
    {/block:NoteCount}

{block:RebloggedFrom}
    <a href="{ReblogParentURL}" title="{ReblogParentName}">via</a>
   
     {block:ContentSource}
    <a href="{SourceURL}"  title="{ReblogRootName}">source</a>
    {/block:ContentSource}
{/block:RebloggedFrom}
   
    <a href="{ReblogURL}">reblog</a>    
    
</div>

{block:HasTags}
     <div class="tgs">
    {block:Tags}
    <a href="{TagURL}">{Tag}</a>
    {/block:Tags}
    </div>
{/block:HasTags} 

{/block:date}

{/block:Audio}
{/block:iftransparentpermalink}

{block:ifnottransparentpermalink}

<div class="posts">

{block:Text}
{block:Title}<div class="titre">{Title}</div>{/block:Title}
{Body}
{/block:Text}

{block:Photo}
{LinkOpenTag}<img src="{PhotoURL-500}" width="100%" height="auto"/>{LinkCloseTag}
{block:Caption}{Caption}{/block:Caption}
{/block:Photo}

{block:Video}
{block:if400px}
{Video-400}
{/block:if400px}
{block:ifnot400px}
{Video-500}
{/block:ifnot400px}
{block:Caption}{Caption}{/block:Caption}
{/block:Video}

{block:Photoset}

{Photoset}

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

{/block:Photoset}

{block:Chat}
{block:Title}<div class="titre">{Title}</div>{/block:Title}
{block:Lines}
<div class="chats">
{block:Label}<strong>{Label}</strong>{/block:Label} {Line}<br  />    
</div>
{/block:Lines}
{/block:Chat}

{block:Quote}
“
<div class="quotes">{Quote}</div>
”
{block:Source}
<div class="speaker">
     {Source}
</div>
{/block:Source}
{/block:Quote}

{block:Link}
<nav class="remus" id="remus">
<a href="{URL}" data-hover="{Name}">{Name}</a>

</nav>
{block:Description}{Description}{/block:Description}    

{/block:Link}

{block:Audio}
<div class="flitwick">

<div class="mariah">
    <div class="playbox">{AudioPlayerWhite}</div>
</div>

<div class="grammy">
<img src="http://static.tumblr.com/jn9hrij/20Ul2zzsr/albumart.jpg" style="position:absolute;" width="100" height="100" />
{block:AlbumArt}
<img src="{AlbumArtURL}" style="position:absolute;">
{/block:AlbumArt}    
</div>


<div class="taylor">
    <div class="swift">
{block:TrackName}
<b>Song:</b> {TrackName}
{/block:TrackName}<br>

{block:Artist}
<b>Artist:</b> {Artist}
{/block:Artist}<br>

{block:Album}
<b>Album:</b> {Album}
{/block:Album}

    </div>
</div>

</div>
{block:Caption}<p>{Caption}</p>{/block:Caption}
{/block:Audio}

{block:Answer}

<div class="ask_cont">
<div class="asker">
    <a href="{AskerURL}">
        <img src="{AskerPortraitURL-48}" align="left"> 
    </a>
</div>
<div class="questions">
   <p>{Asker}: {Question}</p>

</div>
</div>

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

{block:date}

<div class="footer">
   <a href="{Permalink}" title="{TimeAgo}">{ShortMonth}{DayOfMonth}</a> 
   
   {block:NoteCount}
    <a href="{Permalink}">{NoteCount}+</a>
    {/block:NoteCount}

{block:RebloggedFrom}
    <a href="{ReblogParentURL}" title="{ReblogParentName}">via</a>
   
     {block:ContentSource}
    <a href="{SourceURL}"  title="{ReblogRootName}">source</a>
    {/block:ContentSource}
{/block:RebloggedFrom}
   
    <a href="{ReblogURL}">reblog</a>    
    
</div>

{block:HasTags}
     <div class="tgs">
    {block:Tags}
    <a href="{TagURL}">{Tag}</a>
    {/block:Tags}
    </div>
{/block:HasTags} 

{/block:date}

{/block:ifnottransparentpermalink}

{/block:IndexPage}


{block:Permalinkpage}
<div class="posts" style="margin-top:50px;">

{block:Text}
{block:Title}<div class="titre">{Title}</div>{/block:Title}
{Body}
{/block:Text}

{block:Photo}
{LinkOpenTag}<img src="{PhotoURL-500}" width="100%" height="auto"/>{LinkCloseTag}
{block:Caption}{Caption}{/block:Caption}
{/block:Photo}

{block:Video}
{block:if400px}
{Video-400}
{/block:if400px}
{block:ifnot400px}
{Video-500}
{/block:ifnot400px}
{block:Caption}{Caption}{/block:Caption}
{/block:Video}

{block:Photoset}

{Photoset}

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

{/block:Photoset}

{block:Chat}
{block:Title}<div class="titre">{Title}</div>{/block:Title}
{block:Lines}
<div class="chats">
{block:Label}<strong>{Label}</strong>{/block:Label} {Line}<br  />    
</div>
{/block:Lines}
{/block:Chat}

{block:Quote}
“
<div class="quotes">{Quote}</div>
”
{block:Source}
<div class="speaker">
     {Source}
</div>
{/block:Source}
{/block:Quote}

{block:Link}
<nav class="remus" id="remus">
<a href="{URL}" data-hover="{Name}">{Name}</a>

</nav>
{block:Description}{Description}{/block:Description}    

{/block:Link}

{block:Audio}
<div class="flitwick">

<div class="mariah">
    <div class="playbox">{AudioPlayerWhite}</div>
</div>

<div class="grammy">
<img src="http://static.tumblr.com/jn9hrij/20Ul2zzsr/albumart.jpg" style="position:absolute;" width="100" height="100" />
{block:AlbumArt}
<img src="{AlbumArtURL}" style="position:absolute;">
{/block:AlbumArt}    
</div>


<div class="taylor">
    <div class="swift">
{block:TrackName}
<b>Song:</b> {TrackName}
{/block:TrackName}<br>

{block:Artist}
<b>Artist:</b> {Artist}
{/block:Artist}<br>

{block:Album}
<b>Album:</b> {Album}
{/block:Album}

    </div>
</div>

</div>
{block:Caption}<p>{Caption}</p>{/block:Caption}
{/block:Audio}

{block:Answer}

<div class="ask_cont">
<div class="asker">
    <a href="{AskerURL}">
        <img src="{AskerPortraitURL-48}" align="left"> 
    </a>
</div>
<div class="questions">
   <p>{Asker}: {Question}</p>

</div>
</div>

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

{block:date}

<div class="footer">
   <a href="{Permalink}" title="{TimeAgo}">{ShortMonth}{DayOfMonth}</a> 
   
   {block:NoteCount}
    <a href="{Permalink}">{NoteCount}+</a>
    {/block:NoteCount}

{block:RebloggedFrom}
    <a href="{ReblogParentURL}" title="{ReblogParentName}">via</a>
   
     {block:ContentSource}
    <a href="{SourceURL}"  title="{ReblogRootName}">source</a>
    {/block:ContentSource}
{/block:RebloggedFrom}
   
    <a href="{ReblogURL}">reblog</a>    
    
</div>

{block:HasTags}
     <div class="tgs">
    {block:Tags}
    <a href="{TagURL}">{Tag}</a>
    {/block:Tags}
    </div>
{/block:HasTags} 

{/block:date}

{block:date}
<div class="posts">
    {block:NoteCount}           
   <div class="notes">
   <center><h1>Notes</h1></center>
        {block:PostNotes}
    {PostNotes}
    {/block:PostNotes}    
   </div> 
   {block:NoteCount}
</div>
{/block:date}

{/block:Permalinkpage}


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

{block:IndexPage}
{block:Pagination}

<div class="pg">
            {block:PreviousPage}
        <a href="{PreviousPage}">&#8592;Back</a>
            {/block:PreviousPage}
            {block:NextPage}
            <a href="{NextPage}">Forth&#8594;</a>
            {/block:NextPage}   
</div>
           
{/block:Pagination}
{/block:IndexPage}

        
<!--PLEASE DO NOT ALTER OR COVER THE CREDIT-->
<div id="leo">
<a href="http://hermionejean.co.vu">♚</a>
</div>
<!--END OF CREDIT-->


<script src="http://cdnjs.cloudflare.com/ajax/libs/snap.svg/0.3.0/snap.svg-min.js"></script>

<script>
var svg = document.getElementById('menu'),
    itemsContainer = document.getElementById('itemsContainer'),
    trigger = document.getElementById('trigger'),
    label = trigger.querySelectorAll('#label')[0],
    items = Snap(itemsContainer),
    originalTransform = itemsContainer.getAttribute("transform"),
    open = false;

//close items
items.animate({
    transform: "s0,0,250,250",
    opacity: 0
}, .005);
svg.style.pointerEvents = "none";
//attach listener
trigger.addEventListener('click', toggleMenu, false);

//handle click
function toggleMenu(event) {
    if (!event) var event = window.event;
    event.stopPropagation();
    open = !open;

    if (!open) {
        items.animate({
            transform: "s0,0,250,250",
            opacity: 0
        }, 400, mina.backin);
        label.innerHTML = "+";
        svg.style.pointerEvents = "none";
    } else {
        items.animate({
            transform: originalTransform,
            opacity: 1
        }, 1000, mina.elastic);
        label.innerHTML = "-";
        svg.style.pointerEvents = "auto";
    }

}

svg.onclick = function (e) {
    e.stopPropagation();
}
    
</script>

    
</body>
<div id="owl" class="popup_block" style="top:38%;">
<p><h1>{AskLabel}</h1></p>
<iframe frameborder="0" scrolling="no" width="100%" height="190" src="http://www.tumblr.com/ask_form/{Name}.tumblr.com" style="background-color:transparent; overflow:hidden;" id="ask_form">
</iframe>
</div>
</div></div></div></div></div></div></div></div></div></div>

<div id="ab" class="popup_block">
<p><h1>Profile</h1></p>  

                                                                            <div class="grid">
                                                            					<figure class="anto">
                                                            						<img src="{image:blogger}"/>
                                                            						<figcaption>
                                                            							<h2><span>{text:nom}</span> ({text:info})</h2>
                                                            			{block:description}<p>{description}</p>{/block:description}
                                                            			<p>{text:bio}</p>			
                                                            						</figcaption>			
                                                            					</figure>
                                                            				</div>
</div>
</div></div></div></div></div></div></div></div></div></div>

<div id="navi" class="popup_block" style="top:42%;">

<p><h1>Navigation</h1></p>

				<nav class="iniesta" id="iniesta">
<a href="{text:link1 URL}"><span data-hover="{text:link1}">{text:link1}</span></a>
<a href="{text:link2 URL}"><span data-hover="{text:link2}">{text:link2}</span></a>
<a href="{text:link3 URL}"><span data-hover="{text:link3}">{text:link3}</span></a>
<a href="{text:link4 URL}"><span data-hover="{text:link4}">{text:link4}</span></a>
<a href="{text:link5 URL}"><span data-hover="{text:link5}">{text:link5}</span></a>
<a href="{text:link6 URL}"><span data-hover="{text:link6}">{text:link6}</span></a>
<a href="{text:link7 URL}"><span data-hover="{text:link7}">{text:link7}</span></a>
<a href="{text:link8 URL}"><span data-hover="{text:link8}">{text:link8}</span></a>
<a href="{text:link9 URL}"><span data-hover="{text:link9}">{text:link9}</span></a>

				</nav>
</div>
</div></div></div></div></div></div></div></div></div></div>

<div id="upd" class="popup_block" style="top:40%;">
<p><h1>Updates</h1></p>
<div id="updates">
    <p><b>Reading:</b> {text:reading}<br>
    <b>Watching:</b> {text:watching}<br>
    <b>Listening:</b> {text:listening}<br>
    <b>Working On:</b> {text:working on}</p>

<p>{text:updates}</p>    
</div>
 
</div>
</div></div></div></div></div></div></div></div></div></div>

<div id="arch" class="popup_block" style="height:500px;">
<iframe src="http://{Name}.tumblr.com/archive" height="500" width="800">
    </iframe>
 
</div>
 
</div></div></div></div></div></div></div></div></div></div>

</html>