Permalink
Switch branches/tags
Nothing to show
Find file Copy path
Fetching contributors…
Cannot retrieve contributors at this time
1327 lines (1147 sloc) 33.4 KB
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>{title}</title>
<link rel="shortcut icon" href="{Favicon}">
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.nicescroll/3.6.8-fix/jquery.nicescroll.min.js"></script>
<meta name="color:container" content="#ffffff"/>
<meta name="color:general text color" content="#000000"/>
<meta name="color:first accent" content="#e4255e"/>
<meta name="color:second accent" content="#fcbc10"/>
<meta name="image:header200x300px" content="http://i.imgur.com/rkVGT1u.jpg"/>
<meta name="text:Link1URL" content=""/>
<meta name="text:Link1" content=""/>
<meta name="text:Link2URL" content=""/>
<meta name="text:Link2" content=""/>
<meta name="text:Link3URL" content=""/>
<meta name="text:Link3" content=""/>
<meta name="text:Link4URL" content=""/>
<meta name="text:Link4" content=""/>
<meta name="text:Link5URL" content=""/>
<meta name="text:Link5" content=""/>
<meta name="text:Link6URL" content=""/>
<meta name="text:Link6" content=""/>
<meta name="text:Link7URL" content=""/>
<meta name="text:Link7" content=""/>
<meta name="text:Link8URL" content=""/>
<meta name="text:Link8" content=""/>
<meta name="text:TwitterUsername" content=""/>
<meta name="text:FacebookUsername" content=""/>
<meta name="text:InstagramUsername" content=""/>
<meta name="text:YoutubeChannelCode" content=""/>
<meta name="text:Soundcloudtrackcode" content="226832561"/>
<script>
$(document).ready(function() {
{block:ifSoundcloudtrackcode}
var color = "{color:second accent}";
var musiclink = "https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/" + {text:Soundcloudtrackcode} + "&amp;color=" + color.replace('#', '') + "&amp;auto_play=false&amp;hide_related=true&amp;show_comments=false&amp;show_user=false&amp;show_reposts=fals";
$("#musplay").attr("src", musiclink);
{/block:ifSoundcloudtrackcode}
$('a[href*="#"]:not([href="#verybigmenu"])').click(function() {
if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
var target = $(this.hash);
target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
if (target.length) {
$('body').animate({
scrollTop: target.offset().top
}, 1000);
return false;
}
}
});
$("body, #smalldesk, #bigdesk").niceScroll({
cursorcolor:"{color:second accent}",
autohidemode: "false",
bouncescroll: "true",
cursorborderradius: "0px",
cursorborder: "1px solid {color:first accent}"
});
});
</script>
</head>
<style>
html,
body {
font-family: "Arial", serif;
font-size: 1em;
margin: 0;
padding: 0;
color: {color:general text color};
}
.quote,
#title,
#verybigmenu>a:not(.close) {
font-size: 2em;
margin-bottom: .25em;
font-weight: bold;
font-style: italic;
display: block;
margin-top: .25em;
}
img,
iframe {
max-width: 100%;
margin-bottom: 0;
}
#content {
width: 1100px;
margin: 14em auto;
word-break: break-word;
}
.title {
font-size: 3em;
font-weight: bold;
font-style: italic;
}
#header {
height: 200px;
width: calc(100% - 2em);
overflow: auto;
}
#smalldesk, #bigdesk {
line-height: 1.6em;
overflow: auto;
}
.clear:after,
.post:after,
.chat:after {
clear: both;
display: table;
content: "";
}
.links {
float: right;
font-size: 3em;
font-weight: bold;
font-style: italic;
}
.img {
width: 300px;
height: 200px;
background: url({image:header200x300px}) center {color:second accent};
margin: 0 1em 1em 0;
}
.hamburger {
margin-top: .5em;
float: right;
height: 1em;
margin-left: 15px;
}
.hamburger span,
.hamburger span:before,
.hamburger span:after {
width: 1em;
height: 5px;
border-radius: 2px;
display: block;
}
.hamburger span {
position: relative;
transition: .1s;
}
.hamburger span:before, .hamburger span:after {
content: "";
margin-bottom: .5em;
position: absolute;
transition: .5s;
}
.hamburger span:before {
top: -.3em;
}
.hamburger span:after {
bottom: -.8em;
}
#posts {
margin-top: 5em;
}
.post {
line-height: 1.8em;
margin-bottom: 3em;
}
.main-content {
width: 540px;
}
.secondary-content {
width: 440px;
}
.post:nth-child(odd) .main-content {
float: left;
margin-right: 2em;
}
.post:nth-child(even) .main-content {
float: right;
margin-left: 2em;
}
.post:nth-child(odd) .secondary-content {
float: right;
}
.post:nth-child(even) .secondary-content {
float: left;
}
.post:nth-child(odd) .secondary-content .info {
margin-left: -12em;
}
.post:nth-child(even) .secondary-content .info {
right: -12em;
position: relative;
float: right;
text-align: right;
}
.secondary-content .chat {
margin-top: 11em;
}
.main,
.main-content {
padding: 1em;
border-radius: 1em;
-webkit-box-shadow: 6px 6px 0px 0px rgba(0, 0, 0, 0.2);
-moz-box-shadow: 6px 6px 0px 0px rgba(0, 0, 0, 0.2);
box-shadow: 6px 6px 0px 0px rgba(0, 0, 0, 0.2);
}
.hamburger:hover span:before {
-ms-transform: rotate(45deg);
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
height: 10px;
top: 0;
}
.hamburger:hover span:after {
-ms-transform: rotate(-45deg);
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
height: 10px;
top: 0;
}
#wave,
#wave2 {
position: absolute;
height: 100px;
width: 100%;
}
#wave {
top:0;
}
.ball,
.ball2 {
display: block;
float: left;
width: calc(100% / 6);
height: 170px;
border-radius: 100%;
margin-top: 20px;
}
.ball2 {
margin-top: -85px;
}
.border {
border: 4px solid {color:second accent};
}
.caption {
color: {color:general text color};
padding: 1.3em;
-webkit-clip-path: polygon(10% 0, 90% 0, 100% 10%, 100% 84%, 87% 100%, 9% 100%, 0 75%, 0 11%);
clip-path: polygon(10% 0, 90% 0, 100% 10%, 100% 84%, 87% 100%, 9% 100%, 0 75%, 0 11%);
}
blockquote {
border-left: 2px solid {color:second accent};
padding-left: 1em;
}
.info {
font-size: .9em;
font-weight: bold;
width: 15em;
padding: 1em 3em;
margin-bottom: 1em;
margin-top: .5em;
float: left;
position: relative;
}
.info:after,
.info:before {
-webkit-clip-path: polygon(25% 0%, 100% 0%, 75% 100%, 0% 100%);
clip-path: polygon(25% 0%, 100% 0%, 75% 100%, 0% 100%);
width: 1em;
position: absolute;
content: "";
right: .5em;
top: .5em;
height: calc(100% - 1em);
}
.info:before {
right: 1.5em;
}
.secondary-content .info {
margin-top: 3em;
}
.info h2 {
margin: 0;
}
.tags {
font-size: .8em;
margin-top: 1em;
}
.tags a {
display: inline-block;
margin: .5em;
padding: .5em 1em;
font-weight: bold;
}
.note-count,
#pagination a {
display: block;
font-weight: 700;
padding: .5em;
font-size: 1.5em;
width: 40%;
-webkit-clip-path: polygon(16% 0, 100% 0%, 79% 100%, 0% 100%);
clip-path: polygon(16% 0, 100% 0%, 79% 100%, 0% 100%);
}
#pagination {
text-align: center;
margin: 1em auto 8em auto;
width: 100%;
}
#pagination a {
width: 10em;
display: inline-block!important;
}
.button {
width: 1em;
height: 1em;
padding: 1em;
display: inline-block;
margin: 1em .5em;
-webkit-clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
}
.button:nth-child(even) {
margin-top: 1.5em!important;
}
.audio {
width: 300px;
position: relative;
}
.audio-info {
width: 640px;
}
.player {
overflow: hidden;
width: 40px;
height: 40px;
padding: 2em 1.5em 1em 1.5em;
position: absolute;
top: calc(50% - 20px - 1em);
left: calc(50% - 20px - 1em);
-webkit-clip-path: polygon(50% 0%, 83% 12%, 100% 43%, 94% 78%, 68% 100%, 32% 100%, 6% 78%, 0% 43%, 17% 12%);
clip-path: polygon(50% 0%, 83% 12%, 100% 43%, 94% 78%, 68% 100%, 32% 100%, 6% 78%, 0% 43%, 17% 12%);
opacity: .8;
}
.chat ol li a img {
margin-right: .5em;
border-radius: .3em;
}
.chat ol {
list-style: none;
}
.chat ol li {
list-style: none;
margin: 0;
padding: 0;
margin: .5em 0;
width: 80%;
display: block;
padding: .5em;
border-radius: .3em;
-webkit-box-shadow: 6px 6px 0px 0px rgba(0, 0, 0, 0.2);
-moz-box-shadow: 6px 6px 0px 0px rgba(0, 0, 0, 0.2);
box-shadow: 6px 6px 0px 0px rgba(0, 0, 0, 0.2);
}
.chat ol li:nth-child(odd) {
float: left;
}
.chat ol li:nth-child(even) {
float: right;
}
.questions {
border-radius: .5em;
-webkit-box-shadow: 6px 6px 0px 0px rgba(0, 0, 0, 0.2);
-moz-box-shadow: 6px 6px 0px 0px rgba(0, 0, 0, 0.2);
box-shadow: 6px 6px 0px 0px rgba(0, 0, 0, 0.2);
}
.questions .icon {
position: absolute;
top: 1em;
left: -50px;
}
.questions>div {
padding: 1em 1em 1em 70px;
position: relative;
}
.q {
border-radius: .5em .5em 0 0;
}
.asker-person a {
font-weight: bold;
font-size: 1.3em;
font-style: italic;
}
#right {
float: right;
width: 11em;
}
#right .note-count {
display: none;
}
#right .info {
margin: 0;
}
#right .button {
margin: 1em 0 0 .5em;
}
.label {
font-weight: bold;
text-transform: uppercase;
font-size: .8em;
}
.caption-alternate {
border-top: 2px dotted {color:second accent};
border-bottom: 2px dotted {color:second accent};
padding: .5em 0;
margin: .5em 0;
}
#top,
#bottom {
position: fixed;
font-size: .9em;
width: 1em;
height: 60%;
}
#top {
top: 40%;
left: 1.5em;
}
#bottom {
top: 50%;
right: 1.5em;
}
#top:hover,
#bottom:hover {
opacity: .9;
}
#top>i,
#bottom>i {
display: block;
margin-bottom: .2em;
}
#top>span,
#bottom>span {
font-weight: bold;
text-transform: uppercase;
display: block;
height: 1em;
width: 10em;
}
#top>span {
-ms-transform: rotate(-90deg);
-webkit-transform: rotate(-90deg);
transform: rotate(-90deg);
margin-left: -4.7em;
margin-top: 1em;
}
#bottom>span {
-ms-transform: rotate(90deg);
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
height: .9em;
margin-left: -4.6em;
margin-bottom: 3em;
}
#verybigmenu {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 1;
display: none;
padding: 3em;
}
#verybigmenu>a:not(.close) {
text-shadow: 3px 3px 0px rgba(0, 0, 0, 0.2);
width: auto;
}
#verybigmenu:target {
display: block;
}
#bigdesk {
width: 300px;
float: left;
height: calc(100% - 2em - 6em);
margin-right: 1.5em;
font-size: .85em;
}
.close {
position: fixed;
z-index: 2;
top: 50%;
right: 1em;
font-size: 5em;
}
#social {
margin: 0.5em auto;
}
#social a {
display: inline-block;
margin: .5em;
padding: .3em 1em;
text-transform: uppercase;
font-weight: bold;
font-size: .7em;
}
.tumblr_blog {
text-transform: uppercase;
font-size: .8em;
font-weight: bold;
}
.iframe-controls--phone-mobile {
z-index: 0!important;
opacity: .8!important;
}
#musplay {
position: fixed;
width: 60px;
height: 90px;
overflow:hidden;
bottom: 1em;
left: 1em;
z-index: 2;
}
/*
==========================
COLOR DISTRIBUTIONS
==========================
*/
::-moz-selection {
background-color: {color:first accent};
color: {color:second accent};
}
::selection {
background-color: {color:first accent};
color: {color:second accent};
}
html,
body,
.hamburger:hover span,
.ball:nth-child(odd),
.ball2:nth-child(odd),
.info:hover:after,
.info:hover:before,
.note-count:hover {
background-color: {color:first accent}!important;
}
b,
em,
strong,
i,
a:hover,
.quote,
#title,
#verybigmenu>a,
.info:hover a,
.note-count,
#pagination a,
.chat ol li a,
.q,
.asker-person a,
.label {
color: {color:first accent};
}
a,
.title,
.note-count:hover,
#top:hover,
#bottom:hover,
#top>i,
#bottom>i {
text-decoration: none;
color: {color:second accent};
}
.hamburger span,
.hamburger span:before,
.hamburger span:after,
#wave,
#wave2,
.border:hover,
.info:after,
.info:before,
.chat ol li:nth-child(even),
.q,
#verybigmenu,
.ball:nth-child(even),
.ball2:nth-child(even),
.note-count,
#pagination a {
background-color: {color:second accent};
}
.main,
.main-content,
.caption,
.button,
.player,
.chat ol li:nth-child(odd),
.questions {
background: {color:container};
}
.caption-alternate,
#verybigmenu a span {
color: {color:container};
}
/*
==========================
RESPONSIVE SETTINGS
==========================
*/
@media (max-width: 1024px) {
#content {
width: 900px;
}
.main-content,
.secondary-content {
width: 400px;
}
}
@media (max-width: 800px) {
#content {
width: calc(500px + 2em);
}
.main-content,
.secondary-content {
width: 500px;
margin: 0 auto!important;
float: none!important;
}
.secondary-content .chat {
margin-top: 0;
}
.info {
position: relative;
margin: 1em auto!important;
text-align: center;
float: none!important;
right: 0!important;
width: calc(100% - 6em - 10px);
}
#right {
float: none;
width: 100%;
}
#header .img {
width: 200px;
float: none;
}
.title,
#bigdesk {
display: none;
}
#header #smalldesk {
width: calc(100% - 300px - 1em);
font-size:.8em;
}
.links {
font-size: 1.8em;
}
#bigdesk>a {
font-size: 1.5em;
}
.close {
top: .5em;
right: .5em;
font-size: 2em;
}
}
@media (min-width: 560px) {
#header .img {
position: absolute;
}
#header #smalldesk {
width: calc(100% - 200px - 1em);
max-height: 200px;
overflow: auto;
float: right;
margin: 0;
vertical-align: top;
}
}
@media (max-width: 560px) {
#content {
width: 80%;
}
.main-content,
.secondary-content {
width: calc(100% - 2em);
}
#header #smalldesk {
width: 100%;
height: auto;
}
#top {
left: .5em;
}
#bottom {
right: .3em;
}
#header {
height: auto;
}
#header .img {
width: 100%!important;
position: none;
}
}
@media (min-width: 800px) {
#header #smalldesk {
width: calc(100% - 300px - 1em);
max-height: 200px;
}
.secondary-content .caption {
margin-top: 7em;
}
}
</style>
<body>
<iframe width="100%" height="166" scrolling="no" frameborder="no" id="musplay"></iframe>
<div id="verybigmenu">
<a href="#" class="fa close fa-times accent-one-text"></a>
<div id="bigdesk" class="clear main">
<div class="img"></div>
<center><a id="title" href="/">{title}</a></center>
<p>{description}</p>
<div id="social">
<center>
{block:ifTwitterUsername}<a class="border" href="http://twitter.com/{text:TwitterUsername}" target="_blank"><i class="fa fa-twitter" aria-hidden="true"></i></a>{/block:ifTwitterUsername}
{block:ifInstagramUsername}<a class="border" href="http://instagram.com/{text:InstagramUsername}" target="_blank"><i class="fa fa-instagram" aria-hidden="true"></i></a>{/block:ifInstagramUsername}
{block:ifFacebookUsername}<a class="border" href="http://facebook.com/{text:FacebookUsername}" target="_blank"><i class="fa fa-facebook" aria-hidden="true"></i></a>{/block:ifFacebookUsername}
{block:ifYoutubeChannelCode}<a class="border" href="http://youtube.com/channel/{text:YoutubeChannelCode}" target="_blank"><i class="fa fa-youtube" aria-hidden="true"></i></a>{/block:ifYoutubeChannelCode}
</center>
</div>
</div>
<a href="/"><span>01.</span> Home</a>
<a href="/"><span>02.</span> Message</a>
<a href="/"><span>03.</span> Archive</a>
<a href="/"><span>04.</span> Theme</a>
{block:iflink1}<a href="{text:Link1URL}"><span>05.</span> {text:Link1}</a>{/block:iflink1}
{block:iflink2}<a href="{text:Link2URL}"><span>06.</span> {text:Link2}</a>{/block:iflink2}
{block:iflink3}<a href="{text:Link3URL}"><span>07.</span> {text:Link3}</a>{/block:iflink3}
{block:iflink4}<a href="{text:Link4URL}"><span>08.</span> {text:Link4}</a>{/block:iflink4}
{block:iflink5}<a href="{text:Link5URL}"><span>09.</span> {text:Link5}</a>{/block:iflink5}
{block:iflink6}<a href="{text:Link6URL}"><span>10.</span> {text:Link6}</a>{/block:iflink6}
{block:iflink7}<a href="{text:Link7URL}"><span>11.</span> {text:Link7}</a>{/block:iflink7}
{block:iflink8}<a href="{text:Link8URL}"><span>12.</span> {text:Link8}</a>{/block:iflink8}
</div>
<div id="wave">
<div class="ball"></div>
<div class="ball"></div>
<div class="ball"></div>
<div class="ball"></div>
<div class="ball"></div>
<div class="ball"></div>
</div>
<a id="top" href="#wave">
<i class="fa fa-caret-up" aria-hidden="true"></i>
<i class="fa fa-caret-up" aria-hidden="true"></i>
<i class="fa fa-caret-up" aria-hidden="true"></i>
<span>To The Top</span>
</a>
<a id="bottom" href="#wave2">
<span>To The Bottom</span>
<i class="fa fa-caret-down" aria-hidden="true"></i>
<i class="fa fa-caret-down" aria-hidden="true"></i>
<i class="fa fa-caret-down" aria-hidden="true"></i>
</a>
<div id="content" class="clear">
<div id="nav">
<a class="title" href="/">{title}</a>
<section class="links">
<a href="/">01.</a>
<a href="/ask" title="message">02.</a>
<a href="/archive" title="archive">03.</a>
<a href="http://hellolittlered.org" title="theme" target="_blank">04.</a>
{block:iflink1}
<a href="{text:Link1URL}" title="{text:Link1}">05.</a>
{/block:iflink1}
{block:iflink2}
<a class="hamburger" href="#verybigmenu">
<span></span>
</a>
{/block:iflink2}
</section>
<div id="header" class="clear main">
<div class="img"></div>
<div id="smalldesk">
{description}
<div id="social">
<center>
{block:ifTwitterUsername}<a class="border" href="http://twitter.com/{text:TwitterUsername}" target="_blank"><i class="fa fa-twitter" aria-hidden="true"></i> Twitter</a>{/block:ifTwitterUsername}
{block:ifInstagramUsername}<a class="border" href="http://instagram.com/{text:InstagramUsername}" target="_blank"><i class="fa fa-instagram" aria-hidden="true"></i> Instagram</a>{/block:ifInstagramUsername}
{block:ifFacebookUsername}<a class="border" href="http://facebook.com/{text:FacebookUsername}" target="_blank"><i class="fa fa-facebook" aria-hidden="true"></i> Facebook</a>{/block:ifFacebookUsername}
{block:ifYoutubeChannelCode}<a class="border" href="http://youtube.com/channel/{text:YoutubeChannelCode}" target="_blank"><i class="fa fa-youtube" aria-hidden="true"></i> Youtube</a>{/block:ifYoutubeChannelCode}
</center>
</div>
</div>
</div>
<div id="posts">
{block:Posts}
<div class="post" class="clear">
{block:Quote}
<div class="main">
<div class="quote">“{Quote}”</div>
{block:Source}<div id="source">&mdash; {Source}</div>{/block:Source}
<div class="tags">
{block:HasTags}
{block:Tags}
<a href="{TagURL}" class="border">#{tag} </a>
{/block:Tags}
{/block:HasTags}
</div>
</div>
{block:Date}
<div class="info border">
<a href="{Permalink}">
<h2>{12HourWithZero}:{Minutes}:{Seconds} {CapitalAmPm}</h2>
{DayOfWeek}, {DayOfMonthWithZero} {Month} {Year}
</a>
</div>
{/block:Date}
<div id="right">
<center>
<span class="button">{ReblogButton color="black"}</span>
<span class="button">{LikeButton color="black"}</span>
</center>
</div>
{/block:Quote}
{block:Text}
<div class="main">
{block:Title}
<div id="title">{Title}</div>
{/block:Title}
{Body}
<div class="tags">
{block:HasTags}
{block:Tags}
<a href="{TagURL}" class="border">#{tag} </a>
{/block:Tags}
{/block:HasTags}
</div>
</div>
{block:Date}
<div class="info border">
<a href="{Permalink}">
<h2>{12HourWithZero}:{Minutes}:{Seconds} {CapitalAmPm}</h2>
{DayOfWeek}, {DayOfMonthWithZero} {Month} {Year}
</a>
</div>
{/block:Date}
<div id="right">
<span class="button">{ReblogButton color="black"}</span>
<span class="button">{LikeButton color="black"}</span>
</div>
{/block:Text}
{block:Link}
<div class="main">
<div id="title"><a href="{URL}">{Name}</a></div
>{block:Description}{Description}{/block:Description}
<div class="tags">
{block:HasTags}
{block:Tags}
<a href="{TagURL}" class="border">#{tag} </a>
{/block:Tags}
{/block:HasTags}
</div>
</div>
{block:Date}
<div class="info border">
<a href="{Permalink}">
<h2>{12HourWithZero}:{Minutes}:{Seconds} {CapitalAmPm}</h2>
{DayOfWeek}, {DayOfMonthWithZero} {Month} {Year}
</a>
</div>
{/block:Date}
<div id="right">
<center>
<span class="button">{ReblogButton color="black"}</span>
<span class="button">{LikeButton color="black"}</span>
</center>
</div>
{/block:Link}
{block:Chat}
{block:Title}
<div id="title">{Title}</div>
{/block:Title}
<div class="tags">
{block:HasTags}
{block:Tags}
<a href="{TagURL}" class="border">#{tag} </a>
{/block:Tags}
{/block:HasTags}
</div>
<div class="chat clear">
<ol>{block:Lines}
<li class="line {Alt}">
{block:Label}
<span class="label">
{Label}
</span>
{/block:Label}
{Line}
</li>
{/block:Lines}
</ol>
</div>
{block:Date}
<div class="info border">
<a href="{Permalink}">
<h2>{12HourWithZero}:{Minutes}:{Seconds} {CapitalAmPm}</h2>
{DayOfWeek}, {DayOfMonthWithZero} {Month} {Year}
</a>
</div>
{/block:Date}
<div id="right">
<center>
<span class="button">{ReblogButton color="black"}</span>
<span class="button">{LikeButton color="black"}</span>
</center>
</div>
{/block:Chat}
{block:Photo}
<div class="main-content">
{LinkOpenTag}<img src="{PhotoURL}" alt="{PhotoAlt}"/>{LinkCloseTag}
</div>
<div class="secondary-content clear">
{block:Date}
<div class="info border">
<a href="{Permalink}">
<h2>{12HourWithZero}:{Minutes}:{Seconds} {CapitalAmPm}</h2>
{DayOfWeek}, {DayOfMonthWithZero} {Month} {Year}
</a>
</div>
{/block:Date}
{block:Caption}
<div class="caption">{Caption}</div>
{/block:Caption}
<center>
<div class="tags">
{block:HasTags}
{block:Tags}
<a href="{TagURL}" class="border">#{tag} </a>
{/block:Tags}
{/block:HasTags}
</div>
{block:NoteCount}
<a class="note-count border" href="{Permalink}#notes">{NoteCount}</a>
{/block:NoteCount}
<span class="button">{ReblogButton color="black"}</span>
<span class="button">{LikeButton color="black"}</span>
</center>
</div>
{/block:Photo}
{block:Photoset}
<div class="main-content">
{Photoset}
</div>
<div class="secondary-content clear">
{block:Date}
<div class="info border">
<a href="{Permalink}">
<h2>{12HourWithZero}:{Minutes}:{Seconds} {CapitalAmPm}</h2>
{DayOfWeek}, {DayOfMonthWithZero} {Month} {Year}
</a>
</div>
{/block:Date}
{block:Caption}
<div class="caption">{Caption}</div>
{/block:Caption}
<center>
<div class="tags">
{block:HasTags}
{block:Tags}
<a href="{TagURL}" class="border">#{tag} </a>
{/block:Tags}
{/block:HasTags}
</div>
{block:NoteCount}
<a class="note-count border" href="{Permalink}#notes">{NoteCount}</a>
{/block:NoteCount}
<span class="button">{ReblogButton color="black"}</span>
<span class="button">{LikeButton color="black"}</span>
</center>
</div>
{/block:Photoset}
{block:Video}
<div class="main-content">
{Video}
</div>
<div class="secondary-content clear">
{block:Date}
<div class="info border">
<a href="{Permalink}">
<h2>{12HourWithZero}:{Minutes}:{Seconds} {CapitalAmPm}</h2>
{DayOfWeek}, {DayOfMonthWithZero} {Month} {Year}
</a>
</div>
{/block:Date}
{block:Caption}
<div class="caption">{Caption}</div>
{/block:Caption}
<center>
<div class="tags">
{block:HasTags}
{block:Tags}
<a href="{TagURL}" class="border">#{tag} </a>
{/block:Tags}
{/block:HasTags}
</div>
{block:NoteCount}
<a class="note-count border" href="{Permalink}#notes">{NoteCount}</a>
{/block:NoteCount}
<span class="button">{ReblogButton color="black"}</span>
<span class="button">{LikeButton color="black"}</span>
</center>
</div>
{/block:Video}
{block:Audio}
<div class="main-content audio">
<div class="player">{AudioPlayerWhite}</div>
{block:AlbumArt}
<img src="{AlbumArtURL}">
{/block:AlbumArt}
</div>
<div class="secondary-content audio-info clear">
{block:Date}
<div class="info border">
<a href="{Permalink}">
<h2>{12HourWithZero}:{Minutes}:{Seconds} {CapitalAmPm}</h2>
{DayOfWeek}, {DayOfMonthWithZero} {Month} {Year}
</a>
</div>
{/block:Date}
<div class="chat clear">
<ol>
{block:TrackName}
<li class="line">
<span class="label">Title:</span> {TrackName}
</li>
{/block:TrackName}
{block:Artist}
<li class="line">
<span class="label">Artist:</span> {Artist}
</li>
{/block:Artist}
{block:Album}
<li class="line">
<span class="label">Album:</span> {Album}
</li>
{/block:Album}
{block:PlayCount}
<li class="line">
<span class="label">Played:</span> {PlayCountWithLabel}
</li>
{/block:PlayCount}
</ol>
</div>
{block:Caption}
<div class="caption-alternate">{Caption}</div>
{/block:Caption}
<center>
<div class="tags">
{block:HasTags}
{block:Tags}
<a href="{TagURL}" class="border">#{tag} </a>
{/block:Tags}
{/block:HasTags}
</div>
{block:NoteCount}
<a class="note-count border" href="{Permalink}#notes">{NoteCount}</a>
{/block:NoteCount}
<span class="button">{ReblogButton color="black"}</span>
<span class="button">{LikeButton color="black"}</span>
</center>
</div>
{/block:Audio}
{block:Answer}
<div class="questions">
<div class="q">
<img class="icon border" src="{AskerPortraitURL-96}">
<div class="asker-person">{Asker} chirps: </div>
{Question}</div>
<div class="a">
{block:Answerer}
<img class="icon border" src="{AnswererPortraitURL-96}">
{/block:Answerer}
{Answer}
</div>
<div class="tags">
{block:HasTags}
{block:Tags}
<a href="{TagURL}" class="border">#{tag} </a>
{/block:Tags}
{/block:HasTags}
</div>
</div>
{block:Date}
<div class="info border">
<a href="{Permalink}">
<h2>{12HourWithZero}:{Minutes}:{Seconds} {CapitalAmPm}</h2>
{DayOfWeek}, {DayOfMonthWithZero} {Month} {Year}
</a>
</div>
{/block:Date}
{block:Caption}
<div class="caption">{Caption}</div>
{/block:Caption}
<div id="right">
<center>
<span class="button">{ReblogButton color="black"}</span>
<span class="button">{LikeButton color="black"}</span>
</center>
</div>
{/block:Answer}
</div>
{block:PostNotes}
<div id="notes" class="chat clear">
{PostNotes}
</div>
{/block:PostNotes}
{/block:Posts}
{block:ContentSource}
<!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
{/block:SourceLogo}
{block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
{/block:ContentSource}
</div>
</div>
</div>
{block:Pagination}
<div id="pagination">
{block:PreviousPage}
<a href="{PreviousPage}">&#171; Prev</a>
{/block:PreviousPage}
{block:NextPage}
<a href="{NextPage}">Next &#187;</a>
{/block:NextPage}
</div>
{/block:Pagination}
<div id="wave2">
<div class="ball2"></div>
<div class="ball2"></div>
<div class="ball2"></div>
<div class="ball2"></div>
<div class="ball2"></div>
<div class="ball2"></div>
</div>
</body>
</html>