WONDER // habitarts

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>

<!----


by habitarts
enjoy <3
and please, don't copy
permalink notes by fragilehelp


---->


<meta name="text:Link 1" content="/" />
<meta name="text:Link 1 title" content="" />
<meta name="text:Link 2" content="/" />
<meta name="text:Link 2 title" content="" />
<meta name="text:Link 3" content="/" />
<meta name="text:Link 3 title" content="" />
<meta name="text:Link 4" content="/" />
<meta name="text:Link 4 title" content="" />
<meta name="text:Link 5" content="/" />
<meta name="text:Link 5 title" content="" />
<meta name="text:Link 6" content="/" />

<meta name="image:Background" content="" />
<meta name="if:White Tumblr Controls" content=""/>
<meta name="if:Do Not Repeat Background" content="1"/>

<meta name="color:Background" content="#000" />
<meta name="color:Text" content="#f3f3f3" />
<meta name="color:Link Hover" content="#000" />
<meta name="color:Link" content="##f3f3f3" />
<meta name="color:Accent" content="#303030" />
<meta name="color:Bold" content="#f0d7e9" />
<meta name="color:Italic" content="#f0d7e9" />
<meta name="color:Underline" content="#f0d7e9" />
<meta name="color:Text Info" content="#ffffff" />
<meta name="color:Link Icons" content="#ffffff" />
<meta name="color:Link Icons Hover" content="#000000" />
<meta name="color:Scrollbar Main Border" content="#fff" />
<meta name="color:Scrollbar Sub Border" content="#5f5f5f" />
<meta name="color:Scrollbar Background" content="#000" />
<meta name="color:Background Selection" content="#eeeeee" />
<meta name="color:Text Selection" content="#c6c6c6" />


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

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">

<link href="https://fonts.googleapis.com/css?family=Dawning+of+a+New+Day|Open+Sans" rel="stylesheet">

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script><script src="http://static.tumblr.com/ikeq9mi/DfYl6o46t/scrolltotop.min.js"></script><a href="javascript:;" id="scrollToTop"><div class="fa fa-angle-up" aria-hidden="true"></div></a>

<style>

body {background-color: {color:Background};
font-family:Open Sans;
color: {color:Text};
text-align: left;
font-size: 10px;
background-image:url('{image:Background}');
background-attachment: fixed;
{block:IfDoNotRepeatBackground}
background-repeat: no-repeat;
{/block:IfDoNotRepeatBackground}}

#entries {float:center;
width:400px;
z-index:999999999999999999999999999999999999999999999999999999999999999999;
margin:50px auto 100px 340px;}

.entry {width: 400px;
padding: 15px;
z-index:999999999999999999999999999999999999999999999999999999999999999999;
margin:30px;
float: left;}

a {text-decoration:none;
transition:all 1s ease;
color:{color:Link}; }
a:hover {transition:all 1s ease;
color:{color:Link Hover};}
b {color:{color:Bold}; }
i {color:{color:Italic};}
u {text-decoration:none;
border-bottom: 1px dashed {color:Accent};
color:{color:Underline};}

blockquote {margin:0px;
padding:0px 0px 0px 10px;
border-left:1px solid{color:Accent};
font-size:10px;}

html {cursor: url(http://www.totallylayouts.com/cursors/random/tiny_cursor.png), auto;}
a, a:hover {cursor: url(http://static.tumblr.com/8l2gpxb/m1pmlzw1h/5.png), auto;}

::-webkit-scrollbar {width:17px;height:17px;}
::-webkit-scrollbar {background-color:{color:Scrollbar Background};}
::-webkit-scrollbar-track {border:8px solid{color:Scrollbar Background};    background-color:{color:Scrollbar Sub Border};}
::-webkit-scrollbar-thumb {border:8px solid{color:Scrollbar Background};
background-color:{color:Scrollbar Main Border};
min-height:24px;
min-width:24px;}

::-moz-selection {Background-color:{color:Background Selection};}
::selection {Background-color:{color:Background Selection};
color:{color:Text Selection};}

#h1 {padding:0px 0px 5px 0px;
Text-align:left;
line-height:100%;
color:{color:Text};
text-transform:none;
font-weight:300;
font-size:13px;}

#h1 a {text-transform:uppercase;
font-weight:300;
font-size:10px;}

li {margin-left:-10px;}

.quote {Text-align:justify;
line-height: 21px;
color:{color:Text};
padding:0px; }
.quotesource {
height:auto;
margin-top:5px;
Text-align:left;
display:block; }
.quotesource a {color:{color:Text};}

.chat {background:{color:Background} ;
font-size: 9px;
margin-top:10px;}
.chat .lines {padding: 2px 2px 2px 10px;
margin-bottom: 4px;
border-left:1px solid{color:Accent};}
.chat .lines span {font-weight:none;}

#postinfo {color:{color:Text};
width:240px;
position:absolute;
padding:5px 10px 0px 0px;
transition:all 1s ease;
{block:IndexPage}
opacity:0;
{/block:IndexPage}
{block:PermalinkPage}
opacity:1;
margin-top:0px;
{/block:PermalinkPage}
Text-transform:uppercase;
font-size: 9px;
letter-spacing:1px;}

.entry:hover #postinfo {opacity:1;
transition:all 1s ease;
margin-top:0px; }

#postinfo a {
Text-transform:uppercase;
font-size: 9px;
color:{color:Text};
padding:0px 0px 1px 0px;
margin-left:2px;}

#info {z-index:999999999999999999999999999999999999999;}
#info a {margin-right:5px;}

#photosinfo {width:360px;
position:absolute;
padding:20px;
transition:all 1s ease;
background: linear-gradient(to bottom,
rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%);
opacity:0;}

.entry:hover #photosinfo {opacity:1;
transition:all 1s ease;}

#photosinfo a {text-shadow: 1px 1px 0px #434343;
color:{color:Text Info};
font-size:9px;
letter-spacing:1px;
text-transform:uppercase;}

#caixa {margin-left:20px;
width:405px;}
#lpermalink {font-size:10px;
padding:15px;
border-bottom:1px solid {color:Accent};}
#lpermalink img {float:left;
padding:5px;
width:10px;
height:10px;
opacity:1!important;}
.lnotes {display:block;
width:420px;
margin-top:15px;}
.lnotes .avatar {border:none;
margin:1px;
border-radius:5px;
width:25px;
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);
padding:0;}
.lnotes ol {margin:0;
padding:0;}
.lnotes li {list-style:none;
border:none;
float:left;
margin:0;
padding:0;
margin-right:4px;
margin-bottom:-2px;}
.lnotes .note .action {display:none;
visibility:hidden;
margin:0;
padding:0;}
.more_box {display:block;
width:350px;
height:35px;
margin:0;
padding:0;}
.more_notes_link_container {font-size:10px;
display:block;
text-align:center;
width:400px;
margin-top:20px;
text-transform:uppercase;
letter-spacing:1px;}
.lnotes blockquote {display:none;}

#pagination {text-align:center;
width:400px;
color:{color:Text};
margin:0px 0px 40px 390px;
text-transform:lowercase;
font-size:11px;}
#pagination a {line-height:14px;
padding:0 5px;
color:{color:Text};}

#pagination span.pagina_atual { margin: 0 1px 0 0;
text-decoration:none;
padding: 2px 6px 2px 6px;
color: {color:Text};}

#scrollToTop:link,#scrollToTop:visited { color:{color:Text};
background-color: transparent;
display: none;
position: fixed;
bottom: 30px;
font-size:10px;
right: 30px;}

#credits {
position:fixed;
right:10px;
bottom:10px;}
#credits a {
Text-transform:uppercase;
font-size: 10px;
color:{color:Link};}

#asker {color:{color:Text};
Text-transform:uppercase;
font-size:8px;
position:absolute;
letter-spacing:1px;
margin-left:30px;
margin-top:-27px;
padding:0px 0px 1px 0px;}

#asker a {color:{color:Text};
Text-transform:uppercase;
letter-spacing:1px;
font-size:8px;}

.ask {Text-align: justify;
background:{color:Background};
border:1px solid#eee;
color:{color:Text};
padding:10px;
Text-transform:uppercase;
font-size:9px;
margin-top:1px;
line-height:17px;
vertical-align: -5px;}
.ask a {color: color:{color:Text};}

.question {Text-align: justify;
color:{color:Text};
padding:20px;
background:{color:Background};
border:1px solid#eee;
Text-transform:lowercase;
font-size:9px;
margin-top:0px;
line-height:17px;
vertical-align: -5px;}
.question a {color: color:{color:Text};}

.answer {margin-top:-5px;
color:{color:Text};
Text-align:left;
line-height:20px;
Text-align: justify;
Text-transform:none;
font-size:9px;
padding:10px;}

.bar {margin-top:0px;
padding:16px;
height:6px;
margin-left:0px;
color:{color:Text};
Text-align:left;
Background:{color:Background};
z-index:999999999999999999999999;
letter-spacing:1px;
Text-transform:uppercase;
font-size: 9px; }

.audioinfo {margin-top:-2px;
padding:10px;
margin-left:0px;
color:#c6c6c6;
Text-align:left;
Background:{color:Background};
z-index:999999999999999999999999;
Text-transform:uppercase;
font-size: 9px;
letter-spacing:1px;}

#albumart {margin-left:0px;
float:left;
margin-top:-17px;}

#albumart img {margin-left:-15px;
transition:all 1s ease;
padding:15px;
width:50px;
border-radius:100%}

#audioplayer {width:28px;
height:31px;
opacity:0.7;
z-index:999999999999999999999999999999;
overflow:hidden;
position:absolute;
margin-left:11px;
margin-top:10px;
transition:all 1s ease;}

#audioplayer:hover {opacity:1;
transition:all 1s ease;}

#sidebar {margin-left:120px;
width:200px;
text-align:left;
padding:10px;
margin-top:100px;
position:fixed; }

.links {margin-top:10px;
display:block;
padding:0px 0px 10px 0px;
transition:all 1s ease;
text-align:right;}

.links a {margin:3px;
color:{color:Link Icons};
font-weight:none;
text-decoration:none;
font-style:none;
transition:all 1s ease;
text-transform:lowercase;
font-size:10px;}

.links a:hover {color:{color:Link Icons Hover};
transition:all 1s ease;
font-weight:none;
text-decoration:none;
font-style:none;}

#desc {margin-top:5px;
padding:0px;
text-align:right;
line-height:20px;
color:{color:Text};}

#title {font-family:Dawning of a New Day;
margin-top:0px;
font-size:25px;
color:{color:Text};
text-align:right;
margin-left:10px;}

</style>

</head>
<body>



<div id="sidebar">

<div id="title">
<a href="/">{Title}</a>
</div>

<div id="desc">{Description}</div>

<div class="links">

<a href="{text:Link 1}" title="{text:Link 1 title}"><div class="fa fa-home" aria-hidden="true"></div></a>
<a href="{text:Link 2}" tilte="{text:Link 2 title}"><div class="fa fa-envelope" aria-hidden="true"></div></a>
<a href="{text:Link 3}" title="{text:Link 3 title}"><div class="fa fa-th-list" aria-hidden="true"></div></a>
<a href="{text:Link 4}" tilte="{text:Link 4 title}"><div class="fa fa-user" aria-hidden="true"></div></a>
<a href="{text:Link 5}" tilte="{text:Link 5 title}"><div class="fa fa-gratipay" aria-hidden="true"></div></a>
</div>


</div>

<div id="credits">
<a href="http://www.habitarts.tumblr.com/">H</a>
</div>


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

{block:Text}
{block:Title}
<div id="h1">{Title}</div>
{/block:Title}
{Body}
{block:IndexPage}
<div id="postinfo">
<a href="{PermaLink}">
{month}
{dayofmonth}{dayofmonthsuffix}</a>
<a href="{ReblogURL}" target="_blank">
<i class="fa fa-repeat" aria-hidden="true"></i>
{block:PermalinkPage}
{block:NoteCount}
<a href="{PermaLink}">{NoteCount}</a>
{/block:NoteCount}
{/block:PermalinkPage}
</div>
{/block:IndexPage}
{/block:Text}

{block:Photo}

<div id="photosinfo">
<a href="{PermaLink}">
{month}
{dayofmonth}{dayofmonthsuffix}</a><br>
{block:NoteCount}
<a href="{PermaLink}">{NoteCountWithLabel}</a>
{/block:NoteCount} <br>
<a href="{ReblogURL}" target="_blank">compartilhe <i class="fa fa-heart-o" aria-hidden="true" style="color:#f0d7e9;"></i> </a>
</div>
<img src="{PhotoURL-400}">
{block:PermalinkPage}
{block:Caption}{Caption}{/block:Caption}
{/block:PermalinkPage}
{/block:Photo}

{block:Photoset}
<div id="photosinfo">
<a href="{PermaLink}">
{month}
{dayofmonth}
{dayofmonthsuffix}</a><br>
{block:NoteCount}
<a href="{PermaLink}">{NoteCountWithLabel}</a>
{/block:NoteCount} <br>
<a href="{ReblogURL}" target="_blank">compartilhe <i class="fa fa-heart-o" aria-hidden="true" style="color:#f0d7e9;"></i> </a>
</div>
{Photoset}
{block:PermalinkPage}
{block:Caption}{Caption}{/block:Caption}
{/block:PermalinkPage}
{/block:Photoset}


{block:Quote}
<div class="quote">{Quote}</div>
<div class="quotesource"><i class="fa fa-heart-o" aria-hidden="true" style="color:#f0d7e9;"></i> &nbsp;  {Source} </div>
{block:IndexPage}
<div id="postinfo">
<a href="{PermaLink}">
{month}
{dayofmonth}{dayofmonthsuffix}</a>
<a href="{ReblogURL}" target="_blank">
<i class="fa fa-repeat" aria-hidden="true"></i>
{block:PermalinkPage}
{block:NoteCount}
<a href="{PermaLink}">{NoteCount}</a>
{/block:NoteCount}
{/block:PermalinkPage}
</div>
{/block:IndexPage}
{/block:Quote}

{block:Link}
<a href="{URL}" {Target}>
<div id="h1">{Name}</div></a>
{block:Description}
{Description}
{/block:Description}
{block:IndexPage}
<div id="postinfo">
<a href="{PermaLink}">
{month}
{dayofmonth}{dayofmonthsuffix}</a>
<a href="{ReblogURL}" target="_blank">
<i class="fa fa-repeat" aria-hidden="true"></i>
{block:PermalinkPage}
{block:NoteCount}
<a href="{PermaLink}">{NoteCount}</a>
{/block:NoteCount}
{/block:PermalinkPage}
</div>
{/block:IndexPage}
{/block:Link}

{block:Chat}
{block:Title}
<div id="h1">{Title}</div>
{/block:Title}
{block:Lines}
<div class="chat">
<div class="lines">{block:Label}
<span>{Label}</span>
{/block:Label}
{Line}</div></div>
{/block:Lines}
{block:IndexPage}
<div id="postinfo">
<a href="{PermaLink}">
{month}
{dayofmonth}{dayofmonthsuffix}</a>
<a href="{ReblogURL}" target="_blank">
<i class="fa fa-repeat" aria-hidden="true"></i>
{block:PermalinkPage}
{block:NoteCount}
<a href="{PermaLink}">{NoteCount}</a>
{/block:NoteCount}
{/block:PermalinkPage}
</div>
{/block:IndexPage}
{/block:Chat}

{block:Audio}
<div id="audioplayer">
{AudioPlayerWhite}
</div>
<div id="albumart">
{block:AlbumArt}
<img src="{AlbumArtURL}" width="100">
{/block:AlbumArt}
</div>
<div class="audioinfo">
{block:TrackName}
{TrackName}<br>
{/block:TrackName}
{block:Artist}
{Artist}<br>
{/block:Artist}
{/block:ExternalAudio}
</div>
{block:PermalinkPage}
{block:Caption}
{Caption}
{/block:Caption}
{/block:PermalinkPage}<br>
{block:IndexPage}
<div id="postinfo">
<a href="{PermaLink}">
{month}
{dayofmonth}{dayofmonthsuffix}</a>
<a href="{ReblogURL}" target="_blank">
<i class="fa fa-repeat" aria-hidden="true"></i>
{block:PermalinkPage}
{block:NoteCount}
<a href="{PermaLink}">{NoteCount}</a>
{/block:NoteCount}
{/block:PermalinkPage}
</div>
{/block:IndexPage}
{/block:Audio}

{block:Video}
{Video-400}
{block:PermalinkPage}
{block:Caption}{Caption}{/block:Caption}
{/block:PermalinkPage}
{block:IndexPage}
<div id="postinfo">
<a href="{PermaLink}">
{month}
{dayofmonth}{dayofmonthsuffix}</a>
<a href="{ReblogURL}" target="_blank">
<i class="fa fa-repeat" aria-hidden="true"></i>
{block:PermalinkPage}
{block:NoteCount}
<a href="{PermaLink}">{NoteCount}</a>
{/block:NoteCount}
{/block:PermalinkPage}
</div>
{/block:IndexPage}
{/block:Video}


{block:Answer}
<div class="question">
<img src="{AskerPortraitURL-48}" style="width:20px; margin: -10px 10px 0px 0px;padding:10px 0px 4px 0px;border-radius:100%;">
<div id="asker">{Asker} said:
</div>
<br>{Question}
</div>
<div class="answer">
{Answer}
</div>
{block:IndexPage}
<div id="postinfo">
<a href="{PermaLink}">
{month}
{dayofmonth}{dayofmonthsuffix}</a>
<a href="{ReblogURL}" target="_blank">
<i class="fa fa-retweet" aria-hidden="true"></i></a>
{block:PermalinkPage}
{block:NoteCount}
<a href="{PermaLink}">{NoteCount}</a>
{/block:NoteCount}
{/block:PermalinkPage}
{/block:IndexPage}
</div>
{/block:Answer}

<div style="display:none">
{block:RebloggedFrom}
<a href="{ReblogParentURL}" target="_blank"></a>
{/block:RebloggedFrom}
{block:ContentSource}
<a href="{SourceURL}" target="_blank">
source</a>
{/block:ContentSource}
</div>
</div>
<div id="caixa">
{block:PermalinkPage}
{block:HasTags}
<div id="lpermalink">
<div class="fa fa-tags" aria-hidden="true"></div> &nbsp;
{block:Tags}
<a href="{TagURL}">{Tag},</a>
{/block:Tags}
</div>
{/block:HasTags}
{block:Date}
<div id="lpermalink"> <div class="fa fa-calendar-check-o" aria-hidden="true"></div>  &nbsp;{TimeAgo}, {month}, {dayofmonth}{dayofmonthsuffix}
</div>
{/block:Date}
{block:NoteCount}
<div id="lpermalink">
<div class="fa fa-heart" aria-hidden="true"></div>  &nbsp;
{NoteCountWithLabel}
</div>
{/block:NoteCount}
{block:RebloggedFrom}
<div id="lpermalink">
<div class="fa fa-users" aria-hidden="true"></div>  &nbsp;
from <a href="{ReblogParentURL}">{ReblogParentName}</a>,
by <a href="{ReblogRootURL}">{ReblogRootName}</a>.
</div>
{block:RebloggedFrom}
{block:PostNotes}
<div class="lnotes">
{PostNotes-64}
</div>
{/block:PostNotes}
{/block:PermalinkPage}
</div>
{/block:Posts}

</div>

<div id="pagination">
{block:Pagination}
{block:PreviousPage}
<a href="{PreviousPage}">
<div class="fa fa-angle-left" aria-hidden="true"></div></a>
{/block:PreviousPage}
{/block:Pagination}
{block:Pagination}
{block:NextPage}
<a href="{NextPage}">
<div class="fa fa-angle-right" aria-hidden="true"></div>
{/block:NextPage}
{/block:Pagination}
</div>


</body>
</html>