Theme #30
<html> <meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="shortcut icon" href="{Favicon}">
<link rel="alternate" type="application/rss+xml" href="{RSS}">
<!----
© hunterthemes.tumblr.com | Theme #30
* Do not redistribute this theme and claim it as your own.
* Do not remove the credit or move it to another page.
* Minor changes to this theme are allowed.
---->
<!-- GOOGLE FONTS -->
<link href="https://fonts.googleapis.com/css?family=Abril+Fatface|Lato|Oswald|Quando|Teko" rel="stylesheet">
<!-- DEFAULT VARIABLES -->
<meta name="image:Background" content=""/>
<meta name="image:Header background" content="" />
<meta name="image:Avatar" content="" />
<meta name="image:About background" content="" />
<meta name="image:About image" content="" />
<meta name="image:Project One image" content="" />
<meta name="image:Project Two image" content="" />
<meta name="image:Project Three image" content="" />
<meta name="image:Project Four image" content="" />
<meta name="image:Project Five image" content="" />
<meta name="image:Member One image" content="" />
<meta name="image:Member Two image" content="" />
<meta name="image:Member Three image" content="" />
<meta name="image:Member Four image" content="" />
<meta name="image:Member Five image" content="" />
<meta name="image:Member Six image" content="" />
<meta name="image:Member Seven image" content="" />
<meta name="image:Member Eight image" content="" />
<meta name="image:Member Nine image" content="" />
<meta name="color:Background" content="#fffffF" />
<meta name="color:Menu link" content="#333333" />
<meta name="color:Main link" content="#333333" />
<meta name="color:Profile background" content="#ffffff" />
<meta name="color:Blog title" content="#000000" />
<meta name="color:Avatar border" content="#ffffff" />
<meta name="color:Description" content="#333333" />
<meta name="color:Panel background" content="#ffffff" />
<meta name="color:Panel text" content="#000000" />
<meta name="color:Panel link" content="#2222222" />
<meta name="color:Footer background" content="#ffffff" />
<meta name="color:Footer text" content="#222222" />
<meta name="color:Footer icon" content="#FFBB6B" />
<meta name="color:Text" content="#4444444"/>
<meta name="color:Bold" content="#bbbbbb"/>
<meta name="color:Italic" content="#FFBB6B"/>
<meta name="color:Link" content="#333333"/>
<meta name="color:Hover" content="#dddddd"/>
<meta name="color:Accent" content="#FFBB6B"/>
<meta name="color:Borders" content="#333333"/>
<meta name="color:Chat 1" content="#f8f8f8"/>
<meta name="color:Chat 2" content="#cfcfcf"/>
<meta name="color:Post buttons" content="#999999" />
<meta name="color:Pagination" content="#ffffff" />
<meta name="color:Scrollbar" content="#FFBB6B" />
<meta name="select:Entry background" content="255,255,255" title="white">
<meta name="select:Entry background" content="0,0,0" title="black">
<meta name="select:Entry background" content="238,238,238" title="gray">
<meta name="select:Entry background" content="255,168,212" title="pink">
<meta name="select:Entry background" content="127,88,242" title="purple">
<meta name="select:Entry background" content="184,168,255" title="indigo">
<meta name="select:Entry background" content="184,208,255" title="blue">
<meta name="select:Entry background" content="103,173,90" title="green">
<meta name="select:Entry background" content="33,209,297" title="turquoise">
<meta name="select:Entry background" content="226,229,23" title="yellow">
<meta name="select:Entry background" content="112,38,11" title="brown">
<meta name="select:Entry transparency" content="1" title="opaque">
<meta name="select:Entry transparency" content=".9" title=".9">
<meta name="select:Entry transparency" content=".8" title=".8">
<meta name="select:Entry transparency" content=".7" title=".7">
<meta name="select:Entry transparency" content=".6" title=".6">
<meta name="select:Entry transparency" content=".5" title=".5">
<meta name="select:Entry transparency" content=".4" title=".4">
<meta name="select:Entry transparency" content=".3" title=".3">
<meta name="select:Entry transparency" content=".2" title=".2">
<meta name="select:Entry transparency" content=".1" title=".1">
<meta name="select:Entry transparency" content=".0" title="transparent">
<meta name="select:Info background" content="255,255,255" title="white">
<meta name="select:Info background" content="0,0,0" title="black">
<meta name="select:Info background" content="238,238,238" title="gray">
<meta name="select:Info background" content="255,168,212" title="pink">
<meta name="select:Info background" content="127,88,242" title="purple">
<meta name="select:Info background" content="184,168,255" title="indigo">
<meta name="select:Info background" content="184,208,255" title="blue">
<meta name="select:Info background" content="103,173,90" title="green">
<meta name="select:Info background" content="33,209,297" title="turquoise">
<meta name="select:Info background" content="226,229,23" title="yellow">
<meta name="select:Info background" content="112,38,11" title="brown">
<meta name="select:Title font" content="Abril Fatface" title="Abril Fatface">
<meta name="select:Title font" content="Lato" title="Lato">
<meta name="select:Title font" content="Oswald" title="Oswald">
<meta name="select:Title font" content="Quando" title="Quando">
<meta name="select:Title font" content="Teko" title="Teko">
<meta name="select:Title font size" content="20px" title="20px">
<meta name="select:Title font size" content="25px" title="25px">
<meta name="select:Title font size" content="30px" title="30px">
<meta name="select:Title font size" content="35px" title="35px">
<meta name="select:Title font size" content="40px" title="40px">
<meta name="select:Blog title font size" content="60px" title="60px">
<meta name="select:Blog title font size" content="65px" title="65px">
<meta name="select:Blog title font size" content="70px" title="70px">
<meta name="select:Blog title font size" content="75px" title="75px">
<meta name="select:Blog title font size" content="80px" title="80px">
<meta name="select:Blog title font size" content="85px" title="85px">
<meta name="select:Blog title font size" content="90px" title="90px">
<meta name="font:Body font" content="Helvetica"/>
<meta name="select:Body font size" content="12px" title="12px">
<meta name="select:Body font size" content="13px" title="13px">
<meta name="select:Body font size" content="14px" title="14px">
<meta name="select:Body font size" content="15px" title="15px">
<meta name="select:Body font size" content="16px" title="16px">
<meta name="if:Inverted Controls" content="0" />
<meta name="if:Infinite Scrolling" content="0" />
<meta name="if:Display Header" content="1" />
<meta name="if:Header Background Stretch" content="1" />
<meta name="if:Display Main Links" content="1" />
<meta name="if:Display Avatar" content="1" />
<meta name="if:Circular Avatar" content="1" />
<meta name="if:Display Search Box" content="1" />
<meta name="if:Display Navigation" content="1" />
<meta name="select:Post width" content="500" title="500px">
<meta name="select:Post width" content="400" title="400px">
<meta name="select:Post width" content="300" title="300px">
<meta name="select:Post width" content="250" title="250px">
<meta name="select:Number of columns" content="1" title="1">
<meta name="select:Number of columns" content="2" title="2">
<meta name="select:Number of columns" content="3" title="3">
<meta name="if:Hover For Info" content="0" />
<meta name="if:Display Captions" content="1" />
<meta name="if:Display Tags" content="1" />
<meta name="if:Audio Player #fff" content="0" />
<meta name="if:Display Link One" content="1" />
<meta name="if:Display Link Two" content="1" />
<meta name="if:Display Link Three" content="1" />
<meta name="if:Display Link Four" content="1" />
<meta name="if:Display Link Five" content="1" />
<meta name="if:Display Link Six" content="1" />
<meta name="text:Link One Title" content="LINK" />
<meta name="text:Link One Url" content="https://"/>
<meta name="text:Link Two Title" content="LINK"/>
<meta name="text:Link Two Url" content="https://"/>
<meta name="text:Link Three Title" content="LINK" />
<meta name="text:Link Three Url" content="https://" />
<meta name="text:Link Four Title" content="LINK" />
<meta name="text:Link Four Url" content="https://" />
<meta name="text:Link Five Title" content="LINK" />
<meta name="text:Link Five Url" content="https://" />
<meta name="text:Link Six Title" content="LINK" />
<meta name="text:Link Six Url" content="https://" />
<meta name="if:Display Tumblr" content="1" />
<meta name="if:Display Facebook" content="1" />
<meta name="if:Display Pinterest" content="1" />
<meta name="if:Display Linkedin" content="1" />
<meta name="if:Display Instagram" content="1" />
<meta name="text:Facebook url" content="https://" />
<meta name="text:Pinterest url" content="https://" />
<meta name="text:Instagram url" content="https://" />
<meta name="text:Linkedin url" content="https://" />
<meta name="text:Tumblr url" content="https://" />
<meta name="text:Project One" content="Project One"/>
<meta name="text:Project One description" content="Add content here" />
<meta name="text:Project Two" content="Project Two"/>
<meta name="text:Project Two description" content="Add content here" />
<meta name="text:Project Three" content="Project Three"/>
<meta name="text:Project Three description" content="Add content here" />
<meta name="text:Project Four" content="Project Four"/>
<meta name="text:Project Four description" content="Add content here" />
<meta name="text:Project Five" content="Project Five"/>
<meta name="text:Project Five description" content="Add content here" />
<meta name="text:Member One" content="Member One"/>
<meta name="text:Member Two" content="Member Two"/>
<meta name="text:Member Three" content="Member Three"/>
<meta name="text:Member Three Role" content="Group member / unit leader"/>
<meta name="text:Member Four" content="Member Four"/>
<meta name="text:Member Five" content="Member Five"/>
<meta name="text:Member Six" content="Member Six"/>
<meta name="text:Member Seven" content="Member Seven"/>
<meta name="text:Member Eight" content="Member Eight"/>
<meta name="text:Member Nine" content="Member Nine"/>
<meta name="text:Border radius" content="0px"/>
<meta name="text:Stats" content="Add content here" />
<meta name="text:Stats 2" content="Add content here" />
<meta name="text:Blog title" content="BLOG TITLE" />
<meta name="text:Subtitle" content="Add content here" />
<meta name="text:About first label" content="AGE" />
<meta name="text:About first text" content="23" />
<meta name="text:About second label" content="GENDER" />
<meta name="text:About second text" content="CIS MALE" />
<meta name="text:About third label" content="FROM" />
<meta name="text:About third text" content="SOUTH KOREA" />
<meta name="text:About fourth label" content="OCCUPATION" />
<meta name="text:About fourth text" content="IDOL" />
<meta name="text:About fifth label" content="FACECLAIM" />
<meta name="text:About fifth text" content="MOON TEAL" />
<meta name="text:About description" content="Add content here" />
<meta name="text:Afilliates text" content="Add content here" />
<!-- END DEFAULT VARIABLES -->
<head>
<style type="text/css">
/* CSS */
/*-- GENERAL --*/
body {
margin:0;
padding:0;
width:100%;
height:100%;
word-wrap:break-word;
color:{color:Text};
font-family:{font:Body font};
font-size:{select:Body font size};
line-height: calc({select:Body font size} + 5px);
background-color: {color:Background};
background-image:url({image:Background});
background-attachment: fixed;
background-repeat: repeat;
}
/* Heading */
h1{
margin:0;
padding:0px;
padding-bottom:5px;
color:{color:Title};
font-family:{select:Title font};
font-size:{select:Title font size};
line-height: calc({select:Title font size} + 5px);
}
h2{
font-family:{font:Body font};
font-size:150%;
font-weight:normal;
}
/* Paragraph */
p {
padding:0px 10px;
}
p ul, p ol, p li {
margin: 5px 10px;
padding: 0px;
}
/* Links */
a {
color:{color:Link};
text-decoration:none;
-webkit-transition: all 0.6s ease;
-moz-transition: all 0.6s ease;
-o-transition: all 0.6s ease;
transition: all 0.6s ease;
}
a:hover {
color:{color:Link Hover};
}
/* Bold and italic */
b, strong {color:{color:Bold};}
i, em {color:{color:Italic};}
/* Blockquote */
blockquote{
padding:0px 0px 2px 5px;
margin:0px 0px 2px 10px;
border-left: 1px dotted #555555;
}
/* Tumblr controls */
iframe.tmblr-iframe {
top:4px!important;
right:3px!important;
opacity:0.8;
transform:scale(0.6);
transform-origin:100% 0;
-webkit-transform:scale(0.8);
-webkit-transform-origin:100% 0;
-o-transform:scale(0.8);
-o-transform-origin:100% 0;
-moz-transform:scale(0.8);
-moz-transform-origin:100% 0;
-ms-transform:scale(0.8);
-ms-transform-origin:100% 0;
z-index:100000!important;
{block:ifInvertedControls}
filter:invert(100%) hue-rotate(180deg);
-webkit-filter:invert(100%) hue-rotate(180deg);
-moz-filter:invert(100%) hue-rotate(180deg);
-o-filter:invert(100%) hue-rotate(180deg);
-ms-filter:invert(100%) hue-rotate(180deg);
{/block:ifInvertedControls}
}
iframe.tmblr-iframe:hover {
opacity:1!important;}
/* Webkit scrollbar */
::-webkit-scrollbar {
width: 9px;
height: 0px;
}
::-webkit-scrollbar-button:start:decrement,
::-webkit-scrollbar-button:end:increment {
height: 0px;
display: block;
background-color: {color:Background};
}
::-webkit-scrollbar-track-piece {
background-color: {color:Background};
}
::-webkit-scrollbar-thumb:vertical {
height: 0px;
background-color: {color:Scrollbar};
border:4px solid {color:Background};
}
/* Tooltips */
#s-m-t-tooltip {
max-width: 300px;
margin-left: 10px;
margin-top: 10px;
padding: 2px 4px;
font-size: 11px;
line-height: 15px;
color: {color:Main link};
background: {color:Menu background};
border:1px solid {color:Borders};
border-radius:{text:Border radius};
z-index: 10000;
}
/* Fix */
iframe, img, embed, object, video {
max-width: 100%;
border: none;
}
input, textarea, select, a { outline: none; }
/* Placeholders */
::-webkit-input-placeholder {color: inherit;}
:-moz-placeholder {color: inherit; opacity:1;}
::-moz-placeholder {color: inherit; opacity:1;}
:-ms-input-placeholder {color: inherit;}
input:focus::-webkit-input-placeholder {color: transparent;}
input:focus:-moz-placeholder {color: transparent;}
input:focus::-moz-placeholder {color: transparent;}
input:focus:-ms-input-placeholder { color: transparent;}
/*------ MENU-----*/
#menu{
position:fixed;
top:0px;
left:0px;
width:100%;
height:50px;
text-align:center;
z-index:1000;
padding:0;
}
#menu a{
margin:0px 10px;
color:{color:Menu link};
min-height:30px;
line-height:55px;
font-size:12px;
padding:5px 15px;
letter-spacing:2px;
cursor:pointer;
}
#menu a:hover{
color:{color:Hover};
-webkit-transition: all .7s ease;
-moz-transition: all .7s ease;
-o-transition: all .7s ease;
transition: all .7s ease;
}
.item-wrapper{ display:none; }
.page-1{ display:block; }
/*------ HEADER -----*/
#header{
position:absolute;
top:0px;
left:0px;
width:100%;
height:100%;
background-image:url({image:Header background});
background-position:center;
background-repeat:repeat;
{block:IfHeaderBackgroundStretch}
background-size:cover;
{/block:IfHeaderBackgroundStretch}
z-index:100;
}
/* Blog title */
#box{
position:absolute;
top:50%;
left:50%;
width:75vh;
height:75vh;
border:10px solid {color:Accent};
-webkit-transform: translateX(-50%) translateY(-50%);
-moz-transform: translateX(-50%) translateY(-50%);
-ms-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
}
#blog_title{
position:absolute;
top:50%;
left:50%;
width:80vw;
font-family:{select:Title font};
font-size:{select:Blog title font size};
color:{color:Blog Title};
line-height:60px;
letter-spacing:2px;
text-align:center;
font-weight:bold;
-webkit-transform: translateX(-50%) translateY(-50%);
-moz-transform: translateX(-50%) translateY(-50%);
-ms-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
}
#blog_title span{
color:{color:Accent};
}
/* Stats */
#statsl, #statsr{
position:absolute;
top:50%;
left:0px;
color:{color:Blog Title};
width:300px;
-webkit-transform:translateY(-50%);
-moz-transform:translateY(-50%);
-ms-transform:translateY(-50%);
transform:translateY(-50%);
}
#statsr{
margin-left:auto;
right:0px;
}
.statscl, .statscr{
position:absolute;
margin:0;
font-size:10px;
line-height:16px;
letter-spacing:1px;
text-align:center;
text-transform:uppercase;
-ms-transform: rotate(90deg);
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
}
.statscr{
right:0px;
-ms-transform: rotate(-90deg);
-webkit-transform: rotate(-90deg);
transform: rotate(-90deg);
}
/*------ PROFILE -----*/
#profile{
position:relative;
margin-top:0px;
margin-left:0px;
width:100%;
padding:50px 0px;
background:{color:Profile background};
color:{color:Description};
text-align:center;
overflow:hidden;
z-index:10;
}
/* Avatar */
#avatar{
margin:auto;
width:80px;
height:80px;
z-index:10000;
{block:ifCircularAvatar}
border-radius:100px;
{/block:ifCircularAvatar}
}
#avatar img{
margin:auto;
width:100%;
height:100%;
border:2px solid {color:Avatar border};
{block:ifCircularAvatar}
border-radius:100px;
{/block:ifCircularAvatar}
}
/* Profile title */
#profile_title {
margin-top:15px;
margin-left:auto;
margin-right:auto;
font-size:20px;
line-height:30px;
font-weight:bold;
text-align:center;
text-transform:uppercase;
color:{color:Description};
}
/* Subtitle */
.subtitle{
margin-top:5px;
margin-left:auto;
margin-right:auto;
width:400px;
font-size:10px;
line-height:16px;
letter-spacing:1px;
text-align:center;
text-transform:uppercase;
color:{color:Description};
}
/* Main links */
#main_links{
margin:15px auto;
height:78px;
line-height:40px;
}
#main_links a{
margin:10px;
font-size:12px;
line-height:16px;
text-align:center;
padding:5px 10px;
letter-spacing:1px;
color:{color:Profile background};
background:{color:Accent};
}
#main_links a:hover{
color:{color:Hover};
}
.divider{
margin:auto;
width:150px;
height:1px;
background:{color:Borders};
}
/* Description */
.description{
margin-top:15px;
margin-left:auto;
margin-right:auto;
max-width: 400px;
max-height:60px;
overflow-y:auto;
padding-right:10px;
font-size:10px;
line-height:16px;
letter-spacing:1px;
text-align:center;
text-transform:uppercase;
color:{color:Description};
}
/*------ ABOUT -----*/
#about{
position:fixed;
top:0px;
left:0px;
width:100%;
height:100%;
background:{color:Panel background};
z-index:10000;
overflow:hidden;
display:none;
}
#about_panel{
position:absolute;
top:0px;
left:0px;
width:50%;
height:100%;
background-color:{color:Panel background};
background-image:url({image:About background});
background-size:cover;
z-index:10000;
}
#panelin{
position:absolute;
top:50%;
left:50%;
width:280px;
font-size:12px;
line-height:20px;
letter-spacing:1px;
text-align:right;
color:{color:Panel text};
-webkit-transform:translateX(-50%) translateY(-50%);
-moz-transform:translateX(-50%) translateY(-50%);
-ms-transform:translateX(-50%) translateY(-50%);
transform:translateX(-50%) translateY(-50%);
}
/* About title */
#about_title {
margin-top:20px;
margin-left:auto;
margin-right:auto;
font-size:20px;
line-height:30px;
font-weight:bold;
text-align:center;
text-transform:uppercase;
color:{color:Panel text};
}
/* About description */
#about_description{
margin:20px auto;
font-size:14px;
line-height:20px;
text-align:center;
color:{color:Panel text};
}
#panelin span{
float:left;
color:{color:Accent};
letter-spacing:2px;
font-weight:700;
}
/* Search box */
#search_box{
margin:10px auto;
width:calc(100% - 20px);
padding:10px;
height:25px;
border:1px solid {color:Borders};
}
.search .query {
float:left;
width:calc(100% - 30px);
height:20px;
padding:2.5px 0px;
border: 0;
outline: 0;
font-family: inherit;
font-size: 13px;
letter-spacing:2px;
color: {color:Panel text};
background-color: transparent;
}
#search_box span{
float:right;
font-size:15px;
width:20px;
height:20px;
padding:2.5px;
color:{color:Accent};
}
/* About image */
#about_image{
position:absolute;
top:0px;
left:50%;
width:50%;
height:100%;
background-color:{color:Panel background};
background-image:url({image:About image});
background-size:cover;
z-index:10000;
}
/*-- PROJECTS --*/
#projects{
position:fixed;
top:0px;
left:0px;
width:100%;
height:100%;
background:{color:Panel background};
z-index:10000;
overflow:hidden;
display:none;
}
/* Projects link box */
#projects_links{
position:absolute;
top:0px;
left:0px;
width:33%;
height:100%;
background:{color:Panel background};
z-index:10000;
}
/* Projects title */
.projects_title{
margin-top:35px;
margin-left:auto;
margin-right:auto;
width:70%;
padding-bottom:20px;
font-size:20px;
line-height:20px;
font-weight:bold;
text-align:left;
text-transform:uppercase;
color:{color:Accent};
border-bottom:1px solid {color:Borders};
}
/* Projects icon */
#projects span{
font-size:15px;
padding:5px;
}
/* Projects links */
.tabs ul{
margin:auto;
margin-top:20px;
width:70%;
padding:0px;
}
/* Clearfix */
.tab-links:after {
display:block;
clear:both;
content:'';
}
.tab-links li {
list-style:none;
}
.tab-links a {
display:block;
padding:10px;
margin-top:0px;
margin-left:0px;
width: calc(100% - 30px);
padding:15px 10px;
color:{color:Panel link};
border-bottom:1px solid {color:Borders};
font-size:13px;
font-weight:700;
line-height:20px;
text-align:left;
text-transform:uppercase;
overflow:hidden;
}
.tab-links span{
color:{color:Panel background};
}
.tab-links a:hover, li.active a, li.active a:hover {
padding:15px;
width: calc(100% - 40px);
background:{color:Accent};
color:{color:Panel background};
-webkit-transition: all .3s;
-moz-transition: all .3s;
-o-transition: all .3s;
-ms-transition: all .3s;
transition: all .3s;
}
/* Projects panel */
.projects_panel{
position:absolute;
top:20px;
left:33%;
width:66%;
height:calc(100% - 40px);
background:{color:Panel background};
overflow:hidden;
z-index:100;
}
/* Projects tabs */
.tab {
display:inline-block;
float:left;
height:100%;
width:calc(25% - 10px);
border-right:10px solid {color:Panel background};
overflow:hidden;
}
.tab.active {
width:calc(50% - 10px);
}
.tab_hover{
margin-top:0px;
margin-left:0px;
width:100%;
height:100%;
-moz-box-shadow: inset 0 0 500px {color:Accent};
-webkit-box-shadow: inset 0 0 500px {color:Accent};
box-shadow: inset 0 0 500px {color:Accent};
opacity:1;
z-index:100;
}
.tab.active .tab_hover {
position:absolute;
top:25px;
margin-left:25px;
width:calc(50% - 65px);
height:calc(100% - 50px);
border:2px solid {color:Accent};
-moz-box-shadow: none;
-webkit-box-shadow: none;
box-shadow: none;
z-index:100;
opacity:1;
}
/* Tab title */
.tab h1{
display:inline-block;
margin-left:-19vh;
margin-top:60vh;
width:50vh;
height:5vh;
-moz-box-shadow: none;
-webkit-box-shadow: none;
box-shadow: none;
text-align:left;
text-transform:uppercase;
letter-spacing:2px;
font-size:12px;
opacity:1;
color:{color:Panel link};
-ms-transform:rotate(-90deg);
-webkit-transform: rotate(-90deg);
transform:rotate(-90deg);
}
.tab.active h1{
display:none;
}
/* Tab description */
.tab_description{
position:absolute;
top:50%;
left:50%;
color:{color:Panel text};
font-size:15px;
line-height:20px;
text-align:center;
color: #fff;
text-shadow: 0.07em 0 #000, 0 0.07em #000, -0.07em 0 #000, 0 -0.07em #000;
opacity:0;
-webkit-transform: translateX(-50%) translateY(-50%);
-moz-transform: translateX(-50%) translateY(-50%);
-ms-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
}
.tab.active .tab_description{
opacity:1;
}
#tab1{
background-image:url({image:Project One image});
background-size:cover;
}
#tab2{
background-image:url({image:Project Two image});
background-size:cover;
}
#tab3{
background-image:url({image:Project Three image});
background-size:cover;
}
#tab4{
background-image:url({image:Project Four image});
background-size:cover;
}
#tab5{
background-image:url({image:Project Five image});
background-size:cover;
}
/*-- AFILLIATES --*/
#afilliates{
position:fixed;
top:0px;
left:0px;
width:100%;
height:100%;
background:{color:Panel background};
z-index:10000;
overflow:hidden;
display:none;
}
#afbox{
position:fixed;
top:50%;
left:50%;
width:910px;
height:530px;
background:{color:Panel background};
z-index:10000;
overflow:hidden;
-webkit-transform: translateX(-50%) translateY(-50%);
-moz-transform: translateX(-50%) translateY(-50%);
-ms-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
}
/* Affiliates title */
#affiliates_title {
position:absolute;
margin-top:0px;
right:0px;
width:180px;
height:530px;
color:{color:Panel text};
border-left:1px solid {color:Panel text};
}
#affiliates_titlein {
position:absolute;
top:50%;
right:-100%;
height:220px;
width:500px;
font-size:15px;
line-height:22px;
text-align:left;
color:{color:Panel text};
border-top:5px solid {color:Accent};
-ms-transform: translateY(-50%) rotate(-90deg);
-webkit-transform: translateY(-50%) rotate(-90deg);
transform: translateY(-50%) rotate(-90deg);
}
#affiliates_title h1 {
font-size:85px;
line-height:100%;
border:none;
}
#affiliates_titlein::first-letter{
color:{color:Accent}!important;
}
/* Affiliates icons */
#aficons{
position:absolute;
top:0px;
left:0px;
height:530px;
width:720px;
font-size:15px;
line-height:22px;
text-align:left;
color:{color:Description};
}
.aficon{
float:left;
display:inline-block;
width:170px;
height:170px;
margin-right:10px;
margin-bottom:10px;
background:#ddd;
}
.aficon img, .aficonbig img{
width:100%;
height:100%;
}
.afborder{
position:absolute;
margin-top:-166px;
margin-left:10px;
width:146px;
height:146px;
border:2px solid {color:Accent};
z-index:100;
}
.aficon:hover .afborder{
opacity:0;
}
.afhover{
position:absolute;
margin-top:-175px;
margin-left:0px;
height:170px;
width:170px;
background:rgba(0,0,0,0.7);
z-index:100;
opacity:0;
}
.afname{
position:absolute;
margin-top:65px;
margin-left:20px;
height:60px;
width:130px;
color:#eee;
text-align:center;
font-size:20px;
font-weight:700;
font-family:{select:Title font};
text-transform:uppercase;
z-index:100;
}
.afdivider{
margin-top:10px;
margin-left:auto;
margin-right:auto;
width:50px;
border:1px solid {color:Accent};
}
.aficon:hover .afhover{
opacity:1;
}
/* Afilliates big icon */
.aficonbig{
float:right;
display:inline-block;
width:350px;
height:350px;
margin-right:10px;
margin-bottom:10px;
background:#ddd;
}
.aficonbighover{
position:absolute;
margin-top:-335px;
margin-left:20px;
width:310px;
height:310px;
background: {color:Accent};
z-index:100;
opacity:0;
-webkit-box-shadow: 0px 10px 5px 5px rgba(0,0,0,0.19);
-moz-box-shadow: 0px 10px 5px 5px rgba(0,0,0,0.19);
box-shadow: 0px 10px 5px 5px rgba(0,0,0,0.19);
}
.afnamebig{
position:absolute;
margin-top:130px;
margin-left:40px;
height:50px;
width:230px;
color:#eee;
font-size:25px;
line-height:27px;
font-family:{select:Title font};
font-weight:700;
text-align:center;
text-transform:uppercase;
z-index:100;
}
.afnamebig span{
font-weight:400;
font-size:15px;
}
.aficonbig:hover .aficonbighover{
opacity:0.9;
}
/* Close buttons */
#close1, #close2, #close3{
position:absolute;
bottom:20px;
right:20px;
width:40px;
height:40px;
padding:5px;
line-height:50px;
text-align:center;
border:1px solid {color:Borders};
background:{color:Borders};
cursor:pointer;
z-index:10000;
}
#close1 span, #close2 span, #close3 span{
color:{color:Panel link};
font-size:20px;
}
#close1:hover, #close1:hover span, #close2:hover, #close2:hover span, #close3:hover, #close3:hover span{
color:{color:Hover};
}
/*-- FOOTER --*/
#footer{
margin-top:0px;
margin-left:0px;
width:calc(100% - 60px);
padding:20px 30px;
font-size:13px;
height:30px;
line-height:30px;
color:{color:Footer text};
background:{color:Footer background};
}
#footer a{
color:{color:Accent};
}
/* Footer avatar */
#footer_avatar{
float:left;
margin-top:-3px;
margin-right:20px;
width:30px;
height:30px;
z-index:10000;
{block:ifCircularAvatar}
border-radius:100px;
{/block:ifCircularAvatar}
}
#footer_avatar img{
margin:auto;
width:100%;
height:100%;
border:2px solid {color:Avatar border};
{block:ifCircularAvatar}
border-radius:100px;
{/block:ifCircularAvatar}
}
/* Social icons */
#socialicons{
float:right;
text-align:right;
height:30px;
line-height:30px;
}
#socialicons span {
margin-left:10px;
color:{color:Footer icon};
font-size:13px;
}
#socialicons span:hover{
color:{color:Hover};
}
/*----- MAIN CONTAINER -----*/
#container{
position:relative;
margin-top:0px;
margin-left:0px;
{block:HomePage}
position:absolute;
top:100%;
left:0%;
{/block:HomePage}
width:100%;
}
/*------ POSTS AND ENTRIES -----*/
#posts {
display:block;
position:relative;
margin-left:auto;
margin-right:auto;
margin-top:40px;
width:calc(({select:Post width}px + 72px) * {select:Number of columns})!important;
max-width:1116px!important;
{block:PermalinkPage}
width:572px!important;
{/block:PermalinkPage}
}
.entry {
float:left;
display: block;
margin:25px!important;
width: {select:Post width}px;
padding:10px;
padding-bottom:0;
background:rgba({select:Entry background}, {select:Entry transparency});
border: 1px solid {color:Borders};
{block:PermalinkPage}
width:500px;
margin:25px!important;
{/block:PermalinkPage}
}
.entry img { max-width: 100%; }
/* -------- RESPONSIVE DESIGN VALUES, editing is not recommended -------- */
@media only screen and (max-width: 900px) {
#posts {
display:block;
position:relative;
margin-left:auto;
margin-right:auto;
margin-top:40px;
padding-bottom:80px;
min-height:500px;
width:calc(({select:Post width}px + 72px) * {select:Number of columns})!important;
max-width:944px !important;
{block:PermalinkPage}
width:572px!important;
{/block:PermalinkPage}
}
}
@media only screen and (max-width: 600px) {
#posts {
display:block;
position:relative;
margin-left:auto;
margin-right:auto;
margin-top:40px;
padding-bottom:80px;
min-height:500px;
width:calc(({select:Post width}px + 72px) * {select:Number of columns})!important;
max-width:572px!important;
{block:PermalinkPage}
width:572px!important;
{/block:PermalinkPage}
}
}
/* -- POST STYLES -- */
/* Quote posts */
.quote {
margin:5px;
padding:10px;
font-family:{select:Title font};
font-size:200%;
line-height:130%;
color:{color:Italic};
height:auto;
text-align:center;
letter-spacing:1px;
}
.source {
margin-top:5px;
margin-bottom:10px;
font-family:{font:Body font};
font-size:15px;
height:25px;
line-height:25px;
text-align:left;
overflow:hidden;
}
.source span{
float:left;
margin-right:10px;
color:{color:Link};
padding:5px;
padding-right:10px;
font-size:15px;
border-right:1px solid {color:Borders};
}
/* Link posts */
#linktitle{
width:calc(100% - 10px);
color:{color:Title};
font-family:{select:Title font};
font-size:200%;
line-height:150%;
background:{color:Borders};
border-radius:{text:Border radius};
padding:5px;
{block:ifEntryBorderTransparent}
background:transparent;
border:1px solid transparent;
{/block:ifEntryBorderTransparent}
}
#linktitle a{
color:{color:Link};
}
#linktitle span{
color:{color:Icon};
}
#linktitle:hover{
color:{color:Hover};
}
/* Audio posts */
.album img{
float:left;
margin-top:0px;
width:70px;
height:70px;
margin-left:5px;
margin-right:10px;
float:left;
z-index:10;
border: 1px solid {color:Borders};
border-radius:100%;
}
.play{
position:absolute;
margin:22px 25px;
width:31px;
height:29px;
padding-top:2px;
line-height:31px;
overflow:hidden;
background:#fff;
border-radius:100%;
}
.audio{
width:160px;
min-height:80px;
margin-top:10px;
z-index:10;
font-size:12px;
line-height:25px;
overflow:hidden;
}
.audio h1{
font-size:20px;
border-bottom:1px solid transparent;
}
/* Ask posts */
.question{
width:100%;
height:auto;
line-height:20px;
color:{color:Answer};
}
.questionin{
margin-left:45px;
width:calc(100% - 65px);
min-height:24px;
line-height:24px;
padding:5px;
padding-left:10px;
padding-right:10px;
border:1px solid {color:Borders};
border-top-right-radius:{text:Border radius};
border-bottom-right-radius:{text:Border radius};
}
.question img{
width:28px;
padding:3px;
border:1px solid {color:Borders};
margin-right:4px;
border-top-left-radius:{text:Border radius};
border-bottom-left-radius:{text:Border radius};
}
.answer{
margin-top:5px;
width:calc(100% - 10px);
padding:5px;
}
/* Chat posts */
.chat ul {
display:block;
list-style:none;
margin-left:-40px;
}
/* Chat lines style */
.chat li {
padding:3px;
display:block;
}
/* Odd lines style */
.chat .odd {
color:{color:Chat 1};
}
/* Even lines style */
.chat .even {
color:{color:Chat 2};
}
/* -- POST INFO -- */
.info1 {
height:auto;
float:center;
margin-top:-10px;
margin-bottom:10px;
margin-left:-10px;
height:20px;
width:100%;
font-size:10px;
line-height:20px;
color:{color:Link};
background:rgba({select:Info background}, {select:Entry transparency});
border-bottom:1px solid {color:Borders};
border-top-left-radius:{text:Border radius};
border-top-right-radius:{text:Border radius};
padding:5px 10px;
{block:IndexPage}
{block:ifHoverForInfo}
opacity:0;
position:absolute;
{/block:ifHoverForInfo}
{/block:IndexPage}
overflow:hidden;
}
.entry:hover .info1{
{block:ifHoverForInfo}
opacity:1;
{/block:ifHoverForInfo}
}
.date{
float:right;
margin-top:0px;
width:100px;
text-align:right;
text-transform:lowercase;
}
/* Info 2 */
.info2 {
height:auto;
float:center;
margin-top:10px;
margin-left:-10px;
margin-bottom:0;
width:100%;
padding:5px 10px;
height:20px;
line-height:20px;
font-size:11px;
color:{color:Link};
background:rgba({select:Info background}, {select:Entry transparency});
border-top:1px solid {color:Borders};
border-bottom-left-radius:{text:Border radius};
border-bottom-right-radius:{text:Border radius};
{block:ifDisplayTags}
height:auto;
{/block:ifDisplayTags}
{block:IndexPage}
{block:ifHoverForInfo}
opacity:0;
position:absolute;
bottom:0;
{/block:ifHoverForInfo}
{/block:IndexPage}
{block:PermalinkPage}
border-radius:0;
{/block:PermalinkPage}
}
.entry:hover .info2{
{block:ifHoverForInfo}
opacity:1;
{/block:ifHoverForInfo}
}
.info1 a, .info2 a {
font-size:11px;
}
.info1 a:hover, .info2 a:hover{
color:{color:Hover};
}
.info1 b, .info2 b{
color:transparent;
margin-left:-5px;
}
/* Tags */
.tags{
margin-top:-10px;
margin-left:-5px;
}
.tags a{
margin:2px;
padding:3px 5px;
background:rgba({select:Entry background}, {select:Entry transparency});
}
/*-- PERMALINK, LIKE AND REBLOG BUTTONS --*/
.post_buttons {
width:45px;
height:19px;
margin-left:calc(100% - 70px);
margin-top:-20px;
padding-top:2px;
text-align:center;
z-index:100;
list-style: none;
{block:PermalinkPage}
padding-right:15px;
{/block:PermalinkPage}
}
.post_buttons span{
font-size:12px;
color:{color:Post buttons};
}
.perma{
position:absolute;
width:20px;
margin-left:-30px;
margin-top:-20px;
}
.rblg{
position:absolute;
margin-top:0px;
margin-left:-5px;
}
.like {
position: relative;
}
.like .like_button {
position: absolute;
margin-top: -21px;
margin-left:15px;
opacity: 0;
}
.like .like_button.liked {
opacity: 1;
}
/*-- PERMALINK PAGE --*/
.postnotes{
margin: 10px 0px;
width: 100%;
font-size: 12px;
color: {color:Text};
line-height:20px;
text-align:left;
overflow:hidden;
}
ol.notes {
display:block;
padding: 0px;
margin: 10px 0px;
width: 100%;
list-style-type: none;
}
ol.notes li.note {
padding: 10px;
border-bottom:1px solid {color:Borders};
}
ol.notes li.note img.avatar {
vertical-align: -5px;
margin-right: 10px;
width: 15px;
height: 15px;
}
li.more_notes_link_container {
text-transform: uppercase;
font-size: 12px;
}
/*-- PAGINATION --*/
#pager{
width:100%;
height:70px;
margin-top:20px;
margin-left:auto;
margin-right:auto;
}
#pagination{
margin:auto;
width:500px;
height:30px;
text-align:center;
{block:ifInfiniteScrolling}
display:none;
{/block:ifInfiniteScrolling}
}
.pagicon, .next, .load-more{
display:inline;
}
.pagicon a, .next, .load-more{
font-size:12px;
padding:10px;
margin:10px;
color:{color:Pagination};
background:rgba({select:Entry background}, {select:Entry transparency});
border:1px solid {color:Borders};
border-radius:{text:Border radius};
}
.pagicon a:hover, .next:hover, .load-more:hover{
color:{color:Hover};
}
.pagicon span, .next span, .load-more span{
color:{color:Accent};
font-size:15px;
margin:5px;
text-decoration:none;
}
.pagicon:hover span, .next:hover span, .load-more:hover span{
color:{color:Hover};
}
/* -- INFINITE SCROLLING -- */
#infscr-loading {
display:none!important;
}
#iscroll{
margin:auto;
width:500px;
height:30px;
text-align:center;
}
{block:ifLoadMore}
.load-more{
height:40px;
}
{/block:ifLoadMore}
/* END CSS */
{CustomCSS}
</style>
</head>
<title>{Title}
{block:SearchPage} - {lang:Search results for SearchQuery}{/block:SearchPage}
{block:TagPage} - {Tag} {/block:TagPage}
{block:PostSummary}- {PostSummary} {/block:PostSummary}</title>
{block:Description}<meta name="description" content="{MetaDescription}" />
{/block:Description}
<!-- HTML -->
<body>
<div id="menu">
<a href="/"> INDEX</a> /
<a onclick="toggle_visibility('about');"> ABOUT</a> /
<a onclick="toggle_visibility('projects');"> PROJECTS</a> /
<a onclick="toggle_visibility('afilliates');"> AFILLIATES</a> /
<a href="https://hunterthemes.tumblr.com"> CREDIT</a>
</div>
<!--End Menu-->
{block:HomePage}
<div class="item-wrapper page-{CurrentPage}"></div>
{block:ifDisplayHeader}
<div id="header">
<div id="box"></div>
<div id="blog_title">{text:Blog title}</div>
<div id="statsl">
<div class="statscl">{text:Stats}</div>
</div>
<!--End statsl-->
<div id="statsr">
<div class="statscr">{text:Stats 2}</div>
</div>
<!--End statsr-->
</div>
<!--End Header-->
{/block:ifDisplayHeader}
</div>
<!--End item-wrapper -->
{/block:HomePage}
<div id="about">
<div id="about_panel">
<div id="panelin">
<div id="about_title">ABOUT</div><br>
<span> {text:About first label} </span> {text:About first text} <br>
<span> {text:About second label} </span> {text:About second text} <br>
<span> {text:About third label} </span> {text:About third text} <br>
<span> {text:About fourth label} </span> {text:About fourth text} <br>
<span> {text:About fifth label} </span> {text:About fifth text} <br>
<div id="about_description">
{text:About description}
</div>
<!--End description-->
<div id="search_box">
<form action="/search" method="get" class="search">
<input type="text" name="q" value="{SearchQuery}" class="query" placeholder="SEARCH"> <span class="sf sf-search-o"></span>
</form>
</div>
<!-- End search_box -->
</div>
<!--End panelin-->
</div>
<!--End about_panel-->
<div id="about_image"></div>
<div id="close1"><a onclick="toggle_visibility('about');"> <span class="sf sf-cross-o"></span></a></div>
</div>
<!--End about-->
<div id="projects">
<div id="projects_links">
<div class="tabs">
<div class="projects_title"><span class="sf sf-navigation-o"></span> PROJECTS</div>
<ul class="tab-links">
<li class="active"><a href="/"> <span> – </span> SHOW ALL </a></li>
<li><a id="linkone" href="#tab1"> <span> – </span> {text:Project One}</a></li>
<li><a id="linktwo" href="#tab2"> <span> – </span> {text:Project Two}</a></li>
<li><a id="linkthree" href="#tab3"> <span> – </span> {text:Project Three}</a></li>
<li><a id="linkfour" href="#tab4"> <span> – </span> {text:Project Four}</a></li>
<li><a id="linkfive" href="#tab5"> <span> – </span> {text:Project Five}</a></li>
</ul>
</div>
<!--End tabs-->
</div>
<!--End projects_links-->
<div class="projects_panel">
<div id="tab1" class="tab">
<div class="tab_hover">
<h1>{text:Project One}</h1>
<div class="tab_description">
{text:Project One description}
</div>
<!--End tab_description-->
</div>
<!--End tab_hover-->
</div>
<!-- End tab1 -->
<div id="tab2" class="tab">
<div class="tab_hover">
<h1>{text:Project Two}</h1>
<div class="tab_description">
{text:Project Two description}
</div>
<!--End tab_description-->
</div>
<!--End tab_hover-->
</div>
<!--End tab2-->
<div id="tab3" class="tab">
<div class="tab_hover">
<h1>{text:Project Three}</h1>
<div class="tab_description">
{text:Project Three description}
</div>
<!--End tab_description-->
</div>
<!--End tab_hover-->
</div>
<!--End tab3-->
<div id="tab4" class="tab">
<div class="tab_hover">
<h1>{text:Project Four}</h1>
<div class="tab_description">
{text:Project Four description}
</div>
<!--End tab_description-->
</div>
<!--End tab_hover-->
</div>
<!--End tab4-->
<div id="tab5" class="tab">
<div class="tab_hover">
<h1>{text:Project Five}</h1>
<div class="tab_description">
{text:Project Five description}
</div>
<!--End tab_description-->
</div>
<!--End tab_hover-->
</div>
<!--End tab5-->
</div>
<!--End projects_panel-->
<div id="close2"><a onclick="toggle_visibility('projects');"> <span class="sf sf-cross-o"></span></a></div>
</div>
<!--End projects-->
<div id="afilliates">
<div id="afbox">
<div id="affiliates_title">
<div id="affiliates_titlein">
<h1> AFILLIATES </h1>
{text:Afilliates text}
</div>
<!-- End affiliates_titlein -->
</div>
<!-- End affiliates_title -->
<div id="aficons">
<div class="aficon">
<img src="{image:Member One image}">
<div class="afborder"></div>
<!-- End afborder -->
<div class="afhover">
<div class="afname"> {text:Member One}
<div class="afdivider"></div>
</div>
<!-- End afname -->
</div>
<!-- End afhover -->
</div>
<!-- End aficon -->
<div class="aficon">
<img src="{image:Member Two image}">
<div class="afborder"></div>
<!-- End afborder -->
<div class="afhover">
<div class="afname"> {text:Member Two}
<div class="afdivider"></div>
</div>
<!-- End afname -->
</div>
<!-- End afhover -->
</div>
<!-- End aficon -->
<div class="aficonbig">
<img src="{image:Member Three image}">
<div class="aficonbighover">
<div class="afnamebig">
{text:Member Three}
<span> {text:Member Three Role} </span>
</div>
</div>
<!-- End aficonbighover -->
</div>
<!-- End aficonbig -->
<div class="aficon">
<img src="{image:Member Four image}">
<div class="afborder"></div>
<!-- End afborder -->
<div class="afhover">
<div class="afname"> {text:Member Four}
<div class="afdivider"></div>
</div>
<!-- End afname -->
</div>
<!-- End afhover -->
</div>
<!-- End aficon -->
<div class="aficon">
<img src="{image:Member Five image}">
<div class="afborder"></div>
<!-- End afborder -->
<div class="afhover">
<div class="afname"> {text:Member five}
<div class="afdivider"></div>
</div>
<!-- End afname -->
</div>
<!-- End afhover -->
</div>
<!-- End aficon -->
<div class="aficon">
<img src="{image:Member Six image}">
<div class="afborder"></div>
<!-- End afborder -->
<div class="afhover">
<div class="afname"> {text:Member Six}
<div class="afdivider"></div>
</div>
<!-- End afname -->
</div>
<!-- End afhover -->
</div>
<!-- End aficon -->
<div class="aficon">
<img src="{image:Member Seven image}">
<div class="afborder"></div>
<!-- End afborder -->
<div class="afhover">
<div class="afname"> {text:Member Seven}
<div class="afdivider"></div>
</div>
<!-- End afname -->
</div>
<!-- End afhover -->
</div>
<!-- End aficon -->
<div class="aficon">
<img src="{image:Member Eight image}">
<div class="afborder"></div>
<!-- End afborder -->
<div class="afhover">
<div class="afname"> {text:Member Eight}
<div class="afdivider"></div>
</div>
<!-- End afname -->
</div>
<!-- End afhover -->
</div>
<!-- End aficon -->
<div class="aficon">
<img src="{image:Member Nine image}">
<div class="afborder"></div>
<!-- End afborder -->
<div class="afhover">
<div class="afname"> {text:Member Nine}
<div class="afdivider"></div>
</div>
<!-- End afname -->
</div>
<!-- End afhover -->
</div>
<!-- End aficon -->
</div>
<!-- End aficons -->
</div>
<!-- End afbox -->
<div id="close3"><a onclick="toggle_visibility('afilliates');"> <span class="sf sf-cross-o"></span></a></div>
</div>
<!-- End afilliates -->
<div id="container">
<div id="profile">
{block:IfDisplayAvatar}
<div id="avatar"><img src="{image:Avatar}"></div>
{/block:IfDisplayAvatar}
<div id="profile_title">{Title}</div>
<div class="subtitle">{text:Subtitle}</div>
<div id="main_links">
<a href="/ask"> ASK BOX</a>
<a href="/submit"> SUBMIT</a>
<a href="/archive"> ARCHIVE</a><br>
{block:IfDisplayLinkOne}
<a href="{text:Link One Url}">{text:Link One Title}</a>
{/block:IfDisplayLinkOne}
{block:IfDisplayLinkTwo}
<a href="{text:Link Two Url}">{text:Link Two Title}</a>
{/block:IfDisplayLinkTwo}
{block:IfDisplayLinkThree}
<a href="{text:Link Three Url}">{text:Link Three Title}</a>
{/block:IfDisplayLinkThree}
{block:IfDisplayLinkFour}
<a href="{text:Link Four Url}">{text:Link Four Title}</a>
{/block:IfDisplayLinkFour}
{block:IfDisplayLinkFive}
<a href="{text:Link Five Url}">{text:Link Five Title}</a>
{/block:IfDisplayLinkFive}
</div>
<!--main_links-->
<div class="divider"></div>
<div class="description">
{Description}
</div>
<!--End description-->
</div>
<!--End profile-->
<!-- POSTS -->
<div id="posts">
{block:Posts}
<div class="entry">
{block:Date}
<div class="info1">
<b>-</b>
<!-- Reblogged from -->
{block:RebloggedFrom}
<a href="{ReblogParentURL}">
via</a> /{/block:RebloggedFrom}
{block:ContentSource}
<a href="{SourceURL}"
target=blank> source</a>
{/block:ContentSource}
<div class="date">
<a href="{Permalink}">
{shortmonth} {dayofmonth}</a>
</div>
<!--End date-->
</div>
<!--End info1-->
{/block:Date}
<div class="content">
<!-- Text -->
{block:Text}
{block:Title}
<a href="{Permalink}">
<h1>{Title}</h1></a>
{/block:Title}
{Body}
{/block:Text}
<!-- Photo -->
{block:Photo}
{block:IndexPage}
{LinkOpenTag}
<img src="{PhotoURL-500}" alt="{PhotoAlt}" width="{select:Post width}px"/></a>
{LinkCloseTag}
{/block:IndexPage}
{block:PermalinkPage}
{LinkOpenTag}
<img src="{PhotoURL-500}" alt="{PhotoAlt}" width="500px"/></a>
{LinkCloseTag}
{/block:PermalinkPage}
{/block:Photo}
<!-- Photoset -->
{block:Photoset}
{block:IndexPage}
{Photoset-500}
{/block:IndexPage}
{block:PermalinkPage}
{Photoset-500}
{/block:PermalinkPage}
{/block:Photoset}
<!-- Quote -->
{block:Quote}
<div class="source">
<span class="sf sf-quotation-mark"></span>
{block:Source}
{Source}
{/block:Source}
</div>
<!--End source-->
<div class="quote">
{Quote}
</div>
<!--End quote-->
{/block:Quote}
<!-- Link -->
{block:Link}
<div id="linktitle">
<a href="{URL}"
class="linkpost"
target="_blank">
{Name} » </a>
</div>
{block:Description}
{Description}
{/block:Description}
{/block:Link}
<!-- Chat -->
{block:Chat}
<div class="chat">
<ul>
{block:Lines}
<li class="{Alt}">
{block:Label}<b>{Label}</b>{/block:Label}
{Line}
</li>
{/block:Lines}
</ul>
</div>
{/block:Chat}
<!-- Audio -->
{block:Audio}
<div class="album">
{block:AlbumArt}
<img src="{AlbumArtURL}"></a>
{block:AlbumArt}
</div>
<!--End album-->
<div class="play">
{block:AudioPlayer}
{AudioPlayer}
{/block:AudioPlayer}
</div>
<div class="audio">
{block:TrackName}<h1>{TrackName}</h1>{/block:TrackName}
{block:Artist}{Artist}{/block:Artist}<br>
<!--End play-->
{block:PlayCount}
{FormattedPlayCount}
{/block:PlayCount}
</div>
<!--End audio-->
{/block:Audio}
<!-- Video -->
{block:Video}
{block:IndexPage}
{block:ifNot250pxPosts}
{Video-500}
{/block:ifNot250pxPosts}
{block:if250pxPosts}
{Video-250}
{/block:if250pxPosts}
{/block:IndexPage}
{block:PermalinkPage}
{Video-500}
{/block:PermalinkPage}
{/block:Video}
<!-- Ask -->
{block:Answer}
<div class="question">
<img src="{AskerPortraitURL-48}"
align="left"></div>
<div class="questionin">
{Asker}: {Question}</div>
<div class="answer">
{Answer}</div>
{/block:Answer}
<!-- Caption -->
{block:IndexPage}
{block:IfDisplayCaptions}
{block:Caption}
{Caption}
{/block:Caption}
{/block:IfDisplayCaptions}
{/block:IndexPage}
{block:PermalinkPage}
{block:Caption}
{Caption}
{/block:Caption}
{/block:PermalinkPage}
</div>
<!--End content-->
<!-- Date -->
{block:Date}
<div class="info2">
<b>-</b>
{block:NoteCount}
<a href="{Permalink}">
{NoteCountWithLabel}</a>
{/block:NoteCount}
<!-- Permalink, reblog and like buttons -->
<ul class="post_buttons">
<li class="rblg"><a href="{ReblogUrl}"><span class="sf sf-refresh-o"></span></a></li>
<li class="like">
<span class="sf sf-heart-o"></span>
{LikeButton size="15"}
</li>
{block:IndexPage}
<div class="perma"><a href="{Permalink}"><span class="sf sf-aero-cursor-o"></span></a></div>
{/block:IndexPage}
</ul>
<!-- End post_buttons -->
<!-- Tags -->
{block:IndexPage}
{block:IfDisplayTags}
<div class="tags">
{block:HasTags}
{block:Tags}
<a href="{TagURL}">#{Tag}</a>
{/block:Tags}
{/block:HasTags}
</div>
{/block:IfDisplayTags}
{/block:IndexPage}
{block:PermalinkPage}
<div class="tags">
{block:HasTags}
{block:Tags}
<a href="{TagURL}">#{Tag}</a>
{/block:Tags}
{/block:HasTags}
</div>
{/block:PermalinkPage}
</div>
<!--End info2-->
{/block:Date}
<!-- Permalink page -->
{block:PermalinkPage}
<!-- Post notes-->
{block:PostNotes}
<div class="postnotes">
<h2>Post notes:</h2>
{PostNotes}
</div>
{/block:PostNotes}
{/block:PermalinkPage}
<!-- Other -->
{block:ContentSource}
<!-- {SourceURL}
{block:SourceLogo}
<img src="{#000LogoURL}"
width="{LogoWidth}"
height="{LogoHeight}"
alt="{SourceTitle}" />
{/block:SourceLogo}
{block:NoSourceLogo}
{SourceLink}
{/block:NoSourceLogo} -->
{/block:ContentSource}
</div>
<!--End entry-->
{/block:Posts}
</div>
<!-- End posts -->
{block:Pagination}
<div id="pager">
<div id="pagination">
{block:PreviousPage}
<span class="pagicon">
<a href="{PreviousPage}#container"><span class="sf sf-arrow-left"></span> NEWER </a>
</span>
{/block:PreviousPage}
<span class="pagicon">
<a href="#"><span class="sf sf-arrow-up"></span> TOP </a></span>
{block:NextPage}
<a class="next" href="{NextPage}#container"> OLDER <span class="sf sf-arrow-right"></span></a>
</span>
{/block:NextPage}
</div>
<!--End pagination-->
<div id="iscroll">
{block:ifLoadMore}
<span class="pagicon">
<a href="#"><span class="sf sf-arrow-up"></span> TOP </a>
</span>
<a href="#" class="load-more"> MORE <span class="sf sf-plus-round"></span></a>
{/block:ifLoadMore}
</div>
<!--End iscroll-->
</div>
<!--End pager-->
{/block:Pagination}
{block:IndexPage}
<div id="footer">
<div id="socialicons">
{block:IfDisplayTumblr}<a href="{text:Tumblr url}" title="Tumblr"><span class="sf sf-tumblr"></span></a>{/block:IfDisplayTumblr}
{block:IfDisplayFacebook}<a href="{text:Facebook url}" target = "_blank" title="facebook"><span class="sf sf-facebook"></span></a>{/block:IfDisplayFacebook}
{block:IfDisplayPinterest}<a href="{text:Pinterest url}" title="Pinterest"><span class="sf sf-pinterest"></span></a>{/block:IfDisplayPinterest}
{block:IfDisplayLinkedin}<a href="{text:Linkedin url}" title="Linkedin"><span class="sf sf-linkedin"></span></i></a>{/block:IfDisplayLinkedin}
{block:IfDisplayInstagram}<a href="{text:Instagram url}" title="instagram"><span class="sf sf-instagram"></span></a>{/block:IfDisplayInstagram}
</div>
<!--End socialicons-->
{block:IfDisplayAvatar}
<div id="footer_avatar"><img src="{image:Avatar}"></div>
{/block:IfDisplayAvatar}
@ COPYRIGHT 2015 - 2017 | THEME BY <a href="https://hunterthemes.tumblr.com"> HUNTER THEMES</a>
</div>
<!-- End footer -->
{/block:IndexPage}
</div>
<!--End container-->
</body>
<!----- SCRIPTS ----->
<!-- Saturn icons -->
<link href="https://dl.dropbox.com/s/50g6fbds3rh4m0j/saturnicons.css" rel="stylesheet">
<!--Jquery-->
<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.min.js"></script>
<!-- Style my tooltips -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
<script src="https://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
<script>
(function($){
$(document).ready(function(){
$("a[title]").style_my_tooltips({
tip_follows_cursor:true,
tip_delay_time: 90,
tip_fade_speed: 600,
attribute:"title"
});
});
})(jQuery);
</script>
<script>
<!--
function toggle_visibility(id) {
var e = document.getElementById(id);
if(e.style.display == 'block')
e.style.display = 'none';
else
e.style.display = 'block';
}
//-->
</script>
<!-- TABS/ALL-INN-ONE SCRIPTS -->
<script>
$(document).ready(function() {
$('.tabs .tab-links a').on('click', function(e) {
var currentAttrValue = $(this).attr('href');
// Show/Hide Tab links
$('.tabs ' + currentAttrValue).fadeIn(600).siblings().hide();
// Tabs active
$('.projects_panel ' + currentAttrValue).addClass('active').siblings().removeClass('active');
// Change/remove current tab to active
$(this).parent('li').addClass('active').siblings().removeClass('active');
e.preventDefault();
});
});
</script>
<script>
$(document).ready(function() {
$('#filterOptions li a').click(function() {
// fetch the class of the clicked item
var ourClass = $(this).attr('class');
// reset the active class on all the buttons
$('#filterOptions li').removeClass('active');
// update the active state on our clicked button
$(this).parent().addClass('active');
if(ourClass == 'all') {
// show all our items
$('#ourHolder').children('div.item').show();
}
else {
// hide all elements that don't share ourClass
$('#ourHolder').children('div:not(.' + ourClass + ')').hide();
// show all elements that do share ourClass
$('#ourHolder').children('div.' + ourClass).show();
}
return false;
});
});
</script>
<script>
$(document).ready(function(){
$("#linkone").click(function(){
$("#tab1").show();
});
$("#linktwo").click(function(){
$("#tab2").show();
});
$("#linkfour").click(function(){
$("#tab1").hide();
});
$("#linkfive").click(function(){
$("#tab1").hide();
$("#tab2").hide();
});
});
</script>
<!--Sticky menu-->
<script>
$(function(){
var stickyRibbonTop = $('#container').offset().top;
$(window).scroll(function(){
if( $(window).scrollTop() > stickyRibbonTop ) {
$('#menu').css({background:'{color:Accent}'});
} else {
$('#menu').css({background:'transparent'});
}
});
});
</script>
{block:IndexPage}
<script src="https://static.tumblr.com/6hsqxdt/QBym35odk/jquery.masonry.js"></script>
{block:ifInfiniteScrolling}
<script src="https://static.tumblr.com/wgijwsy/u2vm2hxv6/jquery.infinitescroll.min.js"></script>
{/block:ifInfiniteScrolling}
{/block:IndexPage}
<script>
$(document).ready(function(){
$('.photo-slideshow').pxuPhotoset({
lightbox: true,
rounded: false,
gutter: '1px',
photoset: '.photo-slideDisplay',
photoWrap: '.photo-data',
photo: '.pxu-photo'
});
{block:IndexPage}
var $container = $('#posts');
$container.masonry({ itemSelector: '.entry' });
$container.imagesLoaded(function(){
$container.masonry();
$container.find('.entry').animate({ opacity: 1, zIndex: 1 });
});
{block:ifInfiniteScrolling}
$container.infinitescroll({
itemSelector: '.entry',
navSelector: '.pagination',
nextSelector: '.next',
loadingImg: '',
loadingText: '<em></em>',
bufferPx: 2000
},
function( newElements ) {
var $newElems = $( newElements );
$newElems.find('.photo-slideshow').pxuPhotoset({
lightbox: true,
rounded: false,
gutter: '1px',
photoset: '.photo-slideshow',
photoWrap: '.photo-data',
photo: '.pxu-photo'
},
function(){
$container.masonry();
});
$newElems.imagesLoaded(function(){
$container.masonry( 'appended', $newElems );
$newElems.animate({ opacity: 1, zIndex: 1 });
});
});
{/block:ifInfiniteScrolling}
$container.infinitescroll({
itemSelector: ".entry",
navSelector: "#pagination",
nextSelector: ".next",
loadingImg: "",
loadingText: "<em></em>",
bufferPx: 10000,
extraScrollPx: 12000,
errorCallback: function() {
$('.load-more').fadeOut();
}
}, function(newElements) {
var $newElems = $(newElements).css({
opacity: 0
});
$newElems.imagesLoaded(function() {
$newElems.animate({
opacity: 1
});
$container.masonry('appended', $newElems,
true);
});
});
{block:ifLoadMore}
$(window).unbind('.infscr');
$('.load-more').click(function() {
$container.infinitescroll('retrieve');
return false
});
{/block:ifLoadMore}
{/block:IndexPage}
});
</script>
<link href="https://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
<script src="https://static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
{/block:IndexPage}
</html>
<!-- END HTML --> Pasted: Feb 2, 2018, 9:58:21 pm
Views: 812