theme 06: rascunho

<!DOCTYPE html>

<!--
|||||||| theme 06: rascunho
|| by quenma.tumblr.com

don't redistribute
don't copy any part of the code
feel free to change fonts and colors
message me if there is any bugs
-->

<head>

<title>{title}{block:searchpage}, search results: {searchquery}{/block:searchpage}{block:postsummary} - {postsummary}{/block:postsummary}
</title>


<link href="{Favicon}" rel="shortcut icon"/>
<link rel="alternate" type="application/rss+xml" href="{RSS}">

<link href='https://fonts.googleapis.com/css?family=Ubuntu|Roboto:300,400,700,400italic,300italic,700italic,500italic&subset=latin,latin-ext' rel='stylesheet' type='text/css'>

<link rel="stylesheet" href="//static.tumblr.com/ev0x8sk/mmInxxidy/style.css">
<meta name="description" content="{metadescription}" />
<meta name="color:Font" content="#aaaaaa" />
<meta name="color:Entry" content="#ffffff" />
<meta name="color:Background" content="#ffffff" />
<meta name="color:Links" content="#111111" />
<meta name="color:Links hover" content="#d7ecf2" />
<meta name="color:Post title" content="#aaaaaa" />
<meta name="color:Borders" content="#f6f6f6" />
<meta name="color:Permalink text" content="#aaaaaa" />
<meta name="color:Permalink box" content="#fafafa" />
<meta name="color:Question background" content="#fafafa" />
<meta name="color:Header background" content="#fafafa" />

<meta name="image:Header avatar" content="http://goo.gl/y6oQ3F" />
<meta name="image:Header background" content="http://goo.gl/Pu00aG"/>

<meta name="if:Show captions" content="0"/>
<meta name="if:Fade images" content="1"/>

<meta name="text:Link 1 URL" content="#01"/>
<meta name="text:Link 1 title" content="title 01"/>
<meta name="text:Link 2 URL" content="#02"/>
<meta name="text:Link 2 title" content="title 02"/>
<meta name="text:Link 3 URL" content="#03"/>
<meta name="text:Link 3 title" content="title 03"/>
<meta name="text:Header size" content="350"/>

<meta name="select:Posts width" content="250px">
<meta name="select:Posts width" content="300px">
<meta name="select:Posts width" content="350px">
<meta name="select:Posts width" content="400px">
<meta name="select:Posts width" content="450px">
<meta name="select:Posts width" content="500px">
<meta name="select:Posts width" content="540px">

<meta name="select:Description alignment" content="left">
<meta name="select:Description alignment" content="center">
<meta name="select:Description alignment" content="justify">

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js">
</script>

<script src="//static.tumblr.com/ev0x8sk/2KInubuiu/smt-jquery.js"></script>
<script src="//static.tumblr.com/ev0x8sk/Jqinubuiy/smt.js"></script>

<script src="//static.tumblr.com/ev0x8sk/QFpnyha9d/json.js"></script>
<script src="//static.tumblr.com/ev0x8sk/FnSnyhabj/start-at-20.js"></script>

<script>
// minimal soundcloud player © shythemes.tumblr
$(document).ready(function(){
   var color = '{color:links hover}'; // color of play button (hex)
   $('.soundcloud_audio_player').each(function(){
       $(this).attr({ src: $(this).attr('src').split('&')[0] + '&amp;liking=false&amp;sharing=false&amp;auto_play=false&amp;show_comments=false&amp;continuous_play=false&amp;buying=false&amp;show_playcount=false&amp;show_artwork=true&amp;origin=tumblr&amp;color=' + color.split('#')[1], height: 20, width: '100%' });
   });
});
</script>

<style>

/* defaults */
a { color:{color:links};
text-decoration:none;
cursor:help;}
a:hover { border-bottom:1px solid {color:links hover}; }

body { font:10px roboto;
color:{color:font};
background:{color:background};
margin:0;
padding:0;
line-height:14px; }

pre, small, sub, sup, big, code { font-size:10px!important; }
pre { word-break:break-word; }

::-webkit-scrollbar-thumb { background: {color:links hover};
border:2px solid {color:background}; }

::-webkit-scrollbar {
height:6px;
width:6px;
background: {color:background}; }

blockquote { border-left:1px solid {color:borders};
padding:0 6px 0 20px;
margin:2px 0 0 15px; }

blockquote blockquote { margin:2px 0 0 0; }

#s-m-t-tooltip{
max-width:240px;
font-style:italic;
padding:3px 5px;
margin-left:22px;
margin-right:10px;
margin-top:12px;
z-index:900;
background-color:{color:entry}; }






/* posts */
#content { width:{select:posts width};
left:50%;
margin-left:calc(-{select:posts width} / 2);
position:relative;
margin-top:calc({text:header size}px + 30px);
    {block:PermalinkPage}
    width:500px;
    margin-left:-250px;
    {/block:PermalinkPage} }

.entry, #header { width:{select:posts width};
margin-bottom:100px;
display:block;
text-align:justify;
background:{color:entry};
position:relative;
    {block:PermalinkPage}
    width:500px;
    {/block:PermalinkPage} }

.entry .title { font-size:11px;
font-style:italic;
display:block;
text-align:left;
margin-bottom:10px;
line-height:14px;
text-transform:uppercase;
color:{color:post title}; }

.entry .body-distance img { max-width:100%; }

.body-distance { padding:15px; }





/* permalink */
.perma { padding:10px 15px;
border-top:1px solid {color:borders};
background:{color:permalink box};
color:{color:permalink text};
font-style:italic;
text-transform:lowercase;
line-height:15px;
    {block:PermalinkPage}
    border-bottom:1px solid {color:borders};
    {/block:PermalinkPage} }

.perma a { color:{color:permalink text};
margin-right:3px;
border:none; }

a.tags { text-transform:none; }
a.tags:before { content:'#'; }





/* photos */
.photopost { max-width:100%;
    {block:iffadeimages}
    opacity:.8;
    {/block:iffadeimages} }

{block:iffadeimages}
.photosets { opacity:.8; }
{/block:iffadeimages}



/* answers */
.question { padding:8px;
background:{color:question background}; }

.question i { text-transform:uppercase;
font-style:italic;
display:inline-block;
position:absolute;
margin:3px 4px;
color:{color:font}; }

.question a { color:{color:font}; }




/* links */
.entry a.title.linkpost { margin-bottom:0;
background:{color:question background};
padding:5px;
color:{color:post title};
border:none;
display:inline-block; }

.link-excerpt { padding:8px;
font-style:italic;
margin-top:-5px;
background:{color:question background}; }




/* audios */
#audio-content { border-bottom:1px solid {color:borders};
padding-bottom:16px;
margin-bottom:-1px; }

.audioplayer-inner { width: 26px;
overflow: hidden; }

.audioplayer-outer {
padding: 5px 7px 2px;
width: 26px;
position: relative;
display: inline-block;
margin: 20px 20px 0;
overflow: hidden;
background: {color:question background};
z-index: 10; }

.audio-info { text-align:left;
font-style:italic;
position:absolute;
margin-top:24px;
margin-left:-5px;
display:inline-block; }

.audio-info#audio-em { position:relative;
border-left:1px solid {color:borders};
padding:0 6px 0 20px;
margin:10px 0 0 15px!important;}

#audio-em br { display:none; }

.audio-info b { text-transform:uppercase; }

.audio-posts { padding:10px 15px; }




/* chats */
.codd, .ceven { padding:8px;
margin:2px;
border-radius:3px; }

.codd { background:{color:question background}; }

.codd i, .ceven i { font-style:italic;
text-transform:uppercase; }



/* post notes */
.noul { padding-top:0px;
margin-top:-100px;
overflow:auto; }

.noul ul, .noul li, .noul ol { list-style-type:none;
margin-left:-25px;}
.noul img { visibility:hidden; }
.noul li {  padding:3px 0;
font-size: 10px;
color: #888888;
border-top: 0px solid transparent;
width: 400px;
background: transparent;
text-transform: lowercase;
margin: 3px 0; }

.avatar_frame {  display: none; }
.noul blockquote { margin-left:20px; }
.p-notes { margin-bottom:60px; }




/* description header */
#header { background:transparent;
margin-bottom:80px;}

#header-ava, #header-ava-relative { width:40px;
height:40px;
display:inline-block;
margin-bottom:8px;
border-radius:100%;
position:absolute;
z-index:100; }

#header-ava.fixed { position:fixed;
top:5px; }

#header-ava-relative { visibility:hidden;
position:relative; }

.description { padding:0 35px;
margin-top:10px;
text-align:{select:description alignment};}

#header .links { position:absolute;
display:inline-block;
font-style:italic;
width:{select:posts width};
z-index:90;
margin-top:12px;
margin-left:8px;
text-transform:lowercase;
    {block:PermalinkPage}
    width:500px;
    margin-left:8px;
    {/block:PermalinkPage}
}



.links.custom_250px {
{block:IndexPage}
width:300px!important;
margin-left:-17px!important;
{/block:IndexPage}
}

.customlinks { margin-left:50px;
display:inline-block; }

#header .links a { margin-right:10px; }

#header .links.fixed { position:fixed!important;
top:0;
margin-top:27px; }






/* image header */
#top-header { width:100%;
height:{text:header size}px;
background:{color:header background};
position:absolute;
top:0;
left:0; }

#top-header.fixed { position:fixed!important;
top:calc(-{text:header size}px + 40px);
z-index:80;
}

.top-header-image { width:100%;
height:{text:header size}px;
background:url('{image:header background}') fixed;
background-size:100% auto;
background-position:top left;
position:absolute;
top:0px;
left:0; }

.triangle-left.fixed, .triangle-right.fixed { position:fixed!important;
top:20px;
z-index:90; }

.triangle-left, .triangle-right { top:calc({text:header size}px - 20px);
left:0;
position:absolute;
width:calc(50% - 20px);
height:20px;
background:{color:background};
z-index:20; }

.triangle-right { left:auto;
right:0!important; }

.triangle-left:after, .triangle-right:before { content:'';
border:10px solid {color:background};
position:absolute;
border-top-color:transparent; }

.triangle-left:after {
left:100%;
border-right-color:transparent;}

.triangle-right:before {
border-left-color:transparent;
margin:0px -20px; }

.bottom-bar { height:10px;
width:100%;
position:absolute;
background:{color:background};
z-index:0;
left:0;
top:{text:header size}px; }

.bottom-bar.fixed { position:fixed!important;
top:40px;
z-index:90;}



/* pagination */
.previouspage {
position: absolute;
display: inline-block;
margin-left:-44px; }

.nextpage {
position: absolute;
display: inline-block;
margin-left:30px;
margin-top:-14px;
}


{CustomCSS}
</style></head><body>

<div id="top-header">
    <div class="top-header-image"></div>
</div>
<div class="triangle-left"></div>
<div class="triangle-right"></div>
<div class="bottom-bar"></div>

<div id="content">

    <div id="header">


    <div class="links custom_{select:posts width}">

        <center>
        {block:Pagination}
        {block:PreviousPage}
        <a href="{PreviousPage}" class="previouspage">back —</a>
        {/block:PreviousPage}
        {/block:Pagination}
        <a href="/" title="index">i.</a>
        <a href="/ask" title="message">ii.</a>
        <a href="/archive" title="archive">iii.</a>

        <div class="customlinks">
        <a href="{text:link 1 url}" title="{text:link 1 title}">iv.</a>
        <a href="{text:link 2 url}" title="{text:link 2 title}">v.</a>
        <a href="{text:link 3 url}" title="{text:link 3 title}">vi.</a>
        {block:Pagination}
        {block:NextPage}
        <a href="{NextPage}" class="nextpage">— forth</a>
        {/block:NextPage}
        {/block:Pagination}
        </div>

        </center>

    </div>



        <center>
        <img src="{image:header avatar}" id="header-ava">
        <img src="{image:header avatar}" id="header-ava-relative">
        </center>

        <div class="description">{Description}</div>




    </div> <!-- //header -->


{block:Posts}
<div class="entry">

<!------------------- //answer -->
{block:Answer}
<div class="body-distance">
<div class="question">
    <img src="{AskerPortraitURL-128}" width="20px">
    <i>{Asker}</i>
    <br>{Question}
</div>
<blockquote>{Answer}</blockquote>
</div>
{/block:Answer}


<!------------------- //text -->
{block:Text}
<div class="body-distance">
{block:Title}<div class="title">{Title}</div>{/block:Title}
{Body}
</div>
{/block:Text}


<!------------------- //quote -->
{block:Quote}
<div class="body-distance">
<div class="title quotes">{Quote}</div>
<div style="text-align:center;">{Source}</div>
{block:Source}{/block:Source}
</div>
{/block:Quote}


<!------------------- //photo -->
{block:Photo}
    {block:IndexPage}
        <img src="{PhotoURL-HighRes}" class="photopost">
    {block:IfShowCaptions}
    {block:Caption}<div class="body-distance">{Caption}</div>{/block:Caption}
    {/block:IfShowCaptions}
    {/block:IndexPage}
    {block:PermalinkPage}
        <img src="{PhotoURL-HighRes}" width="500px">
    {block:Caption}<div class="body-distance">{Caption}</div>{/block:Caption}
    {/block:PermalinkPage}
{/block:Photo}


<!------------------- //photoset -->
{block:Photoset}
    {block:IndexPage}
        <div class="photosets">{Photoset}</div>
    {block:IfShowCaptions}
    {block:Caption}<div class="body-distance">{Caption}</div>{/block:Caption}
    {/block:IfShowCaptions}
    {/block:IndexPage}
    {block:PermalinkPage}
        {Photoset-500}
    {block:Caption}<div class="body-distance">{Caption}</div>{/block:Caption}
    {/block:PermalinkPage}
{/block:Photoset}


<!------------------- //video -->
{block:Video}
    {block:IndexPage}
    {Video-500}
    {block:IfShowCaptions}
    {block:Caption}<div class="body-distance">{Caption}</div>{/block:Caption}
    {/block:IfShowCaptions}
    {/block:IndexPage}
    {block:PermalinkPage}
    {Video-500}
    {block:Caption}<div class="body-distance">{Caption}</div>{/block:Caption}
    {/block:PermalinkPage}
{/block:Video}


<!------------------- //links -->
{block:Link}
<div class="body-distance">
<a href="{URL}" class="title linkpost">{Name}</a>
{block:Excerpt}<div class="link-excerpt">{Excerpt}</div>{/block:Excerpt}
{block:Description}<blockquote>{Description}</blockquote>{/block:Description}
</div>
{/block:Link}


<!------------------- //audios -->
{block:Audio}

    {block:AudioEmbed}
    {AudioEmbed}
    {/block:AudioEmbed}

    <div id="audio-content">
        {block:AudioPlayer}
        <div class="audioplayer-outer">
            <div class="audioplayer-inner">
                {AudioPlayerWhite}
            </div>
        </div>
        {/block:AudioPlayer}

        <div class="audio-info"
        {block:AudioEmbed}id="audio-em"{/block:AudioEmbed}>
            {block:Artist}<b>{Artist}</b>{/block:Artist}
            {block:TrackName}<br/>{TrackName}{/block:TrackName}
        </div>

    </div>

    {block:IndexPage}
    {block:IfShowCaptions}
    {block:Caption}<div class="body-distance audio-posts">{Caption}</div>{/block:Caption}
    {/block:IfShowCaptions}
    {/block:IndexPage}
    {block:PermalinkPage}
    {block:Caption}<div class="body-distance">{Caption}</div>{/block:Caption}
    {/block:PermalinkPage}
{/block:Audio}


<!------------------- //chat -->
{block:Chat}
<div class="body-distance">
{block:Title}<div class="title">{Title}</div>{/block:Title}
{block:Lines}<div class="c{Alt}">
{block:Label}<i>{Label}</i>{/block:Label}
{Line}
</div>{/block:Lines}
</div>
{/block:Chat}


<!------------------- //hide source -->
{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}



<!------------------- //left perma -->
{block:Date}
<div class="perma">



{block:IndexPage}
<a href="{Permalink}">{FormattedNoteCount}</a>
<a href="{ReblogURL}">reblog</a>

    {block:RebloggedFrom}
        <a href="{ReblogParentURL}" title="{ReblogParentName}">via</a>
        <a href="{ReblogRootURL}" title="{ReblogRootName}">source</a>
    {/block:RebloggedFrom}

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






{block:PermalinkPage}
{TimeAgo} with {NoteCountWithLabel}.

{block:RebloggedFrom}
 Via: <a href="{ReblogParentURL}">{ReblogParentName}</a> / Source: <a href="{ReblogRootURL}">{ReblogRootName}</a>
{/block:RebloggedFrom}

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

<br><a href="{ReblogURL}">Reblog this post</a>
{/block:PermalinkPage}





</div>
{/block:Date}

</div> <!-- .entry -->
{/block:Posts}

<!------------------- //post notes -->
{block:PermalinkPage}
    {block:PostNotes}
    <div class="entry noul p-notes">{PostNotes}</div>
    {/block:PostNotes}
{/block:PermalinkPage}
</div> <!-- #content -->

<style>
a #thc { color:{color:links};
cursor:help;}

#thc { position:fixed;
bottom:0;
right:0;
text-transform:uppercase; }

#thc .codedby {
right:26px;
bottom:9px;
opacity:0;
width:120px;
text-align:right;
font-family:ubuntu;
font-size:8px;
text-transform:uppercase;
display:inline-block;
position:absolute;
-webkit-transition:.3s;
-o-transition:.3s;
-moz-transition:.3s; }

#thc:hover .codedby { right:28px;
opacity:.9;
transition:.3s; }

#thc i { position:fixed;
display:inline-block;
bottom:12px;
font-size:11px;
right:10px; }

</style>
<a href="//quenma.tumblr.com/">
<div id="thc">
    <i class="icon-code"></i>
    <div class="codedby">coded by quenma</div>
</div>
</a>


</body>
</html>