RIVERS AND ROADS // 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


---->

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

<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="image:Sidebar" content="" />
<meta name="image:Background" content="" />
<meta name="if:Do Not Repeat Background" content="1"/>

<meta name="color:Background" content="#ffffff" />
<meta name="color:Text" content="#d1d1d1" />
<meta name="color:Link Hover" content="#ffffff" />
<meta name="color:Link" content="#cccccc" />
<meta name="color:Accent" content="#fafafa" />
<meta name="color:Bold" content="#c1ced7" />
<meta name="color:Italic" content="#c1ced7" />
<meta name="color:Underline" content="#c1ced7" />
<meta name="color:Scrollbar Main Border" content="#eeeeee" />
<meta name="color:Scrollbar Sub Border" content="#fafafa" />
<meta name="color:Scrollbar Background" content="#ffffff" />
<meta name="color:Background Selection" content="#eeeeee" />
<meta name="color:Text Selection" content="#c6c6c6" />
<meta name="color:Quote Text" content="#d1d1d1" />
<meta name="color:Quote Source" content="#ffffff" />
<meta name="color:Quote Source Background" content="##dcdfb2" />
<meta name="color:Sidebar Links" content="#cccccc" />

<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>

<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=Arvo|Cedarville+Cursive|Roboto" rel="stylesheet">

<script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
<script>
(function($){
$(document).ready(function(){
$("a[title]").style_my_tooltips({
tip_follows_cursor:true,
tip_delay_time:90,
tip_fade_speed:600,
attribute:"title"
});
});
})(jQuery);
</script>

<style>

body {background-color: {color:Background};
font-family:Roboto;
color: {color:Text};
text-align: left;
font-size: 11px;
line-height:20px;
background-image:url('{image:Background}');
background-attachment: fixed;
{block:IfDoNotRepeatBackground}
background-repeat: no-repeat;
{/block:IfDoNotRepeatBackground}}

#entries {float:center;
width:600px;
margin-left: 380px;
margin-top: 200px;}

.entry { text-align:justify;
width: 400px;
padding: 15px;
margin:70px;
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;}

#s-m-t-tooltip {max-width:300px;
padding:0px 5px 0px 5px;
margin:0px 10px 10px 15px;
font-size:10px;
font-family:Arvo;
letter-spacing:1px;
z-index:999999999999999999999999999999999999;
background:#fff;
color:{color:Text};
Text-transform:lowercase;}

::-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};}

#pagination {text-align:center;
width:400px;
color:{color:Text};
margin:0px 0px 40px 490px;
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};}

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

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

li {margin-left:-10px;}

.quote {Text-align:justify;
line-height: 21px;
border-radius:5px;
color:{color:Text Quote};
background:{color:Background};
padding:5px; }
.quotesource {
height:auto;
display:inline;
margin-left:5px;
text-transform:uppercase;
margin-top:0px;
font-weight:none;
padding:0px;
color:{color:Quote Source};
background:{color:Quote Source Background};
Text-align:left;}
.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};
position:absolute;
background:{color:Background};
padding:10px;
transition:all 1s ease;
margin-top:0px;
{block:IndexPage}
width: 400px;
opacity:0;
{/block:IndexPage}
{block:PermalinkPage}
width:400px;
opacity:1;
{/block:PermalinkPage}
Text-transform:lowercase;
text-align:right;
font-size: 9px;}

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

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

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

#photosinfo {width:60px;
position:absolute;
margin-left:410px;
transition:all 1s ease;
opacity:0;}

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

.date {position:absolute;
margin-left:10px;}
.date a {font-size:20px;
letter-spacing:2px;
text-align:center;
font-family:Arvo;
text-transform:uppercase;
color:{color:Link};}
#month {font-size:10px;
letter-spacing:1px;
color:{color:Text};
text-align:center;
margin-left:1px;
font-family:Arvo;}

#caixa {margin-left:85px;
width:400px;
margin-bottom:100px;}
#lpermalink {font-size:10px;
padding:10px;
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:400px;
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;}

#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:30px;
height:30px;
z-index:1;
overflow:hidden;
position:absolute;
margin-left:10px;
margin-top:10px;
transition:all 1s ease;}

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

#audi {position:absolute;
width:40px;
margin-left:5px;
margin-top:3px;
background:#f2f2f2;
display:block;
border-radius:100%;
height:40px;}

#sidebar {margin-left:480px;
width:400px;
height:auto;
margin-top:-100px;
position:absolute;
padding:0px;}
#sidebar img {width:30px;
margin-left:6px;
padding:5px;
border:1px solid{color:Accent};
margin-bottom:10px;
border-radius:100px;}

#desc {font-size:10px;
line-height:23px;
text-align:left;
color:{color:Text};
text-transform:none;
z-index:99999999999999999;
padding:5px 0px 5px 5px;
margin-left:2px;
margin-top:20px;
overflow-y:auto;}

#links {margin-left:-20px;
width:0px;
margin-top:-100px;
text-align:center;}
#links a {color:{color:Sidebar Links};
display:inline-block;
height:9px;
width:9px;
font-weight:bold;
margin-bottom:2px;
border-radius:50px;
text-decoration:underline;
text-transform:uppercase;
border:1px solid {color:Text};}
#links a:hover {background:{color:Link};
border:1px solid {color:Text};}

#title {font-size:20px;
letter-spacing:1px;
color:{color:Sidebar Links};
text-align:left;
font-family:Arvo;
margin-top:-47px;
margin-bottom:3px;
margin-left:70px;}

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

iframe.tmblr-iframe {
    opacity:0;
    display:none!important;}

#controls {right:5px;
top:15px;
color:#c6c6c6;
width:500px;
position:fixed;
text-align:right;}

#controls a {
font-size:13px;
letter-spacing:2px;
font-family:Arvo;
text-shadow: 1px 1px 0px #fff;
text-transform:lowercase;
margin-right:20px;
display:inline;
color:#c6c6c6;}

</style>

</head>
<body>

<div id="controls">
<a href="http://tumblr.com/follow/{Name}">follow </a>
<a href="http://tumblr.com">dash </a>
<a href="https://www.tumblr.com/dashboard?conversation={Name}"> Message </a>
</div>

<div id="sidebar">
<img src="{image:Sidebar}">
<div id="title">{Title}</div>
<div id="desc">{Description}</div>
<div id="links">
<a href="{text:Link 1}" title="{text:Link 1 Title}"></a>
<a href="{text:Link 2}" title="{text:Link 2 Title}"></a>
<a href="{text:Link 3}" title="{text:Link 3 Title}"></a>
<a href="{text:Link 4}" title="{text:Link 4 Title}"></a>
<a href="{text:Link 5}" title="{text:Link 5 Title}"></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-retweet" aria-hidden="true"></i></a>
{block:NoteCount}
<a href="{PermaLink}">{NoteCount}</a>
{/block:NoteCount}
</div>
{/block:IndexPage}
{/block:Text}

{block:Photo}
<div id="photosinfo">
<div class="date">
{block:Date}
<a href="{Permalink}">{DayOfMonthWithZero}</a>
<div id="month">{ShortMonth}</div></a>
{/block:Date}
</div>
</div>
<img src="{PhotoURL-400}">
{block:PermalinkPage}
{block:Caption}{Caption}{/block:Caption}
{/block:PermalinkPage}
{/block:Photo}

{block:Photoset}
<div id="photosinfo">
<div class="date">{block:Date}<a href="{Permalink}">{DayOfMonthWithZero}</a><div id="ms">{ShortMonth}</div></a>{/block:Date}</div>
</div>
<center>{Photoset}</center>
{block:PermalinkPage}
{Caption}
{/block:PermalinkPage}
{/block:Photoset}


{block:Quote}
<div class="quote">{Quote}</div>
<div class="quotesource">{Source}</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:NoteCount}
<a href="{PermaLink}">{NoteCount}</a>
{/block:NoteCount}
</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-retweet" aria-hidden="true"></i></a>
{block:NoteCount}
<a href="{PermaLink}">{NoteCount}</a>
{/block:NoteCount}
</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-retweet" aria-hidden="true"></i></a>
{block:NoteCount}
<a href="{PermaLink}">{NoteCount}</a>
{/block:NoteCount}
</div>
{/block:IndexPage}
{/block:Chat}

{block:Audio}
<div id="audi"></div>
<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-retweet" aria-hidden="true"></i></a>
{block:NoteCount}
<a href="{PermaLink}">{NoteCount}</a>
{/block:NoteCount}
</div>
{/block:IndexPage}
{/block:Audio}

{block:Video}
{block:IndexPage}
{Video-250}
{/block:IndexPage}
{block:PermalinkPage}
{Video-400}
{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-retweet" aria-hidden="true"></i></a>
{block:NoteCount}
<a href="{PermaLink}">{NoteCount}</a>
{/block:NoteCount}
</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:NoteCount}
<a href="{PermaLink}">{NoteCount}</a>
{/block:NoteCount}
</div>
{/block:IndexPage}
{/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-hashtag" 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-clock-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 class="loading"></div>

</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>