Theme 58
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<!---------------- DO NOT REMOVE THE CREDIT | DO NOT USE AS A BASE | DO NOT REPOST | DO NOT CLAIM AS YOURS ---------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<!------------------------------------------------------------------------------------------------------------------------------
>>> T H E M E B Y R O X I E <<<
Theme by Roxie | roxiestheme.tumblr.com
2016 ⓒ All Rights Reserved.
-----------------------------
SPECIAL THANKS
> PIXEL UNION | Extended photoset
> SHYTHEMES | Video width fix
> CUBTHEMES | Custom like button
> LINEARICONS | Icons
> BOOTSTRAPCDN | Linearicons-Free CSS
> ICOMOON | Custom icons
------------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<!---------------- DO NOT REMOVE THE CREDIT | DO NOT USE AS A BASE | DO NOT REPOST | DO NOT CLAIM AS YOURS ---------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<head>
<meta name="color:Background Color" content="#f6f6f6" />
<meta name="color:Post Background Color" content="#ffffff" />
<meta name="color:Navigation Color" content="#fafafa" />
<meta name="color:Header Background Color" content="#ffffff" />
<meta name="color:Border Color" content="#eeeeee" />
<meta name="color:Text Color" content="#888888" />
<meta name="color:Link Color" content="#666666" />
<meta name="color:Accent Color" content="#d1e4a8" />
<meta name="image:Sidebar" content="" />
<meta name="if:Use Avatar Image" content="0">
<meta name="select:Font Family" content="'Karla', sans-serif" title="Karla">
<meta name="select:Font Family" content="'Open Sans', sans-serif" title="Open Sans">
<meta name="select:Font Family" content="'Roboto', sans-serif" title="Roboto">
<meta name="select:Font Family" content="'Lato', sans-serif" title="Lato">
<meta name="select:Font Size" content="10px" title="10px">
<meta name="select:Font Size" content="9px" title="9px">
<meta name="select:Font Size" content="11px" title="11px">
<meta name="select:Font Size" content="12px" title="12px">
<meta name="select:Sidebar Width" content="150px" title="150px">
<meta name="select:Sidebar Width" content="200px" title="200px">
<meta name="select:Sidebar Width" content="250px" title="250px">
<meta name="select:Post Width" content="540px" title="540px">
<meta name="select:Post Width" content="400px" title="400px">
<meta name="select:Post Width" content="500px" title="500px">
<meta name="text:Avatar Icon" content="heart" />
<meta name="text:Sidebar Title" content="about" />
<meta name="text:Topbar Title" content="" />
<meta name="text:Short Info" content="" />
<meta name="text:Link 1 Title" content="index" />
<meta name="text:Link 1 Url" content="/" />
<meta name="text:Link 2 Title" content="message" />
<meta name="text:Link 2 Url" content="/ask" />
<meta name="text:Link 3 Title" content="" />
<meta name="text:Link 3 Url" content="" />
<meta name="text:Link 4 Title" content="" />
<meta name="text:Link 4 Url" content="" />
<meta name="text:Link 5 Title" content="" />
<meta name="text:Link 5 Url" content="" />
<meta name="text:Link 6 Title" content="" />
<meta name="text:Link 6 Url" content="" />
<title>{Title}</title>
<link rel="shortcut icon" href="{Favicon}">
<link rel="alternate" type="application/rss+xml" href="{RSS}">
<link href='http://static.tumblr.com/sas2ex2/HFinqriui/photoset.css' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="https://cdn.linearicons.com/free/1.0.0/icon-font.min.css">
<link href="https://fonts.googleapis.com/css?family=Karla:400,700|Lato:400,700|Open+Sans:400,700|Roboto:400,700" rel="stylesheet">
{block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
<!-------------------------------------------------------------------->
<!------------------------------ JQUERY ------------------------------>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="http://static.tumblr.com/rzl30kg/eAxm7a751/jquery.style-my-tooltips.js"></script>
<script src="http://static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
<script src="https://cdn.linearicons.com/free/1.0.0/svgembedder.min.js"></script>
<!------------------------------ JQUERY ------------------------------>
<!-------------------------------------------------------------------->
<!-------------------------------------------------------------------->
<!-------------------- FIX VIDEO WIDTH BY SHYTHEMES ------------------>
<script src ="//static.tumblr.com/fwgzvyf/Oj1o08f6h/shythemes.vr.js"></script>
<!-------------------- FIX VIDEO WIDTH BY SHYTHEMES ------------------>
<!-------------------------------------------------------------------->
<!-------------------------------------------------------------------->
<!------------------------------ SCRIPTS ----------------------------->
<script>
$(document).ready(function() {
$('.photo-slideshow').pxuPhotoset({
lightbox: true,
gutter: '4px',
borderRadius: '0px',
photoset: '.photo-slideshow',
photoWrap: '.photo-data',
photo: '.pxu-photo'
});
$("[title]").style_my_tooltips({
tip_follows_cursor:true,
tip_delay_time:100,
tip_fade_speed:300
});
//Check to see if the window is top if not then display button
$(window).scroll(function(){
if ($(this).scrollTop() > 100) {
$('.scrollToTop').fadeIn();
} else {
$('.scrollToTop').fadeOut();
}
});
//Click event to scroll to top
$('.scrollToTop').click(function(){
$('html, body').animate({scrollTop : 0},800);
return false;
});
});
</script>
<!------------------------------ SCRIPTS ----------------------------->
<!-------------------------------------------------------------------->
<style type="text/css">
/*----------------------------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*/
/*------------------------------ BASIC ------------------------------*/
html, body {
font-family:{select:Font Family};
background:{color:Background Color};
margin:0px;
padding:0px;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
/* LINKS BASIC */
a{
color:{color:Link Color};
}
a:hover{
color:{color:Accent Color};
}
a, a:hover, a:active{
text-decoration:none;
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}
/* LIST BASIC */
ul, menu, dir{
margin:0px !important;
padding:0px !important;
-webkit-margin-before:0px !important;
-webkit-margin-after:0px !important;
-webkit-margin-start:0px !important;
-webkit-margin-end:0px!important;
-webkit-padding-start:0px !important;
}
/* TOOLTIPS */
#s-m-t-tooltip{
position:absolute;
z-index:9999999;
margin-top:5px;
margin-left:10px;
display:block;
padding:5px 8px;
background-color:{color:Text Color};
font-family:{select:Font Family};
font-size:8px;
color:{color:Post Background Color};
letter-spacing:1px;
text-transform:uppercase;
}
/* SCROLL BAR */
::-webkit-scrollbar-thumb {
width:5px;
border:1px solid {color:Border Color};
border-right:none;
background-color:{color:Navigation Color};
}
::-webkit-scrollbar {
width:5px;
border-left:1px solid {color:Border Color};
border-right:4px solid {color:Post Background Color};
background-color:{color:Post Background Color};
}
/* SELECTION */
::-moz-selection { /* Code for Firefox */
color:{color:Post Background Color};
background-color:{color:Text Color};
}
::selection {
color:{color:Post Background Color};
background-color:{color:Text Color};
}
/* TUMBLR CONTROLS */
.tmblr-iframe-compact .tmblr-iframe--unified-controls {
z-index:999999;
position:fixed;
top:10px;
right:calc(50% - {select:Sidebar Width}/2 - {select:Post Width}/2 - 23px);
vertical-align:middle;
white-space:nowrap !important;
opacity:0.2;
-webkit-filter: invert(100%);
-moz-filter: invert(100%);
-o-filter: invert(100%);
-ms-filter: invert(100%);
filter: invert(100%);
-webkit-transform: scale(0.6);
-webkit-transform-origin: top right;
-moz-transform: scale(0.6);
-moz-transform-origin: top right;
-o-transform: scale(0.6);
-o-transform-origin: top right;
-ms-transform: scale(0.6);
-ms-transform-origin: top right;
transform: scale(0.6);
transform-origin: top right;
}
/* SCROLL TO TOP */
.scrollToTop{
font-size:8px;
font-weight:400;
text-align:center;
width:72px;
color:{color:Text Color};
text-transform:uppercase;
text-decoration:none;
position:fixed;
bottom:50px;
right:30px;
letter-spacing:1px;
display:none;
z-index:9999;
}
.scrollToTop:hover{
color:{color:Link Color};
text-decoration:none;
}
/*------------------------------ BASIC ------------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*
/*----------------------------- HEADER -----------------------------*/
/* HEADER BASIC */
header{
position:fixed;
top:0px;
left:0px;
width:100%;
height:80px;
overflow:hidden;
background-color:{color:Navigation Color};
border:1px solid {color:Border Color};
border-left:none;
z-index:9999;
}
/* HEADER CONTENT */
header #header-content{
position:absolute;
left:calc(50% - {select:Sidebar Width}/2 - {select:Post Width}/2 - 16px);
width:calc({select:Sidebar Width} + {select:Post Width} + 32px);
height:50px;
}
header #header-content:before{
content:'';
position:absolute;
top:39.5px;
display:block;
width:calc({select:Sidebar Width} + {select:Post Width} + 32px);
height:1px;
background-color:{color:Border Color};
}
/* AVATAR */
header #header-content .icon{
position:relative;
z-index:99999;
float:left;
margin:15px 10px 0px 0px;
display:block;
border-radius:50%;
width:50px;
height:50px;
text-align:center;
background-color:{color:Accent Color};
{block:ifUseAvatarImage}
background-image:url('{PortraitURL-64}');
background-size:50px 50px;
{/block:ifUseAvatarImage}
}
header #header-content .icon:before{
font-family:'Linearicons-Free';
font-size:20px;
font-weight:bold;
margin-left:2px;
line-height:50px;
color:{color:Post Background Color};
{block:ifUseAvatarImage}
display:none;
{/block:ifUseAvatarImage}
}
/* TITLE */
header #header-content h1{
font-size:13px;
font-weight:700;
letter-spacing:-0.5px;
margin:18px 0px 0px 0px;
}
header #header-content h1 a{
color:{color:Text Color};
}
header #header-content h1 a:hover{
color:{color:Link Color};
cursor:help;
}
header #header-content h2{
color:{color:Text Color};
font-size:8px;
font-weight:400;
text-transform:uppercase;
letter-spacing:1px;
margin:15px 0px 0px 0px;
}
/* NAVIGATION */
header #header-content nav.toplinks{
position:absolute;
right:0px;
bottom:-10px;
overflow:hidden;
width:calc({select:Sidebar Width} + {select:Post Width} - 28px);
text-align:right;
}
header #header-content nav.toplinks a{
display:inline-block;
text-transform:uppercase;
font-size:8.5px;
letter-spacing:1.5px;
margin-left:20px;
padding-top:7px;
color:{color:Text Color};
border-top:1px solid transparent;
}
header #header-content nav.toplinks a:hover{
border-top:1px solid {color:Accent Color};
color:{color:Link Color};
}
/*----------------------------- HEADER -----------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*/
/*---------------------------- CONTAINER ----------------------------*/
#container{
position:relative;
overflow:hidden;
top:81px;
left:calc(50% - {select:Sidebar Width}/2 - {select:Post Width}/2 - 16px);
width:calc({select:Sidebar Width} + {select:Post Width} + 32px);
margin:30px 0px;
display:block;
background-color:{color:Background Color};
}
/*---------------------------- CONTAINER ----------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*/
/*----------------------------- SIDEBAR -----------------------------*/
#sidebar{
width:{select:Sidebar Width};
position:fixed;
z-index:999;
top:111px;
left:calc(50% - {select:Sidebar Width}/2 - {select:Post Width}/2 - 16px);
}
#sidebar article{
display:block;
overflow:hidden;
border:1px solid {color:Border Color};
background-color:{color:Navigation Color};
border-radius:3px;
}
/* SIDEBAR TITLE */
#sidebar article.desc h1{
background-color:{color:Navigation Color};
display:block;
height:30px;
margin:0px;
border-bottom:1px solid {color:Border Color};
color:{color:Text Color};
font-family:{select:Font Family};
font-weight:700;
font-size:12px;
line-height:30px;
text-transform:capitalize;
letter-spacing:-0.5px;
}
#sidebar article.desc h1:before{
font-family:'Linearicons-Free';
font-size:10px;
display:block;
float:left;
margin:6px;
width:18px;
height:18px;
border-radius:3px;
text-align:center;
line-height:18px;
background-color:{color:Accent Color};
color:{color:Post Background Color};
}
/* SIDE IMAGE */
#sidebar article.desc img.sideimg{
display:block;
width:100%;
border-bottom:1px solid {color:Border Color};
}
/* DESCRIPTION */
#sidebar article.desc section{
display:block;
padding:15px;
font-size:10px;
color:{color:Text Color};
}
/* SEARCH BAR */
#sidebar .search{
margin:0px 15px 15px 15px;
display:block;
width:calc({select:Sidebar Width} - 30px);
height:25px;
overflow:hidden;
border-radius:3px;
border:1px solid {color:Border Color};
z-index:999999;
background-color:{color:Post Background Color};
}
#sidebar .search input{
display:block;
width:calc({select:Sidebar Width} - 57px);
height:25px;
padding:0px 10px;
background-color:transparent;
border:none;
outline:none;
font-family:{select:Font Family};
font-size:{select:Font Size} !important;
font-weight:400 !important;
color:{color:Text Color} !important;
}
#sidebar .search input.sbutton{
position:absolute;
margin-top:-25px;
margin-left:calc({select:Sidebar Width} - 55px);
cursor:pointer;
padding:0px;
display:block;
width:25px;
height:25px;
outline:none;
border:none;
border-left:1px solid {color:Border Color};
font-family:'Linearicons-Free';
text-align:center;
line-height:27px;
font-size:calc({select:Font Size} + 2px) !important;
font-weight:normal;
background:{color:Navigation Color};
z-index:9;
}
::-webkit-input-placeholder{color:{color:Text Color};opacity:0.5;
letter-spacing:1px;}
::-moz-input-placeholder{color:{color:Text Color};opacity:0.5;
letter-spacing:1px;}
::-o-input-placeholder{color:{color:Text Color};opacity:0.5;
letter-spacing:1px;}
::-ms-input-placeholder{color:{color:Text Color};opacity:0.5;
letter-spacing:1px;}
/* PAGINATION */
#sidebar article.pagination{
margin:10px 0px 0px 0px;
display:block;
height:30px;
text-transform:uppercase;
text-align:center;
font-size:9px;
line-height:30px;
background-color:{color:Post Background Color};
color:{color:Text Color};
}
#sidebar article.pagination a{
display:inline-block;
color:{color:Text Color};
}
#sidebar article.pagination a:hover{
color:{color:Link Color};
}
#sidebar article.pagination a.jump{
width:calc({select:Sidebar Width}/3 - 15px);
height:30px;
background-color:{color:Navigation Color};
text-align:center;
display:block;
text-transform:uppercase;
}
#sidebar article.pagination a.jump-prev{
float:left;
border-right:1px solid {color:Border Color};
}
#sidebar article.pagination a.jump-next{
float:right;
border-left:1px solid {color:Border Color};
}
/*----------------------------- SIDEBAR -----------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*/
/*------------------------------ POSTS ------------------------------*/
#posts{
position:relative;
margin-left:calc({select:Sidebar Width} + 30px);
width:calc({select:Post Width} + 2px);
}
/* SINGLE POST */
#post{
overflow:hidden;
width:{select:Post Width};
border:1px solid {color:Border Color};
border-bottom:none;
border-radius:3px;
margin:0px 0px 30px 0px;
}
#post:last-child{
margin:0px;
}
/* POSTCONTENT BASIC */
#postcontent{
background-color:{color:Post Background Color};
font-family:{select:Font Family};
font-weight:400;
font-size:{select:Font Size};
color:{color:Text Color};
width:{select:Post Width};
text-align:justify;
line-height:150%;
}
/* POST MEDIA */
#postcontent .postmedia{
width:{select:Post Width};
border-bottom:1px solid {color:Border Color};
overflow:hidden;
display:block;
}
#postcontent .postmedia .width_fix iframe{
width:calc({select:Post Width} + 2px) !important;
margin-top:-1px;
margin-left:-1px;
}
/* POST BODY */
#postcontent .postbody{
width:calc({select:Post Width} - 40px);
border-bottom:1px solid {color:Border Color};
padding:20px;
}
#postcontent .postbody a{
background-image: linear-gradient(180deg,rgba(68,68,68,0) 50%,rgba(68,68,68,.1) 0);
text-decoration: none;
background-repeat: repeat-x;
background-size: 1em 2px;
background-position: 0 1.15em;
padding-bottom: 2px;
}
#postcontent .postbody a:hover{
color:{color:Text Color};
}
/* POST IMAGES */
#postcontent .postbody img{
max-width:100%;
height:auto;
}
/* FIX IMAGE FIGURE */
#postcontent .postbody figure{
margin-top:10px;
max-width:100%;
height:auto;
}
#postcontent .postbody figure.tumblr-full img{
width:{select:Post Width};
}
/* POST TITLE */
#postcontent .posttitle{
font-family:{select:Font Family};
font-weight:400;
font-size:28px;
letter-spacing:0px;
text-align:justify;
line-height:120%;
margin-top:-10px;
color:{color:Text Color};
}
/* BLOCKQUOTE */
#postcontent blockquote{
width:calc(100% - 11px);
max-width:calc(100% - 11px);
margin-left:0px;
padding-left:10px;
border-left:1px solid {color:Accent Color};
}
/* TEXTS */
#postcontent .postbody p{
margin-top:3px;
}
#postcontent .postbody p:first-child{
margin-top:0px;
}
#postcontent .postbody big{
font-size:13px;
}
#postcontent .postbody small{
font-size:8px;
}
/* HIGHLIGHT */
#postcontent .postbody h2{
font-family:{select:Font Family};
font-weight:400;
font-size:20px;
color:{color:Text Color};
margin-bottom:15px;
}
/* LIST */
#postcontent .postbody ol{
margin:0px 0px 10px -15px !important;
}
#postcontent .postbody ul{
list-style-type:none;
margin:0px 0px 10px 5px !important;
}
#postcontent .postbody ul li:before{
display:block;
float:left;
margin-right:5px;
font-family:'Linearicons-Free';
font-size:calc({select:Font Size} - 3px);
content:'\e870';
}
#postcontent .postbody .caption{
margin-bottom:-10px;
}
/* LINK POSTS */
#postcontent .link-button{
border-bottom:1px solid {color:Border Color};
word-break:break-word;
overflow:hidden;
display:block;
position:relative;
text-decoration:none;
}
#postcontent .info-container{
padding:20px 20px 0;
overflow:hidden;
}
#postcontent .publisher-container{
margin-top:-4px;
margin-bottom:17px;
display:block;
font-size:13px;
line-height:16px;
font-weight:700;
word-break:break-all;
}
#postcontent .publisher-container .publisher{
line-height:16px;
font-size:7px;
font-weight:700;
color:{color:Text Color};
text-transform:uppercase;
letter-spacing:2px;
display:inline-block;
margin:0px;
}
#postcontent .publisher-container.if-thumbnail{
position:absolute;
top:20px;
left:20px;
right:20px;
}
#postcontent .publisher-container.if-thumbnail .publisher{
color:{color:Post Background Color};
text-shadow:1px 1px 0px rgba(0,0,0,0.3);
}
#postcontent .info-container{
padding:20px 20px 0;
overflow:hidden;
color:{color:Text Color};
}
#postcontent .info-container .title{
margin-top:-5px;
margin-bottom:10px;
display:block;
font-family:{select:Font Family};
font-size:calc({select:Font Size} + 8px);
font-weight:700;
letter-spacing:0px;
line-height:calc({select:Font Size} + 10px);
}
#postcontent .info-container .title:after{
display:inline-block;
font-size:calc({select:Font Size} + 3px);
line-height:calc({select:Font Size} + 1px);
margin-left:5px;
white-space:nowrap;
font-family:'Linearicons-Free';
font-weight:bold;
content: "\e876";
}
#postcontent .info-container .excerpt{
margin-top:-2px;
margin-bottom:10px;
display:block;
font-size:{select:Font Size};
line-height:calc({select:Font Size} + 3px);
}
#postcontent .info-container .author{
margin-top:-3px;
margin-bottom:15px;
display:block;
font-size:calc({select:Font Size} - 2px);
font-weight:400;
letter-spacing:0.5px;
line-height:calc({select:Font Size} + 2px);
opacity:0.5;
}
/* QUOTES */
#postcontent .quotes{
font-family:{select:Font Family};
font-weight:400;
font-size:calc({select:Font Size} + 15px);
letter-spacing:-1px;
line-height:130%;
margin-top:-5px;
margin-bottom:10px;
color:{color:Text Color};
}
#postcontent .icon-quote-left,
#postcontent .icon-quote-right{
display:inline-block;
width:calc({select:Font Size} + 10px);
height:calc({select:Font Size} + 10px);
fill:{color:Text Color};
}
#postcontent .icon-quote-left{
margin-right:8px;
}
#postcontent .icon-quote-right{
margin-left:8px;
}
/* ASKS */
#postcontent .asker{
font-size:calc({select:Font Size} - 3px);
text-transform:uppercase;
text-align:left;
line-height:110%;
margin-top:2px;
color:{color:Text Color};
letter-spacing:2px;
}
#postcontent .asker span{
font-family:{select:Font Family};
font-weight:400;
text-transform:uppercase;
font-size:calc({select:Font Size} + 2px);
line-height:110%;
letter-spacing:1px;
}
#postcontent .asker a{
background-image:none;
color:{color:Link Color};
font-family:{select:Font Family};
font-weight:400;
text-transform:uppercase;
font-size:calc({select:Font Size} + 2px);
line-height:110%;
letter-spacing:1px;
}
#postcontent .asker a:hover{
color:{color:Text Color};
}
#postcontent .askimg img{
width:calc({select:Font Size} + 15px);
height:calc({select:Font Size} + 15px);
margin-right:10px;
border-radius:50%;
float:left;
}
#postcontent .question{
width:465px;
margin-top:-5px;
margin-left:12px;
margin-bottom:15px;
padding:20px 0px 0px 20px;
border-left:1px solid {color:Border Color};
}
/* CHATS */
#postcontent ul.chat{
margin-bottom:0px !important;
overflow:hidden;
border:1px solid {color:Border Color};
border-bottom:none;
text-align:left;
}
#postcontent ul.chat{
list-style:none !important;
margin-left:0px !important;
}
#postcontent ul.chat li{
display:block;
min-height:25px;
line-height:25px;
font-size:calc({select:Font Size} + 1px);
font-weight:400 !important;
letter-spacing:1px;
color:{color:Text Color};
padding:0px 10px;
border-bottom:1px solid {color:Border Color};
}
#postcontent ul.chat li:before{
display:none;
}
#postcontent span.label{
display:block;
float:left;
height:25px;
border-right:1px solid {color:Border Color};
border-bottom:1px solid {color:Border Color};
background-color:{color:Post Background Color};
font-size:calc({select:Font Size} - 1px);
font-weight:700;
text-transform:uppercase;
letter-spacing:2px;
margin-left:-10px;
margin-right:5px;
padding:0px 3px 0px 10px;
color:{color:Text Color};
}
#postcontent span.label:after{
content:'';
position:absolute;
float:right;
margin-left:-5px;
width:4px;
height:25px;
background-color:{color:Post Background Color};
}
/* POSTNOTES */
#postnotes{
width:calc({select:Post Width} - 40px);
padding:0px 20px;
margin:30px 0px 0px 0px;
border-radius:3px;
border:1px solid {color:Border Color};
color:{color:Text Color};
background:{color:Post Background Color};
font-size:calc({select:Font Size} - 2px);
text-align:justify;
line-height:150%;
letter-spacing:1px;
text-transform:uppercase;
font-family:{select:Font Family};
}
#postnotes ol.notes{
padding:0px;
margin:20px 0px;
list-style-type:none;
}
#postnotes ol.notes li.note{
padding:10px 0px;
}
#postnotes ol.notes li.note img.avatar{
vertical-align:-4px;
margin-right:10px;
width:16px;
height:16px;
border-radius:50%;
}
/*------------------------------ POSTS ------------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*/
/*---------------------------- PERMALINK ----------------------------*/
#permalink{
position:relative;
display:block;
z-index:999;
background-color:{color:Navigation Color};
width:calc({select:Post Width} - 40px);
height:40px;
padding:0px 20px;
border-bottom:1px solid {color:Border Color};
overflow:hidden;
text-align:left;
font-family:{select:Font Family};
font-size:calc({select:Font Size} - 1px);
letter-spacing:1px;
}
/* PERMALINK LINKS */
#permalink .postinfo a{
font-family:{select:Font Family};
font-weight:700;
display:block;
float:left;
text-transform:uppercase !important;
color:{color:Text Color};
text-align:left;
line-height:40px;
}
#permalink .postinfo a:before{
font-family:'Linearicons-Free';
margin-right:5px;
color:{color:Accent Color};
}
#permalink .postinfo a:hover{
color:{color:Link Color};
}
#permalink .postinfo a:after{
content:"";
position:relative;
width:1px;
height:calc({select:Font Size} - 2px);
display:block;
float:right;
background-color:{color:Border Color};
margin-top:calc(21px - {select:Font Size}/2);
margin-left:15px;
margin-right:15px;
}
#permalink .postinfo a:last-child:after{
display:none;
}
#permalink .postinfo a.notes{
font-size:calc({select:Font Size} + 1px);
}
/* LIKE & REBLOG BUTTONS */
#permalink ul.like_and_reblog_buttons{
width:100px;
margin-top:12px !important;
list-style:none;
text-align:right;
display:block;
float:right;
}
#permalink ul.like_and_reblog_buttons li{
list-style:none;
display:inline-block;
margin:0px 0px 0px 5px;
cursor:pointer !important;
}
#permalink ul.like_and_reblog_buttons{
margin-left: -38px;
margin-bottom:-2px;
}
#permalink ul.reblog-icons{
margin-left: -38px;
}
/* CUSTOM REBLOG/LIKE BUTTONS | BY DEMIREV.CUBTHEMES.COM */
#permalink .like{
position:relative;
cursor:pointer !important;
}
#permalink .lnr-sync,
#permalink .lnr-heart{
fill:{color:Accent Color};
}
#permalink .lnr:hover{
fill:{color:Text Color};
}
#permalink .like .like_button{
position:absolute;
top:-1.5px;
opacity:0;
}
#permalink .like .like_button.liked {
opacity:1;
}
#permalink .lnr{
-webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
-ms-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}
/* TAGS */
#tags{
position:relative;
z-index:999;
width:calc({select:Post Width} - 40px);
background-color:{color:Navigation Color};
border-bottom:1px solid {color:Border Color};
text-align:left;
line-height:100%;
padding:15px 20px;
letter-spacing:0.5px;
line-height:150%;
font-family:{select:Font Family};
font-weight:400;
font-size:calc({select:Font Size} - 2px);
}
#tags a{
display:inline-block;
color:{color:Text Color};
margin-left:10px;
}
#tags a:hover{
color:{color:Link Color};
}
#tags span{
font-family:{select:Font Family};
color:{color:Text Color};
text-transform:uppercase;
display:inline-block;
font-size:calc({select:Font Size} - 3px);
line-height:calc({select:Font Size} - 3px);
font-weight:700;
letter-spacing:1px;
margin-right:-5px;
}
#tags span:before {
font-family:'Linearicons-Free';
font-size:{select:Font Size};
color:{color:Accent Color};
line-height:calc({select:Font Size} - 5px);
margin-right:5px;
display:block;
float:left;
}
/*---------------------------- PERMALINK ----------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*/
/*------------------------------ CREDIT------------------------------*/
/*--------------------- DO NOT REMOVE THE CREDIT --------------------*/
#credit{
position:fixed;
bottom:30px;
right:30px;
text-align:center;
z-index:99999;
}
#credit a{
padding:3px 3px 3px 5px;
color:{color:Text Color};
background-color:{color:Post Background Color};
border:1px solid {color:Border Color};
border-radius:3px;
text-align:center;
font-size:8px;
font-weight:400;
letter-spacing:1px;
text-transform:uppercase;
color:{color:Text Color};
}
#credit a:hover{
background-color:{color:Accent Color};
color:{color:Post Background Color};
border:1px solid {color:Accent Color};
}
/*--------------------- DO NOT REMOVE THE CREDIT --------------------*/
/*------------------------------ CREDIT------------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*/
{CustomCSS}
</style><!-- END OF CSS STYLE-->
</head>
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<body>
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<!-------------------------- START OF HEADER ------------------------->
<header>
<div id="header-content">
<div class="icon lnr lnr-{text:Avatar Icon}"></div>
<h1><a href="/">{block:IfNotTopbarTitle}{Title}{/block:IfNotTopbarTitle}{block:IfTopbarTitle}{text:Topbar Title}{/block:IfTopbarTitle}</a></h1>
<h2>{block:IfNotShortInfo}{name}.tumblr.com{/block:IfNotShortInfo}{block:IfShortInfo}{text:Short Info}{/block:IfShortInfo}</h2>
<nav class="toplinks">
{block:ifLink1Title}<a href="{text:Link 1 URL}">{text:Link 1 Title}</a>{/block:ifLink1Title}
{block:ifLink2Title}<a href="{text:Link 2 URL}">{text:Link 2 Title}</a>{/block:ifLink2Title}
{block:ifLink3Title}<a href="{text:Link 3 URL}">{text:Link 3 Title}</a>{/block:ifLink3Title}
{block:ifLink4Title}<a href="{text:Link 4 URL}">{text:Link 4 Title}</a>{/block:ifLink4Title}
{block:ifLink5Title}<a href="{text:Link 5 URL}">{text:Link 5 Title}</a>{/block:ifLink5Title}
{block:ifLink6Title}<a href="{text:Link 6 URL}">{text:Link 6 Title}</a>{/block:ifLink6Title}
</nav>
</div>
</header>
<!--------------------------- END OF HEADER -------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<!-------------------------- START OF SIDEBAR ------------------------>
<div id="sidebar">
<article class="desc">
<h1 class="lnr lnr-{text:Avatar Icon}">{text:Sidebar Title}</h1>
{block:IfSidebarImage}<img class="sideimg" src="{image:Sidebar}">{/block:IfSidebarImage}
<section>{Description}</section>
<div class="search">
<form action="/search" method="get">
<input type="text" name="q" value="" placeholder="SEARCH..." />
<input type="submit" value="" class="sbutton" />
</form>
</div><!-- SEARCH -->
</article>
{block:Pagination}
<article class="pagination">
{block:PreviousPage}<a href="{PreviousPage}" class="jump jump-prev">prev</a>{/block:PreviousPage}
{CurrentPage} of {TotalPages}
{block:NextPage}<a href="{NextPage}" class="jump jump-next">next</a>{/block:NextPage}
</article>
{/block:Pagination}
</div>
<!--------------------------- END OF SIDEBAR ------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<div id="container">
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<div id="posts">
<!-------------------------- START OF A POST ------------------------->
{block:Posts}
<div id="post">
<!------------------------- START OF PERMALINK ----------------------->
{block:Date}
<div id="permalink">
<div class="postinfo">
<a class="lnr lnr-star" href="{Permalink}" title="notes">{NoteCount}</a>
<a class="lnr lnr-clock" href="/day/{Year}/{MonthNumberWithZero}/{DayOfMonthWithZero}/" title="date">{ShortMonth} {DayOfMonthWithZero} {Year}</a>
{block:RebloggedFrom}<a class="lnr lnr-location" href="{ReblogRootURL}" target="_blank" title="{ReblogRootName}">src</a><a class="lnr lnr-enter" href="{ReblogParentURL}" target="_blank" title="{ReblogParentName}">via</a>{/block:RebloggedFrom}
</div><!-- POSTINFO -->
<ul class="like_and_reblog_buttons">
<li class="reblog-button" title="reblog">
<a href="{ReblogURL}" target="_blank"><svg class="lnr lnr-sync" width="13px" height="13px"><use xlink:href="#lnr-sync"></use></svg></a>
</li>
<li class="like" title="like">
{LikeButton size="11"}
<svg class="lnr lnr-heart" width="13px" height="13px"><use xlink:href="#lnr-heart"></use></svg>
</li>
</ul>
</div><!-- PERMALINK -->
{/block:Date}
<!-------------------------- END OF PERMALINK ------------------------>
<!-------------------------------------------------------------------->
<!-------------------------------------------------------------------->
<!-------------------------------------------------------------------->
<!------------------------ START OF POSTCONTENT ---------------------->
<div id="postcontent">
<!-------------------------------------------------------------------->
<!----------------------------- TEXT POSTS --------------------------->
{block:Text}
<div class="postbody">
{block:Title}<div class="posttitle">{Title}</div>{/block:Title}
<div class="caption" style="margin-top:0px;{block:Title}margin-top:10px{/block:Title};">{Body}</div>
</div><!-- POST BODY -->
{/block:Text}
<!----------------------------- TEXT POSTS --------------------------->
<!-------------------------------------------------------------------->
<!-------------------------------------------------------------------->
<!----------------------------- LINK POSTS --------------------------->
{block:Link}
<div class="postmedia" style="border:none;">
<a href="{Url}" target="_blank" class="link-button">
{block:Thumbnail}<img src="{Thumbnail}" width="{select:Post Width}">{/block:Thumbnail}
<div class="info-container">
{block:Host}<div class="publisher-container {block:Thumbnail}if-thumbnail{/block:Thumbnail}"><div class="publisher">{Host}</div></div>{/block:Host}
<div class="title">{Name}</div>
{block:Excerpt}<div class="excerpt">{Excerpt}</div>{/block:Excerpt}
{block:Author}<div class="author">{Author}</div>{/block:Author}
</div><!-- INFO CONTAINER -->
</a>
</div><!-- POST MEDIA -->
{block:Description}
<div class="postbody"><div class="caption">{Description}</div></div><!-- POST BODY-->
{/block:Description}
{/block:Link}
<!----------------------------- LINK POSTS --------------------------->
<!-------------------------------------------------------------------->
<!-------------------------------------------------------------------->
<!---------------------------- PHOTO POSTS --------------------------->
{block:Photo}
{LinkOpenTag}
<div class="postmedia"><img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="{select:Post Width}" style="display:block;"></div><!-- POST MEDIA -->
{LinkCloseTag}
{block:Caption}
<div class="postbody"><div class="caption">{Caption}</div></div><!-- POST BODY -->
{/block:Caption}
{/block:Photo}
<!---------------------------- PHOTO POSTS --------------------------->
<!-------------------------------------------------------------------->
<!-------------------------------------------------------------------->
<!----------------------------- PHOTOSETS ---------------------------->
{block:Photoset}
<div class="postmedia">
<div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">
{block:Photos}
<div class="photo-data">
<div class="pxu-photo">
<img src="{PhotoURL-HighRes}" width="{PhotoWidth-500}" height="{PhotoHeight-500}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}">
</div><!-- pxu-photo -->
<a class="tumblr-box" rel="post-{PostID}" href="{PhotoURL-HighRes}"></a>
</div><!-- photo-data -->
{/block:Photos}
</div><!-- photo-slideshow-->
</div><!-- postmedia -->
{block:Caption}
<div class="postbody"><div class="caption">{Caption}</div></div><!-- POST BODY ->
{/block:Caption}
{block:ContentSource}<!-- {SourceURL}
{block:SourceLogo}<img src="{BlackLogoURL}"width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}
{block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
{/block:ContentSource}
{/block:Photoset}
<!----------------------------- PHOTOSETS ---------------------------->
<!-------------------------------------------------------------------->
<!-------------------------------------------------------------------->
<!------------------------------- QUOTES ----------------------------->
{block:Quote}
<div class="postbody">
<div class="quotes"><svg class="icon icon-quote-left"><use xlink:href="#icon-quote-left"></use></svg>{Quote}<svg class="icon icon-quote-right"><use xlink:href="#icon-quote-right"></use></svg></div>
{block:Source}<div class="caption" style="margin-bottom:0px;">— {Source}</div>{/block:Source}
</div><!-- POST BODY -->
{/block:Quote}
<!------------------------------- QUOTES ----------------------------->
<!-------------------------------------------------------------------->
<!-------------------------------------------------------------------->
<!------------------------------- CHATS ------------------------------>
{block:Chat}
<div class="postbody">
{block:Title}<div class="posttitle">{Title}</div>{/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><!-- POST BODY -->
{/block:Chat}
<!------------------------------- CHATS ------------------------------>
<!-------------------------------------------------------------------->
<!-------------------------------------------------------------------->
<!------------------------------- AUDIOS ----------------------------->
{block:Audio}
<div class="postmedia" style="border:none;">
<div class="width_fix" style="margin-bottom:-5px;">{AudioEmbed-500}</div>
</div><!-- POST MEDIA -->
{block:Caption}<div class="postbody"><div class="caption">{Caption}</div></div><!-- POST BODY -->{/block:Caption}
{/block:Audio}
<!------------------------------- AUDIOS ----------------------------->
<!-------------------------------------------------------------------->
<!-------------------------------------------------------------------->
<!------------------------------- VIDEOS ----------------------------->
{block:Video}
<div class="postmedia">
<div class="video" style="margin-bottom:-5px;">{Video-500}</div>
</div><!-- POST MEDIA -->
{block:Caption}
<div class="postbody"><div class="caption">{Caption}</div></div><!-- POST BODY -->
{/block:Caption}
{/block:Video}
<!------------------------------- VIDEOS ----------------------------->
<!-------------------------------------------------------------------->
<!-------------------------------------------------------------------->
<!------------------------------ ANSWERS ----------------------------->
{block:Answer}
<div class="postbody">
<div class="askimg"><img src="{AskerPortraitURL-48}"></div>
<div class="asker"><span>{Asker}</span><br>sent a message</div>
<div class="question">{Question}</div>
<div class="caption">{Answer}</div>
</div><!-- POST BODY -->
{/block:Answer}
<!-------------------------------------------------------------------->
<!------------------------------ ANSWERS ----------------------------->
</div><!-- POSTCONTENT -->
<!------------------------- END OF POSTCONTENT ----------------------->
<!-------------------------------------------------------------------->
<!-------------------------------------------------------------------->
<!-------------------------------------------------------------------->
<!-------------------------------- TAGS ------------------------------>
{block:HasTags}
<div id="tags">
<span class="lnr lnr-bookmark">Tagged as</span> {block:Tags}<a href="{TagURL}">{Tag}</a>{/block:Tags}
</div>
{/block:HasTags}
<!-------------------------------- TAGS ------------------------------>
<!-------------------------------------------------------------------->
<!-------------------------------------------------------------------->
<!-------------------------------------------------------------------->
</div><!-- POST -->
<!--------------------------- END OF A POST ------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<!------------------------ START OF POSTNOTES ----------------------->
{block:PostNotes}
<div id="postnotes">
{PostNotes}
</div>
{/block:PostNotes}
<!------------------------- END OF POSTNOTES ------------------------>
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
{/block:Posts}<!-- END OF ALL POSTS-->
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
</div><!-- POSTS -->
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
</div><!-- CONTAINER -->
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<a href="#" class="scrollToTop">Scroll To Top</a>
<!-- DO NO REMOVE DO NOT REMOVE DO NOT REMOVE -->
<div id="credit"><a href="http://roxiestheme.tumblr.com" target="_blank">roxiestheme</a></div>
<!-- DO NO REMOVE DO NOT REMOVE DO NOT REMOVE -->
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
</body>
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<svg display="none">
<defs>
<symbol id="icon-quote-left" viewBox="0 0 33 32">
<title>quote</title>
<path class="path1" d="M16.025 19.192c-0.133-3.75-3.258-7.225-7.133-7.675-1.475-0.167-3.767 0.483-4.767 1.167-0.4 0.083-0.6 0.225-0.717-0.4 3.433-6.633 11.342-6.625 11.342-6.625v-0.917c-8.058-1.325-17.025 8.842-14.225 17 1.333 3.875 5.117 6.25 8.792 5.508 3.85-0.783 6.842-4.367 6.708-8.058zM7.925 25.9c-3.708-0.050-6.492-2.958-6.408-6.692 0.092-3.683 3.083-6.458 6.792-6.3 3.475 0.15 6.183 2.975 6.2 6.458 0.025 3.633-2.942 6.583-6.583 6.533z"></path>
<path class="path2" d="M33.025 19.192c-0.133-3.75-3.258-7.225-7.133-7.675-1.475-0.167-3.767 0.483-4.767 1.167-0.4 0.083-0.6 0.225-0.717-0.4 3.433-6.633 11.342-6.625 11.342-6.625v-0.917c-8.058-1.325-17.025 8.842-14.225 17 1.333 3.875 5.117 6.25 8.792 5.508 3.85-0.783 6.842-4.367 6.708-8.058zM24.925 25.9c-3.708-0.050-6.492-2.958-6.408-6.692 0.092-3.683 3.083-6.458 6.792-6.3 3.475 0.15 6.183 2.975 6.2 6.458 0.033 3.633-2.942 6.583-6.583 6.533z"></path>
</symbol>
<symbol id="icon-quote-right" viewBox="0 0 33 32">
<title>quote2</title>
<path class="path1" d="M17.006 12.808c0.133 3.75 3.258 7.225 7.133 7.675 1.475 0.167 3.767-0.483 4.767-1.167 0.4-0.083 0.6-0.225 0.717 0.4-3.433 6.633-11.342 6.625-11.342 6.625v0.917c8.058 1.325 17.025-8.842 14.225-17-1.333-3.875-5.117-6.25-8.792-5.508-3.85 0.783-6.842 4.367-6.708 8.058zM25.106 6.1c3.708 0.050 6.492 2.958 6.408 6.692-0.092 3.683-3.083 6.458-6.792 6.3-3.475-0.15-6.183-2.975-6.2-6.458-0.025-3.633 2.942-6.583 6.583-6.533z"></path>
<path class="path2" d="M0.006 12.808c0.133 3.75 3.258 7.225 7.133 7.675 1.475 0.167 3.767-0.483 4.767-1.167 0.4-0.083 0.6-0.225 0.717 0.4-3.433 6.633-11.342 6.625-11.342 6.625v0.917c8.058 1.325 17.025-8.842 14.225-17-1.333-3.875-5.117-6.25-8.792-5.508-3.85 0.783-6.842 4.367-6.708 8.058zM8.106 6.1c3.708 0.050 6.492 2.958 6.408 6.692-0.092 3.683-3.083 6.458-6.792 6.3-3.475-0.15-6.183-2.975-6.2-6.458-0.033-3.633 2.942-6.583 6.583-6.533z"></path>
</symbol>
</defs>
</svgs>
</html>
<html>
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<!---------------- DO NOT REMOVE THE CREDIT | DO NOT USE AS A BASE | DO NOT REPOST | DO NOT CLAIM AS YOURS ---------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<!------------------------------------------------------------------------------------------------------------------------------
>>> T H E M E B Y R O X I E <<<
Theme by Roxie | roxiestheme.tumblr.com
2016 ⓒ All Rights Reserved.
-----------------------------
SPECIAL THANKS
> PIXEL UNION | Extended photoset
> SHYTHEMES | Video width fix
> CUBTHEMES | Custom like button
> LINEARICONS | Icons
> BOOTSTRAPCDN | Linearicons-Free CSS
> ICOMOON | Custom icons
------------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<!---------------- DO NOT REMOVE THE CREDIT | DO NOT USE AS A BASE | DO NOT REPOST | DO NOT CLAIM AS YOURS ---------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<head>
<meta name="color:Background Color" content="#f6f6f6" />
<meta name="color:Post Background Color" content="#ffffff" />
<meta name="color:Navigation Color" content="#fafafa" />
<meta name="color:Header Background Color" content="#ffffff" />
<meta name="color:Border Color" content="#eeeeee" />
<meta name="color:Text Color" content="#888888" />
<meta name="color:Link Color" content="#666666" />
<meta name="color:Accent Color" content="#d1e4a8" />
<meta name="image:Sidebar" content="" />
<meta name="if:Use Avatar Image" content="0">
<meta name="select:Font Family" content="'Karla', sans-serif" title="Karla">
<meta name="select:Font Family" content="'Open Sans', sans-serif" title="Open Sans">
<meta name="select:Font Family" content="'Roboto', sans-serif" title="Roboto">
<meta name="select:Font Family" content="'Lato', sans-serif" title="Lato">
<meta name="select:Font Size" content="10px" title="10px">
<meta name="select:Font Size" content="9px" title="9px">
<meta name="select:Font Size" content="11px" title="11px">
<meta name="select:Font Size" content="12px" title="12px">
<meta name="select:Sidebar Width" content="150px" title="150px">
<meta name="select:Sidebar Width" content="200px" title="200px">
<meta name="select:Sidebar Width" content="250px" title="250px">
<meta name="select:Post Width" content="540px" title="540px">
<meta name="select:Post Width" content="400px" title="400px">
<meta name="select:Post Width" content="500px" title="500px">
<meta name="text:Avatar Icon" content="heart" />
<meta name="text:Sidebar Title" content="about" />
<meta name="text:Topbar Title" content="" />
<meta name="text:Short Info" content="" />
<meta name="text:Link 1 Title" content="index" />
<meta name="text:Link 1 Url" content="/" />
<meta name="text:Link 2 Title" content="message" />
<meta name="text:Link 2 Url" content="/ask" />
<meta name="text:Link 3 Title" content="" />
<meta name="text:Link 3 Url" content="" />
<meta name="text:Link 4 Title" content="" />
<meta name="text:Link 4 Url" content="" />
<meta name="text:Link 5 Title" content="" />
<meta name="text:Link 5 Url" content="" />
<meta name="text:Link 6 Title" content="" />
<meta name="text:Link 6 Url" content="" />
<title>{Title}</title>
<link rel="shortcut icon" href="{Favicon}">
<link rel="alternate" type="application/rss+xml" href="{RSS}">
<link href='http://static.tumblr.com/sas2ex2/HFinqriui/photoset.css' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="https://cdn.linearicons.com/free/1.0.0/icon-font.min.css">
<link href="https://fonts.googleapis.com/css?family=Karla:400,700|Lato:400,700|Open+Sans:400,700|Roboto:400,700" rel="stylesheet">
{block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
<!-------------------------------------------------------------------->
<!------------------------------ JQUERY ------------------------------>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="http://static.tumblr.com/rzl30kg/eAxm7a751/jquery.style-my-tooltips.js"></script>
<script src="http://static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
<script src="https://cdn.linearicons.com/free/1.0.0/svgembedder.min.js"></script>
<!------------------------------ JQUERY ------------------------------>
<!-------------------------------------------------------------------->
<!-------------------------------------------------------------------->
<!-------------------- FIX VIDEO WIDTH BY SHYTHEMES ------------------>
<script src ="//static.tumblr.com/fwgzvyf/Oj1o08f6h/shythemes.vr.js"></script>
<!-------------------- FIX VIDEO WIDTH BY SHYTHEMES ------------------>
<!-------------------------------------------------------------------->
<!-------------------------------------------------------------------->
<!------------------------------ SCRIPTS ----------------------------->
<script>
$(document).ready(function() {
$('.photo-slideshow').pxuPhotoset({
lightbox: true,
gutter: '4px',
borderRadius: '0px',
photoset: '.photo-slideshow',
photoWrap: '.photo-data',
photo: '.pxu-photo'
});
$("[title]").style_my_tooltips({
tip_follows_cursor:true,
tip_delay_time:100,
tip_fade_speed:300
});
//Check to see if the window is top if not then display button
$(window).scroll(function(){
if ($(this).scrollTop() > 100) {
$('.scrollToTop').fadeIn();
} else {
$('.scrollToTop').fadeOut();
}
});
//Click event to scroll to top
$('.scrollToTop').click(function(){
$('html, body').animate({scrollTop : 0},800);
return false;
});
});
</script>
<!------------------------------ SCRIPTS ----------------------------->
<!-------------------------------------------------------------------->
<style type="text/css">
/*----------------------------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*/
/*------------------------------ BASIC ------------------------------*/
html, body {
font-family:{select:Font Family};
background:{color:Background Color};
margin:0px;
padding:0px;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
/* LINKS BASIC */
a{
color:{color:Link Color};
}
a:hover{
color:{color:Accent Color};
}
a, a:hover, a:active{
text-decoration:none;
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}
/* LIST BASIC */
ul, menu, dir{
margin:0px !important;
padding:0px !important;
-webkit-margin-before:0px !important;
-webkit-margin-after:0px !important;
-webkit-margin-start:0px !important;
-webkit-margin-end:0px!important;
-webkit-padding-start:0px !important;
}
/* TOOLTIPS */
#s-m-t-tooltip{
position:absolute;
z-index:9999999;
margin-top:5px;
margin-left:10px;
display:block;
padding:5px 8px;
background-color:{color:Text Color};
font-family:{select:Font Family};
font-size:8px;
color:{color:Post Background Color};
letter-spacing:1px;
text-transform:uppercase;
}
/* SCROLL BAR */
::-webkit-scrollbar-thumb {
width:5px;
border:1px solid {color:Border Color};
border-right:none;
background-color:{color:Navigation Color};
}
::-webkit-scrollbar {
width:5px;
border-left:1px solid {color:Border Color};
border-right:4px solid {color:Post Background Color};
background-color:{color:Post Background Color};
}
/* SELECTION */
::-moz-selection { /* Code for Firefox */
color:{color:Post Background Color};
background-color:{color:Text Color};
}
::selection {
color:{color:Post Background Color};
background-color:{color:Text Color};
}
/* TUMBLR CONTROLS */
.tmblr-iframe-compact .tmblr-iframe--unified-controls {
z-index:999999;
position:fixed;
top:10px;
right:calc(50% - {select:Sidebar Width}/2 - {select:Post Width}/2 - 23px);
vertical-align:middle;
white-space:nowrap !important;
opacity:0.2;
-webkit-filter: invert(100%);
-moz-filter: invert(100%);
-o-filter: invert(100%);
-ms-filter: invert(100%);
filter: invert(100%);
-webkit-transform: scale(0.6);
-webkit-transform-origin: top right;
-moz-transform: scale(0.6);
-moz-transform-origin: top right;
-o-transform: scale(0.6);
-o-transform-origin: top right;
-ms-transform: scale(0.6);
-ms-transform-origin: top right;
transform: scale(0.6);
transform-origin: top right;
}
/* SCROLL TO TOP */
.scrollToTop{
font-size:8px;
font-weight:400;
text-align:center;
width:72px;
color:{color:Text Color};
text-transform:uppercase;
text-decoration:none;
position:fixed;
bottom:50px;
right:30px;
letter-spacing:1px;
display:none;
z-index:9999;
}
.scrollToTop:hover{
color:{color:Link Color};
text-decoration:none;
}
/*------------------------------ BASIC ------------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*
/*----------------------------- HEADER -----------------------------*/
/* HEADER BASIC */
header{
position:fixed;
top:0px;
left:0px;
width:100%;
height:80px;
overflow:hidden;
background-color:{color:Navigation Color};
border:1px solid {color:Border Color};
border-left:none;
z-index:9999;
}
/* HEADER CONTENT */
header #header-content{
position:absolute;
left:calc(50% - {select:Sidebar Width}/2 - {select:Post Width}/2 - 16px);
width:calc({select:Sidebar Width} + {select:Post Width} + 32px);
height:50px;
}
header #header-content:before{
content:'';
position:absolute;
top:39.5px;
display:block;
width:calc({select:Sidebar Width} + {select:Post Width} + 32px);
height:1px;
background-color:{color:Border Color};
}
/* AVATAR */
header #header-content .icon{
position:relative;
z-index:99999;
float:left;
margin:15px 10px 0px 0px;
display:block;
border-radius:50%;
width:50px;
height:50px;
text-align:center;
background-color:{color:Accent Color};
{block:ifUseAvatarImage}
background-image:url('{PortraitURL-64}');
background-size:50px 50px;
{/block:ifUseAvatarImage}
}
header #header-content .icon:before{
font-family:'Linearicons-Free';
font-size:20px;
font-weight:bold;
margin-left:2px;
line-height:50px;
color:{color:Post Background Color};
{block:ifUseAvatarImage}
display:none;
{/block:ifUseAvatarImage}
}
/* TITLE */
header #header-content h1{
font-size:13px;
font-weight:700;
letter-spacing:-0.5px;
margin:18px 0px 0px 0px;
}
header #header-content h1 a{
color:{color:Text Color};
}
header #header-content h1 a:hover{
color:{color:Link Color};
cursor:help;
}
header #header-content h2{
color:{color:Text Color};
font-size:8px;
font-weight:400;
text-transform:uppercase;
letter-spacing:1px;
margin:15px 0px 0px 0px;
}
/* NAVIGATION */
header #header-content nav.toplinks{
position:absolute;
right:0px;
bottom:-10px;
overflow:hidden;
width:calc({select:Sidebar Width} + {select:Post Width} - 28px);
text-align:right;
}
header #header-content nav.toplinks a{
display:inline-block;
text-transform:uppercase;
font-size:8.5px;
letter-spacing:1.5px;
margin-left:20px;
padding-top:7px;
color:{color:Text Color};
border-top:1px solid transparent;
}
header #header-content nav.toplinks a:hover{
border-top:1px solid {color:Accent Color};
color:{color:Link Color};
}
/*----------------------------- HEADER -----------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*/
/*---------------------------- CONTAINER ----------------------------*/
#container{
position:relative;
overflow:hidden;
top:81px;
left:calc(50% - {select:Sidebar Width}/2 - {select:Post Width}/2 - 16px);
width:calc({select:Sidebar Width} + {select:Post Width} + 32px);
margin:30px 0px;
display:block;
background-color:{color:Background Color};
}
/*---------------------------- CONTAINER ----------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*/
/*----------------------------- SIDEBAR -----------------------------*/
#sidebar{
width:{select:Sidebar Width};
position:fixed;
z-index:999;
top:111px;
left:calc(50% - {select:Sidebar Width}/2 - {select:Post Width}/2 - 16px);
}
#sidebar article{
display:block;
overflow:hidden;
border:1px solid {color:Border Color};
background-color:{color:Navigation Color};
border-radius:3px;
}
/* SIDEBAR TITLE */
#sidebar article.desc h1{
background-color:{color:Navigation Color};
display:block;
height:30px;
margin:0px;
border-bottom:1px solid {color:Border Color};
color:{color:Text Color};
font-family:{select:Font Family};
font-weight:700;
font-size:12px;
line-height:30px;
text-transform:capitalize;
letter-spacing:-0.5px;
}
#sidebar article.desc h1:before{
font-family:'Linearicons-Free';
font-size:10px;
display:block;
float:left;
margin:6px;
width:18px;
height:18px;
border-radius:3px;
text-align:center;
line-height:18px;
background-color:{color:Accent Color};
color:{color:Post Background Color};
}
/* SIDE IMAGE */
#sidebar article.desc img.sideimg{
display:block;
width:100%;
border-bottom:1px solid {color:Border Color};
}
/* DESCRIPTION */
#sidebar article.desc section{
display:block;
padding:15px;
font-size:10px;
color:{color:Text Color};
}
/* SEARCH BAR */
#sidebar .search{
margin:0px 15px 15px 15px;
display:block;
width:calc({select:Sidebar Width} - 30px);
height:25px;
overflow:hidden;
border-radius:3px;
border:1px solid {color:Border Color};
z-index:999999;
background-color:{color:Post Background Color};
}
#sidebar .search input{
display:block;
width:calc({select:Sidebar Width} - 57px);
height:25px;
padding:0px 10px;
background-color:transparent;
border:none;
outline:none;
font-family:{select:Font Family};
font-size:{select:Font Size} !important;
font-weight:400 !important;
color:{color:Text Color} !important;
}
#sidebar .search input.sbutton{
position:absolute;
margin-top:-25px;
margin-left:calc({select:Sidebar Width} - 55px);
cursor:pointer;
padding:0px;
display:block;
width:25px;
height:25px;
outline:none;
border:none;
border-left:1px solid {color:Border Color};
font-family:'Linearicons-Free';
text-align:center;
line-height:27px;
font-size:calc({select:Font Size} + 2px) !important;
font-weight:normal;
background:{color:Navigation Color};
z-index:9;
}
::-webkit-input-placeholder{color:{color:Text Color};opacity:0.5;
letter-spacing:1px;}
::-moz-input-placeholder{color:{color:Text Color};opacity:0.5;
letter-spacing:1px;}
::-o-input-placeholder{color:{color:Text Color};opacity:0.5;
letter-spacing:1px;}
::-ms-input-placeholder{color:{color:Text Color};opacity:0.5;
letter-spacing:1px;}
/* PAGINATION */
#sidebar article.pagination{
margin:10px 0px 0px 0px;
display:block;
height:30px;
text-transform:uppercase;
text-align:center;
font-size:9px;
line-height:30px;
background-color:{color:Post Background Color};
color:{color:Text Color};
}
#sidebar article.pagination a{
display:inline-block;
color:{color:Text Color};
}
#sidebar article.pagination a:hover{
color:{color:Link Color};
}
#sidebar article.pagination a.jump{
width:calc({select:Sidebar Width}/3 - 15px);
height:30px;
background-color:{color:Navigation Color};
text-align:center;
display:block;
text-transform:uppercase;
}
#sidebar article.pagination a.jump-prev{
float:left;
border-right:1px solid {color:Border Color};
}
#sidebar article.pagination a.jump-next{
float:right;
border-left:1px solid {color:Border Color};
}
/*----------------------------- SIDEBAR -----------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*/
/*------------------------------ POSTS ------------------------------*/
#posts{
position:relative;
margin-left:calc({select:Sidebar Width} + 30px);
width:calc({select:Post Width} + 2px);
}
/* SINGLE POST */
#post{
overflow:hidden;
width:{select:Post Width};
border:1px solid {color:Border Color};
border-bottom:none;
border-radius:3px;
margin:0px 0px 30px 0px;
}
#post:last-child{
margin:0px;
}
/* POSTCONTENT BASIC */
#postcontent{
background-color:{color:Post Background Color};
font-family:{select:Font Family};
font-weight:400;
font-size:{select:Font Size};
color:{color:Text Color};
width:{select:Post Width};
text-align:justify;
line-height:150%;
}
/* POST MEDIA */
#postcontent .postmedia{
width:{select:Post Width};
border-bottom:1px solid {color:Border Color};
overflow:hidden;
display:block;
}
#postcontent .postmedia .width_fix iframe{
width:calc({select:Post Width} + 2px) !important;
margin-top:-1px;
margin-left:-1px;
}
/* POST BODY */
#postcontent .postbody{
width:calc({select:Post Width} - 40px);
border-bottom:1px solid {color:Border Color};
padding:20px;
}
#postcontent .postbody a{
background-image: linear-gradient(180deg,rgba(68,68,68,0) 50%,rgba(68,68,68,.1) 0);
text-decoration: none;
background-repeat: repeat-x;
background-size: 1em 2px;
background-position: 0 1.15em;
padding-bottom: 2px;
}
#postcontent .postbody a:hover{
color:{color:Text Color};
}
/* POST IMAGES */
#postcontent .postbody img{
max-width:100%;
height:auto;
}
/* FIX IMAGE FIGURE */
#postcontent .postbody figure{
margin-top:10px;
max-width:100%;
height:auto;
}
#postcontent .postbody figure.tumblr-full img{
width:{select:Post Width};
}
/* POST TITLE */
#postcontent .posttitle{
font-family:{select:Font Family};
font-weight:400;
font-size:28px;
letter-spacing:0px;
text-align:justify;
line-height:120%;
margin-top:-10px;
color:{color:Text Color};
}
/* BLOCKQUOTE */
#postcontent blockquote{
width:calc(100% - 11px);
max-width:calc(100% - 11px);
margin-left:0px;
padding-left:10px;
border-left:1px solid {color:Accent Color};
}
/* TEXTS */
#postcontent .postbody p{
margin-top:3px;
}
#postcontent .postbody p:first-child{
margin-top:0px;
}
#postcontent .postbody big{
font-size:13px;
}
#postcontent .postbody small{
font-size:8px;
}
/* HIGHLIGHT */
#postcontent .postbody h2{
font-family:{select:Font Family};
font-weight:400;
font-size:20px;
color:{color:Text Color};
margin-bottom:15px;
}
/* LIST */
#postcontent .postbody ol{
margin:0px 0px 10px -15px !important;
}
#postcontent .postbody ul{
list-style-type:none;
margin:0px 0px 10px 5px !important;
}
#postcontent .postbody ul li:before{
display:block;
float:left;
margin-right:5px;
font-family:'Linearicons-Free';
font-size:calc({select:Font Size} - 3px);
content:'\e870';
}
#postcontent .postbody .caption{
margin-bottom:-10px;
}
/* LINK POSTS */
#postcontent .link-button{
border-bottom:1px solid {color:Border Color};
word-break:break-word;
overflow:hidden;
display:block;
position:relative;
text-decoration:none;
}
#postcontent .info-container{
padding:20px 20px 0;
overflow:hidden;
}
#postcontent .publisher-container{
margin-top:-4px;
margin-bottom:17px;
display:block;
font-size:13px;
line-height:16px;
font-weight:700;
word-break:break-all;
}
#postcontent .publisher-container .publisher{
line-height:16px;
font-size:7px;
font-weight:700;
color:{color:Text Color};
text-transform:uppercase;
letter-spacing:2px;
display:inline-block;
margin:0px;
}
#postcontent .publisher-container.if-thumbnail{
position:absolute;
top:20px;
left:20px;
right:20px;
}
#postcontent .publisher-container.if-thumbnail .publisher{
color:{color:Post Background Color};
text-shadow:1px 1px 0px rgba(0,0,0,0.3);
}
#postcontent .info-container{
padding:20px 20px 0;
overflow:hidden;
color:{color:Text Color};
}
#postcontent .info-container .title{
margin-top:-5px;
margin-bottom:10px;
display:block;
font-family:{select:Font Family};
font-size:calc({select:Font Size} + 8px);
font-weight:700;
letter-spacing:0px;
line-height:calc({select:Font Size} + 10px);
}
#postcontent .info-container .title:after{
display:inline-block;
font-size:calc({select:Font Size} + 3px);
line-height:calc({select:Font Size} + 1px);
margin-left:5px;
white-space:nowrap;
font-family:'Linearicons-Free';
font-weight:bold;
content: "\e876";
}
#postcontent .info-container .excerpt{
margin-top:-2px;
margin-bottom:10px;
display:block;
font-size:{select:Font Size};
line-height:calc({select:Font Size} + 3px);
}
#postcontent .info-container .author{
margin-top:-3px;
margin-bottom:15px;
display:block;
font-size:calc({select:Font Size} - 2px);
font-weight:400;
letter-spacing:0.5px;
line-height:calc({select:Font Size} + 2px);
opacity:0.5;
}
/* QUOTES */
#postcontent .quotes{
font-family:{select:Font Family};
font-weight:400;
font-size:calc({select:Font Size} + 15px);
letter-spacing:-1px;
line-height:130%;
margin-top:-5px;
margin-bottom:10px;
color:{color:Text Color};
}
#postcontent .icon-quote-left,
#postcontent .icon-quote-right{
display:inline-block;
width:calc({select:Font Size} + 10px);
height:calc({select:Font Size} + 10px);
fill:{color:Text Color};
}
#postcontent .icon-quote-left{
margin-right:8px;
}
#postcontent .icon-quote-right{
margin-left:8px;
}
/* ASKS */
#postcontent .asker{
font-size:calc({select:Font Size} - 3px);
text-transform:uppercase;
text-align:left;
line-height:110%;
margin-top:2px;
color:{color:Text Color};
letter-spacing:2px;
}
#postcontent .asker span{
font-family:{select:Font Family};
font-weight:400;
text-transform:uppercase;
font-size:calc({select:Font Size} + 2px);
line-height:110%;
letter-spacing:1px;
}
#postcontent .asker a{
background-image:none;
color:{color:Link Color};
font-family:{select:Font Family};
font-weight:400;
text-transform:uppercase;
font-size:calc({select:Font Size} + 2px);
line-height:110%;
letter-spacing:1px;
}
#postcontent .asker a:hover{
color:{color:Text Color};
}
#postcontent .askimg img{
width:calc({select:Font Size} + 15px);
height:calc({select:Font Size} + 15px);
margin-right:10px;
border-radius:50%;
float:left;
}
#postcontent .question{
width:465px;
margin-top:-5px;
margin-left:12px;
margin-bottom:15px;
padding:20px 0px 0px 20px;
border-left:1px solid {color:Border Color};
}
/* CHATS */
#postcontent ul.chat{
margin-bottom:0px !important;
overflow:hidden;
border:1px solid {color:Border Color};
border-bottom:none;
text-align:left;
}
#postcontent ul.chat{
list-style:none !important;
margin-left:0px !important;
}
#postcontent ul.chat li{
display:block;
min-height:25px;
line-height:25px;
font-size:calc({select:Font Size} + 1px);
font-weight:400 !important;
letter-spacing:1px;
color:{color:Text Color};
padding:0px 10px;
border-bottom:1px solid {color:Border Color};
}
#postcontent ul.chat li:before{
display:none;
}
#postcontent span.label{
display:block;
float:left;
height:25px;
border-right:1px solid {color:Border Color};
border-bottom:1px solid {color:Border Color};
background-color:{color:Post Background Color};
font-size:calc({select:Font Size} - 1px);
font-weight:700;
text-transform:uppercase;
letter-spacing:2px;
margin-left:-10px;
margin-right:5px;
padding:0px 3px 0px 10px;
color:{color:Text Color};
}
#postcontent span.label:after{
content:'';
position:absolute;
float:right;
margin-left:-5px;
width:4px;
height:25px;
background-color:{color:Post Background Color};
}
/* POSTNOTES */
#postnotes{
width:calc({select:Post Width} - 40px);
padding:0px 20px;
margin:30px 0px 0px 0px;
border-radius:3px;
border:1px solid {color:Border Color};
color:{color:Text Color};
background:{color:Post Background Color};
font-size:calc({select:Font Size} - 2px);
text-align:justify;
line-height:150%;
letter-spacing:1px;
text-transform:uppercase;
font-family:{select:Font Family};
}
#postnotes ol.notes{
padding:0px;
margin:20px 0px;
list-style-type:none;
}
#postnotes ol.notes li.note{
padding:10px 0px;
}
#postnotes ol.notes li.note img.avatar{
vertical-align:-4px;
margin-right:10px;
width:16px;
height:16px;
border-radius:50%;
}
/*------------------------------ POSTS ------------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*/
/*---------------------------- PERMALINK ----------------------------*/
#permalink{
position:relative;
display:block;
z-index:999;
background-color:{color:Navigation Color};
width:calc({select:Post Width} - 40px);
height:40px;
padding:0px 20px;
border-bottom:1px solid {color:Border Color};
overflow:hidden;
text-align:left;
font-family:{select:Font Family};
font-size:calc({select:Font Size} - 1px);
letter-spacing:1px;
}
/* PERMALINK LINKS */
#permalink .postinfo a{
font-family:{select:Font Family};
font-weight:700;
display:block;
float:left;
text-transform:uppercase !important;
color:{color:Text Color};
text-align:left;
line-height:40px;
}
#permalink .postinfo a:before{
font-family:'Linearicons-Free';
margin-right:5px;
color:{color:Accent Color};
}
#permalink .postinfo a:hover{
color:{color:Link Color};
}
#permalink .postinfo a:after{
content:"";
position:relative;
width:1px;
height:calc({select:Font Size} - 2px);
display:block;
float:right;
background-color:{color:Border Color};
margin-top:calc(21px - {select:Font Size}/2);
margin-left:15px;
margin-right:15px;
}
#permalink .postinfo a:last-child:after{
display:none;
}
#permalink .postinfo a.notes{
font-size:calc({select:Font Size} + 1px);
}
/* LIKE & REBLOG BUTTONS */
#permalink ul.like_and_reblog_buttons{
width:100px;
margin-top:12px !important;
list-style:none;
text-align:right;
display:block;
float:right;
}
#permalink ul.like_and_reblog_buttons li{
list-style:none;
display:inline-block;
margin:0px 0px 0px 5px;
cursor:pointer !important;
}
#permalink ul.like_and_reblog_buttons{
margin-left: -38px;
margin-bottom:-2px;
}
#permalink ul.reblog-icons{
margin-left: -38px;
}
/* CUSTOM REBLOG/LIKE BUTTONS | BY DEMIREV.CUBTHEMES.COM */
#permalink .like{
position:relative;
cursor:pointer !important;
}
#permalink .lnr-sync,
#permalink .lnr-heart{
fill:{color:Accent Color};
}
#permalink .lnr:hover{
fill:{color:Text Color};
}
#permalink .like .like_button{
position:absolute;
top:-1.5px;
opacity:0;
}
#permalink .like .like_button.liked {
opacity:1;
}
#permalink .lnr{
-webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
-ms-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}
/* TAGS */
#tags{
position:relative;
z-index:999;
width:calc({select:Post Width} - 40px);
background-color:{color:Navigation Color};
border-bottom:1px solid {color:Border Color};
text-align:left;
line-height:100%;
padding:15px 20px;
letter-spacing:0.5px;
line-height:150%;
font-family:{select:Font Family};
font-weight:400;
font-size:calc({select:Font Size} - 2px);
}
#tags a{
display:inline-block;
color:{color:Text Color};
margin-left:10px;
}
#tags a:hover{
color:{color:Link Color};
}
#tags span{
font-family:{select:Font Family};
color:{color:Text Color};
text-transform:uppercase;
display:inline-block;
font-size:calc({select:Font Size} - 3px);
line-height:calc({select:Font Size} - 3px);
font-weight:700;
letter-spacing:1px;
margin-right:-5px;
}
#tags span:before {
font-family:'Linearicons-Free';
font-size:{select:Font Size};
color:{color:Accent Color};
line-height:calc({select:Font Size} - 5px);
margin-right:5px;
display:block;
float:left;
}
/*---------------------------- PERMALINK ----------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*/
/*------------------------------ CREDIT------------------------------*/
/*--------------------- DO NOT REMOVE THE CREDIT --------------------*/
#credit{
position:fixed;
bottom:30px;
right:30px;
text-align:center;
z-index:99999;
}
#credit a{
padding:3px 3px 3px 5px;
color:{color:Text Color};
background-color:{color:Post Background Color};
border:1px solid {color:Border Color};
border-radius:3px;
text-align:center;
font-size:8px;
font-weight:400;
letter-spacing:1px;
text-transform:uppercase;
color:{color:Text Color};
}
#credit a:hover{
background-color:{color:Accent Color};
color:{color:Post Background Color};
border:1px solid {color:Accent Color};
}
/*--------------------- DO NOT REMOVE THE CREDIT --------------------*/
/*------------------------------ CREDIT------------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*/
{CustomCSS}
</style><!-- END OF CSS STYLE-->
</head>
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<body>
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<!-------------------------- START OF HEADER ------------------------->
<header>
<div id="header-content">
<div class="icon lnr lnr-{text:Avatar Icon}"></div>
<h1><a href="/">{block:IfNotTopbarTitle}{Title}{/block:IfNotTopbarTitle}{block:IfTopbarTitle}{text:Topbar Title}{/block:IfTopbarTitle}</a></h1>
<h2>{block:IfNotShortInfo}{name}.tumblr.com{/block:IfNotShortInfo}{block:IfShortInfo}{text:Short Info}{/block:IfShortInfo}</h2>
<nav class="toplinks">
{block:ifLink1Title}<a href="{text:Link 1 URL}">{text:Link 1 Title}</a>{/block:ifLink1Title}
{block:ifLink2Title}<a href="{text:Link 2 URL}">{text:Link 2 Title}</a>{/block:ifLink2Title}
{block:ifLink3Title}<a href="{text:Link 3 URL}">{text:Link 3 Title}</a>{/block:ifLink3Title}
{block:ifLink4Title}<a href="{text:Link 4 URL}">{text:Link 4 Title}</a>{/block:ifLink4Title}
{block:ifLink5Title}<a href="{text:Link 5 URL}">{text:Link 5 Title}</a>{/block:ifLink5Title}
{block:ifLink6Title}<a href="{text:Link 6 URL}">{text:Link 6 Title}</a>{/block:ifLink6Title}
</nav>
</div>
</header>
<!--------------------------- END OF HEADER -------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<!-------------------------- START OF SIDEBAR ------------------------>
<div id="sidebar">
<article class="desc">
<h1 class="lnr lnr-{text:Avatar Icon}">{text:Sidebar Title}</h1>
{block:IfSidebarImage}<img class="sideimg" src="{image:Sidebar}">{/block:IfSidebarImage}
<section>{Description}</section>
<div class="search">
<form action="/search" method="get">
<input type="text" name="q" value="" placeholder="SEARCH..." />
<input type="submit" value="" class="sbutton" />
</form>
</div><!-- SEARCH -->
</article>
{block:Pagination}
<article class="pagination">
{block:PreviousPage}<a href="{PreviousPage}" class="jump jump-prev">prev</a>{/block:PreviousPage}
{CurrentPage} of {TotalPages}
{block:NextPage}<a href="{NextPage}" class="jump jump-next">next</a>{/block:NextPage}
</article>
{/block:Pagination}
</div>
<!--------------------------- END OF SIDEBAR ------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<div id="container">
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<div id="posts">
<!-------------------------- START OF A POST ------------------------->
{block:Posts}
<div id="post">
<!------------------------- START OF PERMALINK ----------------------->
{block:Date}
<div id="permalink">
<div class="postinfo">
<a class="lnr lnr-star" href="{Permalink}" title="notes">{NoteCount}</a>
<a class="lnr lnr-clock" href="/day/{Year}/{MonthNumberWithZero}/{DayOfMonthWithZero}/" title="date">{ShortMonth} {DayOfMonthWithZero} {Year}</a>
{block:RebloggedFrom}<a class="lnr lnr-location" href="{ReblogRootURL}" target="_blank" title="{ReblogRootName}">src</a><a class="lnr lnr-enter" href="{ReblogParentURL}" target="_blank" title="{ReblogParentName}">via</a>{/block:RebloggedFrom}
</div><!-- POSTINFO -->
<ul class="like_and_reblog_buttons">
<li class="reblog-button" title="reblog">
<a href="{ReblogURL}" target="_blank"><svg class="lnr lnr-sync" width="13px" height="13px"><use xlink:href="#lnr-sync"></use></svg></a>
</li>
<li class="like" title="like">
{LikeButton size="11"}
<svg class="lnr lnr-heart" width="13px" height="13px"><use xlink:href="#lnr-heart"></use></svg>
</li>
</ul>
</div><!-- PERMALINK -->
{/block:Date}
<!-------------------------- END OF PERMALINK ------------------------>
<!-------------------------------------------------------------------->
<!-------------------------------------------------------------------->
<!-------------------------------------------------------------------->
<!------------------------ START OF POSTCONTENT ---------------------->
<div id="postcontent">
<!-------------------------------------------------------------------->
<!----------------------------- TEXT POSTS --------------------------->
{block:Text}
<div class="postbody">
{block:Title}<div class="posttitle">{Title}</div>{/block:Title}
<div class="caption" style="margin-top:0px;{block:Title}margin-top:10px{/block:Title};">{Body}</div>
</div><!-- POST BODY -->
{/block:Text}
<!----------------------------- TEXT POSTS --------------------------->
<!-------------------------------------------------------------------->
<!-------------------------------------------------------------------->
<!----------------------------- LINK POSTS --------------------------->
{block:Link}
<div class="postmedia" style="border:none;">
<a href="{Url}" target="_blank" class="link-button">
{block:Thumbnail}<img src="{Thumbnail}" width="{select:Post Width}">{/block:Thumbnail}
<div class="info-container">
{block:Host}<div class="publisher-container {block:Thumbnail}if-thumbnail{/block:Thumbnail}"><div class="publisher">{Host}</div></div>{/block:Host}
<div class="title">{Name}</div>
{block:Excerpt}<div class="excerpt">{Excerpt}</div>{/block:Excerpt}
{block:Author}<div class="author">{Author}</div>{/block:Author}
</div><!-- INFO CONTAINER -->
</a>
</div><!-- POST MEDIA -->
{block:Description}
<div class="postbody"><div class="caption">{Description}</div></div><!-- POST BODY-->
{/block:Description}
{/block:Link}
<!----------------------------- LINK POSTS --------------------------->
<!-------------------------------------------------------------------->
<!-------------------------------------------------------------------->
<!---------------------------- PHOTO POSTS --------------------------->
{block:Photo}
{LinkOpenTag}
<div class="postmedia"><img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="{select:Post Width}" style="display:block;"></div><!-- POST MEDIA -->
{LinkCloseTag}
{block:Caption}
<div class="postbody"><div class="caption">{Caption}</div></div><!-- POST BODY -->
{/block:Caption}
{/block:Photo}
<!---------------------------- PHOTO POSTS --------------------------->
<!-------------------------------------------------------------------->
<!-------------------------------------------------------------------->
<!----------------------------- PHOTOSETS ---------------------------->
{block:Photoset}
<div class="postmedia">
<div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">
{block:Photos}
<div class="photo-data">
<div class="pxu-photo">
<img src="{PhotoURL-HighRes}" width="{PhotoWidth-500}" height="{PhotoHeight-500}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}">
</div><!-- pxu-photo -->
<a class="tumblr-box" rel="post-{PostID}" href="{PhotoURL-HighRes}"></a>
</div><!-- photo-data -->
{/block:Photos}
</div><!-- photo-slideshow-->
</div><!-- postmedia -->
{block:Caption}
<div class="postbody"><div class="caption">{Caption}</div></div><!-- POST BODY ->
{/block:Caption}
{block:ContentSource}<!-- {SourceURL}
{block:SourceLogo}<img src="{BlackLogoURL}"width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}
{block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
{/block:ContentSource}
{/block:Photoset}
<!----------------------------- PHOTOSETS ---------------------------->
<!-------------------------------------------------------------------->
<!-------------------------------------------------------------------->
<!------------------------------- QUOTES ----------------------------->
{block:Quote}
<div class="postbody">
<div class="quotes"><svg class="icon icon-quote-left"><use xlink:href="#icon-quote-left"></use></svg>{Quote}<svg class="icon icon-quote-right"><use xlink:href="#icon-quote-right"></use></svg></div>
{block:Source}<div class="caption" style="margin-bottom:0px;">— {Source}</div>{/block:Source}
</div><!-- POST BODY -->
{/block:Quote}
<!------------------------------- QUOTES ----------------------------->
<!-------------------------------------------------------------------->
<!-------------------------------------------------------------------->
<!------------------------------- CHATS ------------------------------>
{block:Chat}
<div class="postbody">
{block:Title}<div class="posttitle">{Title}</div>{/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><!-- POST BODY -->
{/block:Chat}
<!------------------------------- CHATS ------------------------------>
<!-------------------------------------------------------------------->
<!-------------------------------------------------------------------->
<!------------------------------- AUDIOS ----------------------------->
{block:Audio}
<div class="postmedia" style="border:none;">
<div class="width_fix" style="margin-bottom:-5px;">{AudioEmbed-500}</div>
</div><!-- POST MEDIA -->
{block:Caption}<div class="postbody"><div class="caption">{Caption}</div></div><!-- POST BODY -->{/block:Caption}
{/block:Audio}
<!------------------------------- AUDIOS ----------------------------->
<!-------------------------------------------------------------------->
<!-------------------------------------------------------------------->
<!------------------------------- VIDEOS ----------------------------->
{block:Video}
<div class="postmedia">
<div class="video" style="margin-bottom:-5px;">{Video-500}</div>
</div><!-- POST MEDIA -->
{block:Caption}
<div class="postbody"><div class="caption">{Caption}</div></div><!-- POST BODY -->
{/block:Caption}
{/block:Video}
<!------------------------------- VIDEOS ----------------------------->
<!-------------------------------------------------------------------->
<!-------------------------------------------------------------------->
<!------------------------------ ANSWERS ----------------------------->
{block:Answer}
<div class="postbody">
<div class="askimg"><img src="{AskerPortraitURL-48}"></div>
<div class="asker"><span>{Asker}</span><br>sent a message</div>
<div class="question">{Question}</div>
<div class="caption">{Answer}</div>
</div><!-- POST BODY -->
{/block:Answer}
<!-------------------------------------------------------------------->
<!------------------------------ ANSWERS ----------------------------->
</div><!-- POSTCONTENT -->
<!------------------------- END OF POSTCONTENT ----------------------->
<!-------------------------------------------------------------------->
<!-------------------------------------------------------------------->
<!-------------------------------------------------------------------->
<!-------------------------------- TAGS ------------------------------>
{block:HasTags}
<div id="tags">
<span class="lnr lnr-bookmark">Tagged as</span> {block:Tags}<a href="{TagURL}">{Tag}</a>{/block:Tags}
</div>
{/block:HasTags}
<!-------------------------------- TAGS ------------------------------>
<!-------------------------------------------------------------------->
<!-------------------------------------------------------------------->
<!-------------------------------------------------------------------->
</div><!-- POST -->
<!--------------------------- END OF A POST ------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<!------------------------ START OF POSTNOTES ----------------------->
{block:PostNotes}
<div id="postnotes">
{PostNotes}
</div>
{/block:PostNotes}
<!------------------------- END OF POSTNOTES ------------------------>
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
{/block:Posts}<!-- END OF ALL POSTS-->
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
</div><!-- POSTS -->
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
</div><!-- CONTAINER -->
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<a href="#" class="scrollToTop">Scroll To Top</a>
<!-- DO NO REMOVE DO NOT REMOVE DO NOT REMOVE -->
<div id="credit"><a href="http://roxiestheme.tumblr.com" target="_blank">roxiestheme</a></div>
<!-- DO NO REMOVE DO NOT REMOVE DO NOT REMOVE -->
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
</body>
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<!----------------------------------------------------------------------------------------------------------------------------->
<svg display="none">
<defs>
<symbol id="icon-quote-left" viewBox="0 0 33 32">
<title>quote</title>
<path class="path1" d="M16.025 19.192c-0.133-3.75-3.258-7.225-7.133-7.675-1.475-0.167-3.767 0.483-4.767 1.167-0.4 0.083-0.6 0.225-0.717-0.4 3.433-6.633 11.342-6.625 11.342-6.625v-0.917c-8.058-1.325-17.025 8.842-14.225 17 1.333 3.875 5.117 6.25 8.792 5.508 3.85-0.783 6.842-4.367 6.708-8.058zM7.925 25.9c-3.708-0.050-6.492-2.958-6.408-6.692 0.092-3.683 3.083-6.458 6.792-6.3 3.475 0.15 6.183 2.975 6.2 6.458 0.025 3.633-2.942 6.583-6.583 6.533z"></path>
<path class="path2" d="M33.025 19.192c-0.133-3.75-3.258-7.225-7.133-7.675-1.475-0.167-3.767 0.483-4.767 1.167-0.4 0.083-0.6 0.225-0.717-0.4 3.433-6.633 11.342-6.625 11.342-6.625v-0.917c-8.058-1.325-17.025 8.842-14.225 17 1.333 3.875 5.117 6.25 8.792 5.508 3.85-0.783 6.842-4.367 6.708-8.058zM24.925 25.9c-3.708-0.050-6.492-2.958-6.408-6.692 0.092-3.683 3.083-6.458 6.792-6.3 3.475 0.15 6.183 2.975 6.2 6.458 0.033 3.633-2.942 6.583-6.583 6.533z"></path>
</symbol>
<symbol id="icon-quote-right" viewBox="0 0 33 32">
<title>quote2</title>
<path class="path1" d="M17.006 12.808c0.133 3.75 3.258 7.225 7.133 7.675 1.475 0.167 3.767-0.483 4.767-1.167 0.4-0.083 0.6-0.225 0.717 0.4-3.433 6.633-11.342 6.625-11.342 6.625v0.917c8.058 1.325 17.025-8.842 14.225-17-1.333-3.875-5.117-6.25-8.792-5.508-3.85 0.783-6.842 4.367-6.708 8.058zM25.106 6.1c3.708 0.050 6.492 2.958 6.408 6.692-0.092 3.683-3.083 6.458-6.792 6.3-3.475-0.15-6.183-2.975-6.2-6.458-0.025-3.633 2.942-6.583 6.583-6.533z"></path>
<path class="path2" d="M0.006 12.808c0.133 3.75 3.258 7.225 7.133 7.675 1.475 0.167 3.767-0.483 4.767-1.167 0.4-0.083 0.6-0.225 0.717 0.4-3.433 6.633-11.342 6.625-11.342 6.625v0.917c8.058 1.325 17.025-8.842 14.225-17-1.333-3.875-5.117-6.25-8.792-5.508-3.85 0.783-6.842 4.367-6.708 8.058zM8.106 6.1c3.708 0.050 6.492 2.958 6.408 6.692-0.092 3.683-3.083 6.458-6.792 6.3-3.475-0.15-6.183-2.975-6.2-6.458-0.033-3.633 2.942-6.583 6.583-6.533z"></path>
</symbol>
</defs>
</svgs>
</html>