Upload
roxana-stratulat
View
39
Download
0
Embed Size (px)
DESCRIPTION
Theme code for Tumblr
Citation preview
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!---
don't remove the credit
leave the credit if you want to use parts of the theme
--->
<meta name="color:Background" content="#ffffff" />
<meta name="color:Text" content="#000000" />
<meta name="color:AskBackground" content="#f2f0db" />
<meta name="color:AskText" content="#270005" />
<meta name="color:EntryBackground" content="#f9f0c9" />
<meta name="color:DescText" content="#c73100" />
<meta name="color:BlogTitle" content="#7a0d10" />
<meta name="color:BlogTitleBackground" content="#6a6428" />
<meta name="color:SidebarBackground" content="#fddfa0" />
<meta name="color:Bold" content="#7a0d10" />
<meta name="color:Italic" content="#d76f6c" />
<meta name="color:NormalLink" content="#b31b0e" />
<meta name="color:NormalLinkHover" content="#6a6428" />
<meta name="color:DescLink" content="#6a6428" />
<meta name="color:PostTitle" content="#740f06" />
<meta name="color:BlockquoteBorder" content="#7a0d10" />
<meta name="color:Navi1Background" content="#c94e25"/>
<meta name="color:Navi2Background" content="#d76f6c"/>
<meta name="color:Navi3Background" content="#f8bd45"/>
<meta name="color:Navi4Background" content="#6a6428"/>
<meta name="color:Navi1Text" content="#441505"/>
<meta name="color:Navi2Text" content="#310402"/>
<meta name="color:Navi3Text" content="#6d3139"/>
<meta name="color:Navi4Text" content="#033620"/>
<meta name="color:Pagination" content="#740f06"/>
<meta name="color:ChatOddBackground" content="#f9f0c9" />
<meta name="color:ChatOddText" content="#7a0d10" />
<meta name="color:ChatEvenBackground" content="#ed9430" />
<meta name="color:ChatEvenText" content="#661d05" />
<meta name="color:ChatEvenName" content="#b31b0e" />
<meta name="color:ChatOddName" content="#6a6428" />
<meta name="color:SidebarImageBorder" content="#c94e25"/>
<meta name="color:ArrowBackground" content="#c94e25"/>
<meta name="color:ArrowText" content="#7a0d10" />
<meta name="color:CustomLinkBackground" content="#c94e25"/>
<meta name="color:CustomLinkText" content="#7a0d10" />
<meta name="color:TagText" content="#270005" />
<meta name="color:TagLink" content="#ef8c87"/>
<meta name="color:TagLinkHover" content="#270005" />
<meta name="color:MusicPlayer" content="#d76f6c"/>
<meta name="color:MusicText" content="#310402"/>
<meta name="if:InfiniteScrolling" content="0" />
<meta name="if:ShowCaptions" content="0">
<meta name="if:FadingPhoto" content="1" />
<meta name="if:Big Posts" content="0" />
<meta name="if:Monochrome" content="0" />
<meta name="if:ShowTags" content="0" />
<meta name="if:MusicPlayer" content="1" />
<meta name="image:Image1" content="http://static.tumblr.com/ad5ae688e5458e3c22f4762a8be88929/7fjp0ap/8L2ml7nco/tumblr_static_3.jpg"/>
<meta name="image:Image2" content="http://static.tumblr.com/c5567771a155f6b94871f2fd37a64517/7fjp0ap/XIWml7oxo/tumblr_static_4.jpg" />
<meta name="image:Image3" content="http://static.tumblr.com/4eff582fd57ab6a355af4154087c58af/7fjp0ap/Ksbml7oy8/tumblr_static_8.jpg"/>
<meta name="image:Image4" content="http://static.tumblr.com/44c6bfbe09b4e559e6b8fd2f96f8ee19/7fjp0ap/WL6ml7p2h/tumblr_static_7.jpg" />
<meta name="image:Image5" content="http://static.tumblr.com/5c43aec51a1fc5ae1c93d343bcee5c18/7fjp0ap/7hOml7p0h/tumblr_static_1.jpg"/>
<meta name="image:Image6" content="http://static.tumblr.com/e6331143baafde2dbb43436cb0bd22f7/7fjp0ap/E8Lml7nbc/tumblr_static_6.jpg" />
<meta name="image:Image7" content="http://static.tumblr.com/302f0eb877075dc059eade7f92080b91/7fjp0ap/y2Cml7p2l/tumblr_static_2.jpg"/>
<meta name="image:Image8" content="http://static.tumblr.com/f9d993d82a940c7f3612544f107e1f8e/7fjp0ap/0KQml7oyo/tumblr_static_5.jpg" />
<meta name="image:Background" content="http://static.tumblr.com/dca01f7dd497dec93de9e7915b35263d/7fjp0ap/lFLml99t0/tumblr_static_bg2.png"/>
<meta name="image:CornerImage" content="" />
<meta name="image:MusicImage" content="http://media.tumblr.com/tumblr_m7vzqpkDar1r6o8v2.gif" />
<meta name="text:Background Repeat" content="repeat"/>
<meta name="text:MusicCode" content="code"/>
<meta name="text:MusicName" content="musique"/>
<meta name="text:Link1" content="" />
<meta name="text:Link1 URL" content="/"/>
<meta name="text:Link2" content="" />
<meta name="text:Link2 URL" content="/"/>
<meta name="text:Link3" content="" />
<meta name="text:Link3 URL" content="/"/>
<meta name="text:Link4" content="" />
<meta name="text:Link4 URL" content="/"/>
<meta name="text:Link5" content="" />
<meta name="text:Link5 URL" content="/"/>
<meta name="text:Link6" content="" />
<meta name="text:Link6 URL" content="/"/>
<meta name="text:Link7" content="" />
<meta name="text:Link7 URL" content="/"/>
<meta name="text:Link8" content="" />
<meta name="text:Link8 URL" content="/"/>
<head>
<link href='http://fonts.googleapis.com/css?family=Tulpen+One' rel='stylesheet' type='text/css'>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>{Title}</title>
<link rel="shortcut icon" href="{Favicon}">
<script src="http://static.tumblr.com/7fjp0ap/3muml55ib/modernizr.custom.js"></script>
<style type="text/css">
body {
background-image: url('{image:background}');
background-color: {color:background};
background-attachment: fixed;
background-repeat: {text:Background Repeat};
color: {color:text};
margin: 0;
}
@font-face {
font-family: "heather";
src: url('http://static.tumblr.com/7fjp0ap/yh5mcyonf/heather_.ttf');}
@font-face {
font-family: "neverwinter";
src: url('http://static.tumblr.com/7fjp0ap/G1tml9bjr/neverwinter.ttf');}
@font-face {
font-family: "matura";
src: url('http://static.tumblr.com/7fjp0ap/iHXml9bd9/maturasc.ttf');}
::-webkit-scrollbar-thumb {
background-color: {color:desctext};
height: 5px;
width: 8px;
}
::-webkit-scrollbar {
height: 5px;
width: 8px;
background-color: {color:sidebarbackground};
}
a{
color: {color:normallink};
text-decoration: none;
-webkit-transition: all 0.5s linear;
-moz-transition: all 0.5s linear;
-o-transition: all 0.5s linear;
}
a:hover{
color: {color:normallinkhover};
text-decoration: none;
}
#sidebar{
position: fixed;
overflow:hidden;
left: 20px;
top: 0px;
bottom:0px;
width:400px;
text-align: center;
padding: 1px;
padding-bottom:0px;
background-color: {color:sidebarbackground};
font-family: consolas;
font-size: 10px;
}
.border1{
position:fixed;
left:422px;
top:0px;
bottom:0px;
width:4px;
}
.border1x{
display:block;
width:100%;
height:25%;
}
.border2{
position:fixed;
left:16px;
top:0px;
bottom:0px;
width:4px;
}
#descbox0{
width: 294px;
padding: 3px;
border: 1px solid {color:desctext};
margin-top:20px;
display:inline-block;
text-align:center;
margin-left:3px;
}
#descbox{
width: 272px;
padding: 10px;
border: 1px solid {color:desctext};
color: {color:desctext};
font-family: calibri;
font-size: 11px;
display:inline-block;
text-align:center;
}
#descbox a{
color: {color:desclink};
}
#navibox{
margin-top:20px;
width: 302px;
display:inline-block;
margin-bottom:10px;
margin-left:4px;
}
#navibox a{
text-transform: none;
display: block;
float:left;
width: 25%;
padding:3px;
padding-left:0px;
padding-right:0px;
text-align: center;
font-family: calibri;
font-size: 10px;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
}
#titlebox{
display: inline-block;
margin-top:30px;
font-size: 25px;
letter-spacing:1px;
line-height:20px;
font-family: neverwinter;
width: 292px;
padding: 5px;
margin-left:3px;
background-color: {color:BlogTitleBackground};
text-align: center;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
}
#titlebox a{
color: {color:blogtitle};
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
}
#titlebox a:hover{
color: {color:blogtitlehover};
}
#pagi{
display:inline-block;
margin-top: 5px;
font-size: 20px;
margin-bottom:5px;
font-family: calibri;
z-index: 999;
}
#pagi a{
color:{color:pagination};
}
#posts{
{block:ifBigPosts}width: 530px;{/block:ifBigPosts}
{block:ifNotBigPosts}width: 430px;{/block:ifNotBigPosts}
margin-left: 490px;
margin-bottom: 40px;
}
img.center {
display: block;
margin-left: auto;
margin-right: auto;
}
#entry{
{block:ifBigPosts}width: 520px;{/block:ifBigPosts}
{block:ifNotBigPosts}width: 420px;{/block:ifNotBigPosts}
position:relative;
margin-top: 30px;
z-index:999999;
overflow: hidden;
background-color: ;
-webkit-transition: all 0.9s ease;
-moz-transition: all 0.9s ease;
-o-transition: all 0.9s ease;
}
.entry{
{block:ifBigPosts}width: 500px;{/block:ifBigPosts}
{block:ifNotBigPosts}width: 400px;{/block:ifNotBigPosts}
text-align: left;
position:relative;
padding: 10px;
padding-bottom:0px;
z-index:999999;
font-family: calibri;
font-size: 12px;
overflow: hidden;
background-color: {color:entrybackground};
color: {color:text};
-webkit-transition: all 0.9s ease;
-moz-transition: all 0.9s ease;
-o-transition: all 0.9s ease;
}
.entry img{
{block:ifBigPosts}max-width: 500px;{/block:ifBigPosts}
{block:ifNotBigPosts}max-width: 400px;{/block:ifNotBigPosts}
{block:ifFadingPhoto}
opacity: 0.7;
-webkit-transition: all 0.7s ease-in-out;
-moz-transition: all 0.7s ease-in-out;
-o-transition: all 0.7s ease-in-out; {/block:ifFadingPhoto}
}
{block:ifFadingPhoto}
.entry img:hover{
opacity: 1;
}
.photosetfade {
opacity: 0.7;
filter:alpha(opacity=70);
-moz-opacity: 0.7;
-webkit-transition: all 0.7s linear;
-moz-transition: all 0.7s linear;
-o-transition: all 0.7s linear;
}
.photosetfade:hover {
opacity: 1;
filter:alpha(opacity=100);
-moz-opacity: 0.9;
}
{/block:ifFadingPhoto}
{block:ifMonochrome}
.mono{
filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 3.5+ */
filter: gray; /* IE6-9 */
-webkit-filter: grayscale(100%); /* Chrome 19+ & Safari 6+ */
-webkit-transition: all 0.7s linear;
-moz-transition: all 0.7s linear;
-o-transition: all 0.7s linear;
}
.mono:hover{
filter: none;
-webkit-filter: grayscale(0%);
}
{/block:ifMonochrome}
.entry b, strong{
color: {color:Bold};
}
b,strong{
color: {color:Bold};
}
.entry i, em{
color: {color:Italic};
}
.entry a{
color: {color:NormalLink};
text-decoration: none;
-webkit-transition: all 0.5s linear;
-moz-transition: all 0.5s linear;
-o-transition: all 0.5s linear;
}
.entry a:hover{
color: {color:NormalLinkHover};
text-decoration: none;
}
.entry h1 a{
color: {color:normallink};
}
blockquote{
border-left: 5px solid {color:blockquoteborder};
font-size: 12px;
padding-left:10px;
padding-right: 4px;
padding-top: 3px;
padding-bottom: 3px;
margin:5px;
text-align:justify;
}
.entry blockquote img{
max-width: 90%;
margin-left: 3px;
}
#quote{
color: {color:Quote};
padding: 15px;
font-family: heather;
letter-spacing: 1px;
line-height: 10px;
}
#perma{
margin-bottom:-2px;
margin-left:-10px;
{block:ifBigPosts}width: 520px;{/block:ifBigPosts}
{block:ifNotBigPosts}width: 420px;{/block:ifNotBigPosts}
margin-top: 10px;
display: inline-block;
background-color: {color:navi4background};
}
#perma a{
font-family: calibri;
font-size: 9px;
letter-spacing: 1px;
display:block;
float:left;
width:32%;
text-align:center;
height:100%;
padding: 2px;
font-style: none;
}
#entry:hover #tags{
margin-top:0px;
height:25px;
overflow:auto;
-webkit-transition: all 0.8s ease;
-moz-transition: all 0.8s ease;
-o-transition: all 0.8s ease;
}
#tags{
font-family: calibri;
font-size: 9px;
letter-spacing: 1px;
width: 100px;
margin-top: -6px;
padding: 3px;
{block:ifBigPosts}width: 520px;{/block:ifBigPosts}
{block:ifNotBigPosts}width: 420px;{/block:ifNotBigPosts}
position:relative;
overflow:hidden;
height:0px;
color: {color:Tagtext};
background: transparent;
z-index:-1;
text-align: left;
-webkit-transition: all 0.8s ease;
-moz-transition: all 0.8s ease;
-o-transition: all 0.8s ease;
}
#tags a{
color: {color:TagLink};
font-style: none;
}
#tags a:hover {
color: {color:TagLinkHover};
font-style: none;
}
.permalink {
font-family: calibri;
font-size: 10px;
color: {color:Text};
text-transform: uppercase;
text-align: center;
{block:ifBigPosts}width: 514px;{/block:ifBigPosts}
{block:ifNotBigPosts}width: 414px;{/block:ifNotBigPosts}
margin-top: 20px;
margin-bottom: 10px;
margin-left: -10px;
float: left;
background-color: {color:entrybackground};
}
.permalink b {
color: {color:Bold};
font-weight: normal;
}
#date {
color: {color:text};
}
.permalink a {
color: {color:NormalLink};
text-decoration: none;
}
.title{
color: {color:posttitle};
margin-bottom:10px;
padding-top: 5px;
padding-bottom: 5px;
font-size: 28px;
font-family: matura;
line-height: 100%;
letter-spacing: 2px;
text-transform: none;
text-align: center;
border-bottom: 1px {color:Text} solid;
}
.ask {
{block:ifBigPosts}width: 480px;{/block:ifBigPosts}
{block:ifNotBigPosts}width: 380px;{/block:ifNotBigPosts}
display: inline-block;
padding: 10px;
line-height: 10px;
text-align: justify;
background-color: {color:askbackground};
font-family: comic;
color: {color:asktext};
font-size: 10px;
text-transform: none;
}
.ask i {
font-style: normal;
}
.ask b {
font-weight: normal;
}
.ask a{
float: left;
display: block;
margin-right: 5px;
font-family: calibri;
}
.askimg{
display: block;
float: left;
margin-right: 10px;
width: 48px;
height:48px;
border: 2px solid {color:entrybackground};
}
.askimg img{
width: 48px;
height: 48px;
}
iframe#tumblr_controls {
right:3px !important;
top:100%;
position:fixed !important;
opacity: 0.5;
filter:alpha(opacity=0.5);
-moz-opacity: 0.5;
-webkit-transition: all 0.5s linear;
-moz-transition: all 0.5s linear;
-o-transition: all 0.5s linear;
}
iframe#tumblr_controls:hover {
opacity: 1;
filter:alpha(opacity=1);
-moz-opacity: 1;
}
#source{
font-family: consolas;
font-size:7pt;
text-align: right;
margin-top: -5px;
}
ol.notes {
background-color:{color:EntryBackground};
font-family:tahoma;
font-size:10px;
padding-top:10px;
border: 0px;
padding-left:15px;
margin-top:10px;
{block:ifBigPosts}width:476px;{/block:ifBigPosts}
{block:ifNotBigPosts}width:376px;{/block:ifNotBigPosts}
margin-left: 0px;
list-style-type: none;}
ol.notes li.note {
background: ;
padding:5px;
{block:ifBigPosts}width:480px;{/block:ifBigPosts}
{block:ifNotBigPosts}width:380px;{/block:ifNotBigPosts}
letter-spacing: 0px;
text-align: left;
}
ol.notes li.note a{
color:{color:Link};
background: ;
font-family:tahoma;
text-transform:none;
letter-spacing:0px;
font-size:10px;}
ol.notes li.note img.avatar {
vertical-align: -4px;
margin-right: 0px;
}
#musicbox{
width: 270px;
height: 100px;
text-align: left;
}
.cover {
width:100px;
height: 100px;
display: block;
position:absolute;
z-index:2
}
.cover img{
width: 100px;
height: 100px;
}
.coverx{
width: 100px;
height: 100px;
display: block;
position:absolute;
z-index:1
}
.coverx img{
width: 100px;
height: 100px;
}
.playbutton {
width:20px;
height: 30px;
overflow: hidden;
position:relative;
z-index:100;
margin: 15px 24px 13px 16px;
}
.playbox {
opacity: 0.8;
background-color: #000000;
position: absolute;
z-index: 1000;
margin-top:23px;
margin-left:20px;
-webkit-border-radius:100px;
-moz-border-radius: 100px;
border-radius: 100px;
}
.audioplayer {
float:left;
margin-left: 100px;
position: absolute;
display: block;
margin-top: 10px;
padding-bottom:7px;
}
.infomusic {
text-align:left;
{block:ifbigposts}max-width: 390px;{/block:ifbigposts}
{block:ifnotbigposts}max-width: 290px;{/block:ifnotbigposts}
margin-left:10px;
padding:5px;
}
.odd .line {
background-color: {color:chatoddbackground};
padding: 3px;
margin-bottom:3px;
color:{color:chatoddtext};
}
.even .line {
background-color: {color:ChatEvenBackground};
padding:3px;
margin-bottom:3px;
color:{color:chateventext};
}
.odd .name {
color: {color:chatoddname};
padding: 3px;
}
.even .name {
color: {color:chatevenname};
padding: 3px;
}
/*START FROM HERE*/
.fc-slideshow {
position: relative;
width: 300px;
height: 300px;
box-shadow: inset 0 0 3px rgba(0,0,0,0.4), 0 0 0 10px {color:sidebarimageborder};
border-radius: 50%;
margin: 0 auto;
background: {color:sidebarimageborder};
-webkit-perspective: 1200px;
-moz-perspective: 1200px;
perspective: 1200px;
}
.fc-slideshow nav {
top: 0;
height: 100%;
width: 100%;
position: absolute;
z-index: 10000;
}
.fc-slideshow nav > div {
position: absolute;
height: 100%;
top: 0;
width: 50%;
}
.fc-slideshow nav .fc-left {
left: 0;
}
.fc-slideshow nav .fc-right {
right: 0;
}
.fc-slideshow nav > div span {
height: 33%;
width: 100%;
position: absolute;
left: 0;
cursor: pointer;
}
.fc-slideshow nav > div span:first-child {
top: 0;
}
.fc-slideshow nav > div span:nth-child(2) {
top: 33%;
}
.fc-slideshow nav > div span:nth-child(3) {
top: 66%;
}
.fc-slideshow nav i,
.no-csstransforms3d .fc-slideshow nav > div span {
position: absolute;
width: 100%;
height: 30px;
top: 50%;
margin-top: -20px;
pointer-events: none;
opacity: 0;
-webkit-backface-visibility: hidden;
-webkit-transition: all 0.2s ease;
-moz-backface-visibility: hidden;
-moz-transition: all 0.2s ease;
backface-visibility: hidden;
transition: all 0.2s ease;
}
/* Some fallbacks */
.no-csstransforms3d .fc-slideshow nav > div span {
z-index: 1000;
width: 30px;
background: rgba(0,0,0,0);
}
.no-csstransforms3d .fc-slideshow nav .fc-left span {
left: -80px;
}
.no-csstransforms3d .fc-slideshow nav .fc-right span {
right: -80px;
left: auto;
}
.no-csstransforms3d .fc-slideshow nav i {
width: 30px;
cursor: pointer;
}
.fc-slideshow nav .fc-left i {
-webkit-transform-origin: 100% 50%;
-moz-transform-origin: 100% 50%;
transform-origin: 100% 50%;
text-align: left;
}
.fc-slideshow nav .fc-right i {
-webkit-transform-origin: 0% 50%;
-moz-transform-origin: 0% 50%;
transform-origin: 0% 50%;
text-align: right;
}
.fc-slideshow nav i.icon-arrow-left {
left: 0;
}
.no-csstransforms3d .fc-slideshow nav i.icon-arrow-left {
left: -100px;
}
.fc-slideshow nav i.icon-arrow-right {
right: 0;
}
.no-csstransforms3d .fc-slideshow nav i.icon-arrow-right {
right: -60px;
}
.icon-arrow-left:before,
.icon-arrow-right:before {
font-family: calibri;
speak: none;
font-style: normal;
font-weight: normal;
font-size: 20px;
background: {color:arrowbackground};
color: {color:arrowtext};
width: 30px;
height: 30px;
line-height: 30px;
text-align: center;
display: inline-block;
margin: 0 20px;
border-radius: 20% 10% 50% 5% / 25% 10% 30% 75%;
-webkit-font-smoothing: antialiased;
}
.icon-arrow-left:before {
content: "\00AB";
}
.icon-arrow-right:before {
content: "\00BB";
}
.csstransforms3d .fc-slideshow nav > div span:hover ~ i,
.no-csstransforms3d .fc-slideshow nav i,
.no-csstransforms3d .fc-slideshow nav > div span {
opacity: 1;
}
.csstransforms3d .fc-slideshow nav > div span:nth-child(2):hover ~ i{
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
transform: rotate(0deg);
}
.csstransforms3d .fc-slideshow nav > .fc-left span:first-child:hover ~ i,
.csstransforms3d .fc-slideshow nav > .fc-right span:nth-child(3):hover ~ i {
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
transform: rotate(45deg);
}
.csstransforms3d .fc-slideshow nav > .fc-right span:first-child:hover ~ i,
.csstransforms3d .fc-slideshow nav > .fc-left span:nth-child(3):hover ~ i {
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
transform: rotate(-45deg);
}
ul.fc-slides {
list-style: none;
margin: 0;
padding: 0;
}
ul.fc-slides li {
display: none;
}
.no-js ul.fc-slides li {
display: block;
}
.fc-flip {
width: 100%;
height: 100%;
border-radius: 50%;
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
transform-style: preserve-3d;
}
.fc-flip div {
width: 100%;
height: 100%;
position: absolute;
border-radius: 50%;
top: 0;
left: 0;
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;
backface-visibility: hidden;
}
.fc-flip .fc-back {
-webkit-transform: rotateY(-180deg);
-moz-transform: rotateY(-180deg);
transform: rotateY(-180deg);
}
.fc-slideshow img {
width: 300px;
height: 300px;
border-radius: 50%;
}
.fc-slideshow a {
z-index:999999999;
position: absolute;
color: {color:customlinktext};
top: 73%;
margin-top: 30px;
line-height: 30px;
height: 30px;
left: 80px;
right: 80px;
background: {color:customlinkbackground};
font-size: 12px;
font-family:calibri;
text-transform: none;
text-align: center;
border-radius: 20% 10% 50% 5% / 25% 10% 30% 75%;
}
.fc-overlay-light,
.fc-overlay-dark {
opacity: 0;
}
.fc-overlay-light {
background: rgba(255,255,255,1);
}
.fc-overlay-dark {
background: rgba(0,0,0,1);
}
/* No JS fallback */
.no-js .fc-slideshow {
height: auto;
box-shadow: none;
}
.no-js .fc-slideshow h3 {
position: relative;
width: auto;
height: auto;
left: auto;
right: auto;
top: auto;
margin: 5px;
}
#container{
display:inline-block;
margin-top:30px;
width:300px;
}
/* MUSIC PLAYER */
#playertab{
position:fixed;
z-index:999;
bottom:0px;
right:-170px;
height:10px;
line-height:10px;
padding:7px 8px 3px 5px;
letter-spacing:2px;
background-color:{color:musicplayer};
-moz-border-radius:10px 0px 0px 0px;
border-radius:10px 0px 0px 0px;
-webkit-transition: opacity 1s linear;
-webkit-transition: all 1s ease-in-out;
-moz-transition: all 1s ease-in-out;
-o-transition: all 1s ease-in-out;
}
#mus{
float:left;
color:{color:musictext};
padding-right:100px;
-webkit-transition: opacity 1s linear;
-webkit-transition: all 1s ease-in-out;
-moz-transition: all 1s ease-in-out;
-o-transition: all 1s ease-in-out;
}
#playertab:hover #mus{
padding-right:0px;
opacity:0;
}
#playertab:hover{
right:0px;
}
{CustomCSS}
</style>
</head>
{block:IfInfiniteScrolling}
<script type="text/javascript" src="http://codysherman.com/tools/infinite-scrolling/code"></script>
{/block:IfInfiniteScrolling}
<body>
{block:ifmusicplayer}
<div id='playertab'>
<div id='mus'><img src='{image:musicimage}' style='margin-right:8px;'/> {text:musicname}</div>
<div style='float:left;width:120px'>{text:musiccode}</div>
</div>
<!--playertab-->
{/block:ifmusicplayer}
<div class="border1">
<div class="border1x" style="background-color:{color:navi1background};"></div>
<div class="border1x" style="background-color:{color:navi2background};"></div>
<div class="border1x" style="background-color:{color:navi3background};"></div>
<div class="border1x" style="background-color:{color:navi4background};"></div>
</div>
<div class="border2">
<div class="border1x" style="background-color:{color:navi4background};"></div>
<div class="border1x" style="background-color:{color:navi3background};"></div>
<div class="border1x" style="background-color:{color:navi2background};"></div>
<div class="border1x" style="background-color:{color:navi1background};"></div>
</div>
<div id="sidebar">
<center>
<div id="container">
<div id="fc-slideshow" class="fc-slideshow">
<ul class="fc-slides">
<li><img src="{image:image1}" />{block:ifLink1}<a href="{text:Link1 URL}">{text:Link1}</a>{/block:ifLink1}</li>
<li><img src="{image:image2}" />{block:ifLink2}<a href="{text:Link2 URL}">{text:Link2}</a>{/block:ifLink2}</li>
<li><img src="{image:image3}" />{block:ifLink3}<a href="{text:Link3 URL}">{text:Link3}</a>{/block:ifLink3}</li>
<li><img src="{image:image4}" />{block:ifLink4}<a href="{text:Link4 URL}">{text:Link4}</a>{/block:ifLink4}</li>
<li><img src="{image:image5}" />{block:ifLink5}<a href="{text:Link5 URL}">{text:Link5}</a>{/block:ifLink5}</li>
<li><img src="{image:image6}" />{block:ifLink6}<a href="{text:Link6 URL}">{text:Link6}</a>{/block:ifLink6}</li>
<li><img src="{image:image7}" />{block:ifLink7}<a href="{text:Link7 URL}">{text:Link7}</a>{/block:ifLink7}</li>
<li><img src="{image:image8}" />{block:ifLink8}<a href="{text:Link8 URL}">{text:Link8}</a>{/block:ifLink8}</li>
</ul>
</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script src="http://static.tumblr.com/7fjp0ap/MF0ml55gx/jquery.flipshow.js"></script>
<script>
$( function() {
$( '#fc-slideshow' ).flipshow();
} );
</script>
</div>
</center>
<center>
<div id="titlebox">
<a href="/">{Title}</a>
</div>
</center>
<center>
<div id="descbox0">
<div id="descbox">{Description}</div>
</div>
</center>
<center>
<div id="navibox">
<a href="/" style="background-color:{color:navi1background};color:{color:navi1text};">Home</a>
<a href="/ask" style="background-color:{color:navi2background};color:{color:navi2text};">Message</a>
<a href="/archive" style="background-color:{color:navi3background};color:{color:navi3text};">Archive</a>
<a href="http://a--themes.tumblr.com/" style="background-color:{color:navi4background};color:{color:navi4text};">Theme</a>
</div>
</center>
{block:IfNotInfiniteScrolling}
<center>
<div id="pagi">
{block:Pagination}
{block:PreviousPage}<a href="{PreviousPage}">« </a>{/block:PreviousPage}
{block:NextPage}<a href="{NextPage}"> »</a>{/block:NextPage}
{/block:Pagination}
</div>
</center>
{/block:IfNotInfiniteScrolling}
</div>
<div id="posts">
{block:Posts}
<div id="entry">
<div class="entry" >
{block:Text}
{block:Title}<div class="title">{Title}</div>{/block:Title}{Body}
{/block:Text}
{block:Photo}
{LinkOpenTag}<div class="mono"><img src="{PhotoURL-500}" class="center"></div>{LinkCloseTag}
{block:IfShowCaptions}{block:Caption}{Caption}{/block:Caption}{/block:IfShowCaptions}
{block:IfNotShowCaptions}{block:PermalinkPage}{block:Caption}
{Caption}
{/block:Caption}{/block:PermalinkPage}{/block:IfNotShowCaptions}
{/block:Photo}
{block:Photoset}
{block:IfBigPosts}<div class="mono"><div class="photosetfade">{Photoset-500}</div></div>{/block:IfBigPosts}
{block:IfNotBigPosts}<div class="mono"><div class="photosetfade">{Photoset-400}</div></div>{/block:IfNotBigPosts}
{block:IfShowCaptions}{block:Caption}{Caption}{/block:Caption}{/block:IfShowCaptions}
{block:IfNotShowCaptions}{block:PermalinkPage}{block:Caption}
{Caption}
{/block:Caption}{/block:PermalinkPage}{/block:IfNotShowCaptions}
{/block:Photoset}
{block:Link}
<div class="title">
<a href="{URL}" {Target}>{Name}</a>
</div>
{block:Description}{Description}{/block:Description}
{/block:Link}
{block:Quote}
<div id="quote">{Quote}</div>{block:Source} <div id="source"> —{Source}</div> {/block:Source}{/block:Quote}
{block:Chat}
{block:Title}
<div class="title">{Title}</div>
{/block:Title}
{block:Lines}<div class="{Alt}">
<div class="line">{block:Label}<span class="name">{Label}</span>{/block:Label} {Line}<br /></div></div>
{/block:Lines}
{/block:Chat}
{block:Audio}
<div id="musicbox">
<div class="playbox"><div class="playbutton">{block:AudioPlayer}{AudioPlayerBlack}{/block:AudioPlayer}</div></div>
<div class="coverx"><img src="http://media.tumblr.com/90911ce35307a2b68bb52c9794d02dd0/tumblr_inline_mgshunrUnn1r8s568.png"></div>
{block:AlbumArt}
<div class="cover"><img src="{AlbumArtURL}"></div>
{/block:AlbumArt}
<div class="audioplayer">
<div class="infomusic"> {block:Artist} <b>Artist:</b> {Artist}{/block:Artist}</div> <div class="infomusic"><b>Track:</b> {block:TrackName} "{TrackName}" {/block:TrackName}</div> <b> <div class="infomusic">Plays: </b> {PlayCountWithLabel} </div> </div></div>
{block:IfShowCaptions}{block:Caption}{Caption}{/block:Caption}{/block:IfShowCaptions}
{block:IfNotShowCaptions}{block:PermalinkPage}{block:Caption}
{Caption}
{/block:Caption}{/block:PermalinkPage}{/block:IfNotShowCaptions}
{/block:Audio}
{block:Video}
{block:IfBigPosts}{Video-500}{/block:IfBigPosts}
{block:IfNotBigPosts}{Video-400}{/block:IfNotBigPosts}
{block:IfShowCaptions}{block:Caption}{Caption}{/block:Caption}{/block:IfShowCaptions}
{block:IfNotShowCaptions}{block:PermalinkPage}{block:Caption}
{Caption}
{/block:Caption}{/block:PermalinkPage}{/block:IfNotShowCaptions}
{/block:Video}
{block:Answer}
<div class="ask"><div class="askimg"><img src="{AskerPortraitURL-128}"></div><i>{Asker}</i> <b>sent:</b><br /><br/>
{Question}</div>
{Answer}
{/block:Answer}
{block:PermalinkPage}
<div class="permalink">
<center><div id="date">{block:Date}posted {12Hour}:{Minutes} {AmPm} on {DayOfWeek}, {Month} {DayOfMonth}, {Year}{/block:Date} {block:NoteCount}with {NoteCountWithLabel}{/block:NoteCount}</div>{block:RebloggedFrom}<b>origin:</b> <a href="{ReblogRootURL}">{ReblogRootName}</a> | <b>via:</b> <a href="{ReblogParentURL}">{ReblogParentName}</a><br />{/block:RebloggedFrom}
{block:HasTags}<b>tags »</b> {block:Tags} #<a href="/tagged/{Tag}">{Tag}</a>{/block:Tags}{/block:HasTags}</center>
{block:PostNotes}
{PostNotes}
{/block:PostNotes}
</div>
{/block:PermalinkPage}
{block:IndexPage}
<div id="perma">
<a href="{ReblogURL}" style="background-color:{color:navi1background};color:{color:navi1text};">REBLOG</a> {block:Date}<a href="{Permalink}" style="background-color:{color:navi3background};color:{color:navi3text};">{TimeAgo}</a>{/block:Date}{block:NoteCount} <a href="{Permalink}" style="background-color:{color:navi4background};color:{color:navi4text};"> {NoteCountWithLabel}</a>{/block:NoteCount}
</div>
{/block:IndexPage}
</div>
{block:indexpage}
{block:IfShowTags}
{block:HasTags}
<div id="tags">
<b>tags:{block:Tags} <b>#</b><a href="/tagged/{Tag}">{Tag}</a>{/block:Tags}
</div>
{/block:HasTags}
{/block:IfShowTags}
{/block:indexpage}
</div>
{/block:Posts}
</div>