48 // F O O L S

<!DOCTYPE html>
<head>

<!--------------------------------------------

            48 // F O O L S
            ,,,,, by chircn
            * thanks to @clumhood
            * for the base code !

--------------------------------------------->

<!----------- BASE CODE by clumhood :> ------------>

<title>{Title}</title>
<link rel="shortcut icon" href="{Favicon}">
<link rel="alternate" type="application/rss+xml" href="{RSS}">
{block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}


<!--------DEFAULT VARIABLES-------->

<meta name="color:Background" content="#ffffff"/>
<meta name="color:Text" content="#000000"/>
<meta name="color:Links" content="#626262"/>
<meta name="color:Links Hover" content="#a5a5a5"/>
<meta name="color:Question" content="#f8f8f8"/>
<meta name="color:Scrollbar" content="#000000"/>
<meta name="color:Scrollbar Background" content="#ffffff"/>

<meta name="text:Post Size" content="300px"/>
<meta name="text:Link 1 Title" content="aeroplanes"/>
<meta name="text:Link 1 Url" content=""/>
<meta name="text:Link 2 Title" content="tanqueray"/>
<meta name="text:Link 2 Url" content=""/>
<meta name="text:Link 3 Title" content="quiet nights"/>
<meta name="text:Link 3 Url" content=""/>

<!----------------SCRIPTS---------------->

<link href="http://static.tumblr.com/5omyijl/bzrn2yg7i/style-my-tooltips.css" rel="stylesheet" type="text/css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
<script src="http://static.tumblr.com/5omyijl/RZtn2yg9v/jquery.style-my-tooltips.js"></script>
<script>
(function($){
$(document).ready(function(){
$("[title]").style_my_tooltips({
tip_follows_cursor:true,
tip_delay_time:200,
tip_fade_speed:300
});
});
})(jQuery);
</script>

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">

<link href='http://fonts.googleapis.com/css?family=Open+Sans:300,300italic,400,400italic,600,600italic,700,700italic' rel='stylesheet' type='text/css'>


    <style type="text/css">

/*----------SCROLLBAR---------*/

::-webkit-scrollbar {
background-color: {color:scrollbar bg};
height:8px;
width:5px;
}

::-webkit-scrollbar-thumb:vertical {
background-color:{color:scrollbar};
height:50px;
}

::-webkit-scrollbar-thumb:horizontal {
background-color:{color:scrollbar bg};
height:8px;
}

/*----------TOOLTIPS---------*/

#s-m-t-tooltip {
max-width:300px;
margin:15px;
padding:5px;
border:1px solid #eeeeee;
border-radius:0px;
background:#ffffff;
color:{color:text};
z-index:999999;
font-size:7px;
font-style:none;
letter-spacing:2px;
font-family:'Open Sans',Helvetica,Arial,sans-serif;
text-transform:uppercase;
box-shadow:1px 1px 3px rgba(0,0,0,.0);
}

/*----------BASICS---------*/

body {
    background:{color:background};
    color:{color:text};
    font-family:'Open Sans',Helvetica,Arial,sans-serif;
    font-size:10px;
    line-height:150%;
    margin:0;
    text-align:left;
}


a {
    color:{color:links};
    text-decoration:none;
}

a:hover {
    color:{color:links hover};
    transition:1s;
    -webkit-transition:1s;
    -moz-transition:1s;
    -o-transition:1s;
}

img {
    opacity:1;
    text-decoration:none;
}

h1 {
    font-size:14px;
    font-weight:bold;
    font-family:'Open Sans',Helvetica,Arial,sans-serif;
    line-height:150%;
    text-transform:uppercase;
}

blockquote {
    padding-left:10px;
    margin:10px;
    border-left:1px solid #eee;
}

/*----------SIDEBAR---------*/

.sidebar {
    position:fixed;
    top:130px;
    width:140px;
    border:1px solid #eee;
    padding:10px;
    margin-left:350px;
}

.title {
    font-size:20px;
    letter-spacing:-1px;
    text-transform:lowercase;
    font-weight:bold;
    margin-top:10px;
}

.title a:hover{
    cursor:help;
}

.description {
    text-align:justify;
    margin-top:0px;
    font-size:9px;
    padding-bottom:10px;
    border-bottom:1px solid #eee;
}

.links {
    margin-top:0px;
    margin-bottom:10px;
}

.links a {
    display:block;
    padding:8px;
    font-size:7px;
    font-family:verdana;
    color:#000;
    text-transform:uppercase;
    margin-top:5px;
    letter-spacing:2px;
    border-bottom:1px solid #eee;
    -webkit-transition:0.3s;
    -moz-transition:0.3s;
    -o-transition:0.3s;
}

.links a:hover{
    cursor:help;
    letter-spacing:3px;
    color:#000;
    -webkit-transition:0.3s;
    -moz-transition:0.3s;
    -o-transition:0.3s;
}

/*----------PAGINATION---------*/

.pagination {
    width:{text:post size};
    padding:10px;
    margin-bottom:50px;
    text-align:center;
    letter-spacing:1px;
    text-transform:uppercase;
    font-size:9px;
    font-style:italic;
}

.pagination a{
    border-top:1px solid #f5f5f5;
    padding-top:3px;
}

/*----------POSTS---------*/

.entries {
    margin-left:600px;
    margin-top:50px;
    width: {text:post size};
}

.posts {
    width: {text:post size};
    margin-bottom:50px;
    text-align:justify;
}


/*----------QUOTE---------*/

.quote {
    padding:10px;
    font-size:15px;
    text-align:left;
}

.quotesource {
    padding:10px;
    text-align:center;
}

/*----------CHAT---------*/

.chat {
    line-height:150%;
    list-style:none;
}

.line.odd {
    padding:10px;
    background:#f8f8f8;
}

.line.even {
    padding:10px;
}

.label {
    text-transform:uppercase;
    font-size:10px;
    letter-spacing:1px;
    font-weight:bold;
}

/*----------AUDIO---------*/

.cover {
    position:relative;
    z-index:1;
    max-width:100px;
    padding:10px;
    float:left;
}

.playbutton {
    width:20px;
    height:30px;
    overflow:hidden;
    position:relative;
    z-index:2;

}


.playbox {
    background-color:#000;
    position:absolute;
    z-index:2;
    padding:15px 24px 13px 16px;
    margin-top:20px;
    margin-left:20px;
    opacity:0.5;
}

.trackdetails {
    padding:10px;
    width:auto;
    height:100px;
    margin-top:20px;
}

/*----------ASK---------*/

.question {
    padding:10px;
    background:{color:question};
}


.asker {
    text-transform:uppercase;
}

.answer {
    margin:10px;
}

/*----------INFO---------*/

.info {
    padding:10px;
    text-transform:uppercase;
    border-top:1px solid #f5f5f5;
    margin-top:25px;
}


.tags {
    margin-left:10px;
    margin-top:-5px;
}

.tags a {
    margin-right:10px;
    letter-spacing:1px;
}

/*----------POST NOTES---------*/

ol.notes {
padding:0px;
margin:25px 0px 0px -10px;
list-style-type:none;
}

ol.notes li.note {
padding:10px;
}

ol.notes li.note img.avatar {
vertical-align:-4px;
margin-right:10px;
width:16px;
height:16px;
}

ol.notes li.note span.action {
font-weight:none;
}

ol.notes li.note .answer_content {
font-weight:normal;
}

ol.notes li.note blockquote {
padding:4px 10px;
margin:10px 0px 0px 25px;
}

ol.notes li.note blockquote a {
text-decoration:none;
}

/*----------CREDIT---------*/

.credit {
font-size:8px;
position:fixed;
font-weight:bold;
bottom:5px;
right:15px;
z-index:10;
text-align:right;
letter-spacing:1px;
padding:2px;
}

.credit a {
color:{color:links};
text-decoration:none;
}

.credit a:hover {
color:{color:links hover};
text-decoration:none;
}

</style>
</head>

<body>

<div class="credit">
<a title="theme" href="http://chircn.tumblr.com/" target="_blank">CH</a></div>

<div class="sidebar">
    <div class="description"><b><big>{title}</big></b> {Description}</div>

    <div class="links">
        <a href="/">index</a>
        <a href="/ask">message</a>
        <a href="{text:link 1 url}">{text:link 1 title}</a>
        <a href="{text:link 2 url}">{text:link 2 title}</a>
        <a href="{text:link 3 url}">{text:link 3 title}</a>
    </div>

</div>

<div class="entries">

{block:Posts}

<div class="posts">

{block:Text}
<h1>{block:Title}{Title}{/block:Title}</h1>
{Body}{/block:Text}


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


{block:Photoset}
<div style="width: 100%;">{Photoset}</div>
{block:Caption}{Caption}{/block:Caption}
{/block:Photoset}


{block:Quote}
<div class="quote">"{Quote}"</div>
{block:Source}<div class="quotesource"> — {Source}</div>
{/block:Source}{/block:Quote}


{block:Link}
<h1><a href="{URL}" {Target}>{Name}</a></h1>
{block:Description}{Description}{/block:Description}
{/block:Link}


{block:Chat}
{block:Title}<h1>{Title}</h1>{/block:Title} <div class="chat"> {block:Lines} <li class="line {Alt}"> {block:Label} <span class="label"> {Label}</span> {/block:Label}{Line}</li> {/block:Lines}</div>
{/block:Chat}


{block:Audio}

<div class="playbox"><div class="playbutton">{block:AudioPlayer}{AudioPlayerBlack}{/block:AudioPlayer}</div></div>

{block:AlbumArt}
<img src="{AlbumArtURL}" class="cover">
{/block:AlbumArt}


<div class="trackdetails"><br>
{block:TrackName}<b>TRACK:</b> {TrackName}{/block:TrackName}<br>

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

<b>PLAYS:</b> {FormattedPlayCount}</div>


{block:Caption}
<div class="caption">{Caption}</div>
{/block:Caption}
{/block:Audio}


{block:Video}
{block:Video}{VideoEmbed-400}{/block:Video}
{block:Caption}{Caption}{/block:Caption}
{/block:Video}


{block:Answer}
<div class="question">
<div class="asker"><b>{Asker} said:</b></div>
{Question}</div>
<div class="answer">
{Answer}</div>
{/block:Answer}


<div class="info">
{block:Date}
<b><a href="{Permalink}" title="{TimeAgo}">{Month} {DayOfMonth}{DayOfMonthSuffix}</b></a>
&nbsp;&nbsp;
<a href="{Permalink}">{NoteCount}N.</a>
&nbsp;&nbsp;

<a href="{ReblogURL}" target="_blank" class="details"><i class="fa fa-repeat"></i></a>
{/block:Date}

<font style="float:right">
<small>
{block:RebloggedFrom}
<a href="{ReblogParentURL}" title="{ReblogParentName}">via </a>
{block:ContentSource}
<a href="{ReblogRootURL}" "{ReblogRootName}" title="{ReblogRootName}">/ src</a>
{/block:ContentSource}
{/block:RebloggedFrom}
</small>
</font style>


</div>


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

</div>


{block:PostNotes}
{PostNotes}
{/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}{block:ReblogParent}{/block:ReblogParent}
 <div class="pagination">
{block:Pagination}
{block:PreviousPage}
<a href="{PreviousPage}">back</a> —{/block:PreviousPage}
{block:NextPage}
<a href="{NextPage}"> next</a>
{/block:NextPage}
{/block:Pagination}
</div>

</body>