Skyline Theme 1

<!---

theme: ezgi

do not steal, claim as your own, redistribute.
do not remove the credit.

coded by
aubretia (ifallontragedy)

--->



<!DOCTYPE html>
<head>

<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="#c2e2d4"/>
<meta name="color:post bg" content="#fff"/>
<meta name="color:text" content="#8f8f8f"/>
<meta name="color:link" content="#000000"/>
<meta name="color:hover" content="#dcdacc"/>
<meta name="color:border" content="#f3f3f3"/>
<meta name="color:accent" content="#bf99da"/>

<meta name="image:image" content="http://i.imgur.com/ox9ZX9g.jpg" />
<meta name="image:background" content="" />

<meta name="text:main font" content="'hind', sans-serif" />
<meta name="text:secondary font" content="georgia, serif" />
<meta name="text:link i" content="" />
<meta name="text:link ii" content="" />
<meta name="text:link iii" content="" />
<meta name="text:link iv" content="" />
<meta name="text:link i text" content="link i" />
<meta name="text:link ii text" content="link ii" />
<meta name="text:link iii text" content="link iii" />
<meta name="text:link iv text" content="link iv" />

<meta name="if:500px posts" content="1"/>


<!-- jquery for tooltips-->


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

<script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>

<link href='https://fonts.googleapis.com/css?family=Hind:400,300,700' rel='stylesheet' type='text/css'>

<link href="https://fonts.googleapis.com/css?family=Sail" rel="stylesheet">


<style type="text/css">

/*custom font*/

@font-face{font-family:"HOMOARAK";src:url('https://dl.dropboxusercontent.com/s/6p07z71183pxs9z/HOMOARAK.TTF');}

/*scrollbar and selection*/
#s-m-t-tooltip{
max-width:400px;
margin:15px;
padding:2px 5px 2px 8px;
background: #0b0b0b;
background-image:url('http://static.tumblr.com/urxylsf/VrTme4j4b/bg.png');
background-repeat:repeat;
background-attachment:fixed;

color:#971b11;
text-shadow:1px 1px 0px #fff,
   1px -1px 0px #fff,
   -1px -1px 0px #fff,
   -1px 1px 0px #fff,
   0px 1px 0px #fff,
   0px -1px 0px #fff,
   1px 0px 0px #fff,
   -1px 0px 0px #fff;
z-index:99999999999999999999;
font-size:8px;
letter-spacing:2px;
font-style:bold;
letter-spacing:2px;
font-family: times;
opacity: 0.8;
text-transform:uppercase;
box-shadow:1px 1px 3px rgba(0,0,0,.1);}



::-webkit-scrollbar-thumb:vertical {
background-color: #c2e2d4;
width:1px;
height:2px;
border-left: 9px solid #c2e2d4;
border-right: 9px solid #c2e2d4;
}

::-webkit-scrollbar-thumb:horizontal {
background-color:#ebebeb;

}

::-webkit-scrollbar {
width: 19px;
background-color:#c2e2d4;

}

::-webkit-scrollbar-track {
background-color: #c2e2d4;
border-left: 9px solid #c2e2d4;
border-right: 9px solid #c2e2d4;
border-top: 0px solid #c2e2d4;
border-bottom: 0px solid #c2e2d4;
}


::selection {
color:#f6f6f6;
background-color: #c62b1f;
}

::-moz-selection {
color:#f6f6f6;
background-color: #c62b1f;
}



/*main*/
body {
    background: url(http://i.imgur.com/TBszgBR.png) #c2e2d4 no-repeat;
    background-attachment: fixed;
color:#595142;
font-family: cambria;
font-size: 9.5px;
letter-spacing: 0.2px;
font-weight:300;
-webkit-font-smoothing: antialiased;
word-spacing: 2px;
text-align:justify;
line-height:1.1em;
margin: 0;
overflow-y: none;
overflow-x: hidden;
}

a {
color:#c62b1f;
text-decoration: none;
}

a:hover {
color: #c62b1f;
}

hr {     border-width: 1px 1px 0;
           border-style: solid;
           border-color: #e7e7e7;
           width: 50%;
           margin-left: auto;
           margin-right: auto;
           margin-top: 15px;
           margin-bottom: 15px;
}

#entries {
position:relative;
height: 100%;
margin-left: 555px;
padding-bottom: 50px;
padding-top: 100px;
line-height:130%;
width: 400px;

}

#posts {
padding: 15px;
text-align: justify;
height: 100%;
color: #595142;
background: transparent;
border: 0px solid #c2e2d4;
line-height:130%;
width: 400px;
overflow:auto;
position: relative;
margin-bottom: 9px;

    -webkit-transition: 2s ease; /* Safari 3.1 to 6.0 */
    transition: 2s ease;
}

#posts:hover {
    opacity: 1.0;
        -webkit-transition: 2s ease; /* Safari 3.1 to 6.0 */
    transition: 2s ease;
}

#entries:hover {
    opacity: 1.0;
        -webkit-transition: 2s ease; /* Safari 3.1 to 6.0 */
    transition: 2s ease;
}

#posts img {
    max-width: 100%;
    height: auto;
}

#color-overlay {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background-color: transparent;
   opacity: 1.0;
}

#permalink {
word-spacing: 3px;
margin-top: 15px;
border-top: 1px solid #595142;
font-size: 9px;
padding-top: 10px;
letter-spacing: 0.5px;
color: silver;
}


#permalink a {
color: silver;
}

.date {
    text-transform: uppercase;
    margin-right: 3px;
    font-weight: bold;
}

.date .dt a {
    padding: 1px 5px 2px 5px;
    background: #595142;
    color: #595142!important;
}

.tags {
margin-top: 4px;
text-align: justify;
}

.tags a {
padding-right: 3px;
color: #595142 !important;
font-style: bold;
text-transform: uppercase;
font-size: 7px;
}

.tags a:hover {
color: #c62b1f!important;
}

.tags a::before {
content: '#';
opacity: 0.5;
}

.tags a::after {
margin-right: 10px;
}


/*LEFT SIDE*/
#left {
    position: fixed;
    width: 190px;
    margin-top: 230px;
    margin-left: 305px;
    background: transparent;
    border: 0px solid #c2e2d4;
    padding: 30px 20px;
}

#left b {
    color: #DC143C;
}

#left:hover {
    opacity: 1.0;
    -webkit-transition: 2s ease; /* Safari 3.1 to 6.0 */
    transition: 2s ease;

}

#left hr {
    border-width: 1px 1px 0;
           border-style: solid;
           border-color: #DC143C;
           width: 50%;
           margin-left: auto;
           margin-right: auto;
           margin-top: 15px;
           margin-bottom: 15px;
           opacity: 0.3;

}

.dsc {
margin-top: -10px;
}

.title a, .title {
    font-family: times;
    text-align: center;
    margin-bottom: 0px;
    font-size: 20px;
    color: #605645;
    font-style: italic;
    font-weight: bold;
    text-shadow: 1px 1px #e8e8e8;
}

.border {
    width: 75px;
    height: 2px;
    background: #c62b1f;
    margin: auto;
    margin-bottom: 10px;
    text-align: auto;
}

.links {
    text-align: center;
    margin-bottom: 15px;
}

.links a {
    display: inline-block;
    font-weight: normal;
    font-weight: bold;
    text-transform: uppercase;
    text-align: left;
    font-size: 8px;
    font-family: cambria;
    letter-spacing: 1px;
    padding: 8px 5px;
    text-shadow: 1px 1px #e8e8e8;
}

.right { text-align: center; }

.right img { width: 80px; }

/*pagination*/
#pag {
position: fixed;
text-transform: uppercase;
font-size: 8px;
text-align: center;
width: 170px;
top: 230px;
left: 335px;
text-shadow: 1px 1px #e8e8e8;
}

#pag a {
color: #605645;
font-weight: bold;
text-shadow: 1px 1px #e8e8e8;
}

#pag a:hover {
color: #c62b1f;
}


/*inside posts*/
#posts img, #posts img a {
max-width: 400px;

}

bold, strong, b {
color: #c62b1f;
text-transform: uppercase;
font-family: cambria;
font-size: 9px;
text-shadow: 1px 1px #e8e8e8;
}

i, italic, em {
font-style: italic;
}

small, sub, big, sup {
font-size: 9.5px;
}

code {
font-family: courier new;
letter-spacing: 0px;
font-size: 12px;
}

blockquote {
border-left: 1px solid #000000;
padding-left: 10px;
margin-left: 5px;
max-width: 400px!important;
margin-right: 5px;
}

ul li {
list-style: circle;
list-style-position: outside;
padding-right: 25px;
}

ol li {
list-style: lower-roman;
list-style-position: outside;
}

.chat {
    font-family: courier new;
}

.chat b {
    font-family: cambria;
}

/*notes*/
ol.notes {
list-style-type:none;
font-size: 7px;
text-transform: uppercase;
letter-spacing: 1px;
text-align: right;
margin-left: -10px;
width: 370px;

}

ol.notes li.note {
list-style-type:none;
border-bottom: 1px solid #000000;
padding: 5px;
}

ol.notes li.note img {
display: none;
}

img {
filter: none;
}

/*post title*/
.ptitle {
line-height: 130%;
color: #c62b1f;
font-size: 14px;
font-family: georgia, serif;
}

.ptitle a {
color: #c62b1f;
}

.ptitle a:hover {
color: #c62b1f;
}

/*quote*/
.quote {
text-align: center;
font-size: 16.5px;
font-family: georgia, serif;
line-height: 1.3em;
margin-bottom: 20px;
word-spacing: 3px;
color: #c62b1f;
}

.source {
width: 250px;
border-top: 1px solid #000000;
font-style: normal;
margin-bottom: 10px;
text-align: center;
margin-top:-5px;
text-transform: uppercase;
font-size: 9px;
letter-spacing: 1;
}

/*ask*/
#ask {
padding-bottom: 15px;
padding-top: 10px;
margin-bottom:7px;
border-bottom: 1px solid #000000;
text-align: center;
}

.asker {
text-transform: uppercase;
letter-spacing: 1px;
font-size: 10px;
font-family: georgia, serif;
text-align: right;
}

.asker a {
color: #c62b1f;
}

.asker a:hover {
color: #c62b1f;
}

.askicon {
float: right;
filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale"); /* Firefox 10+, Firefox on Android */
filter: gray; /* IE6-9 */
-webkit-filter: grayscale(100%); /* Chrome 19+, Safari 6+, Safari 6+ iOS */
-webkit-border-radius: 100%;
border-radius: 100%;
-moz-border-radius: 100%;
margin-left: 5px;
width: 20px;
}

/*audio*/
.albumart img {
width: 70px;
float: right;
padding: 3px;
border: 1px solid #000000;
}

.albumart {
text-align: center;
}

.audio {
margin-bottom: 5px;
}

#play {
opacity: 0.5;
background-color: white;
z-index: 1000;
margin: 2px 340px;

position: absolute;
top: 30px;
-moz-border-radius: 100%;
-webkit-border-radius: 100%;
border-radius: 100%;
left: 15px;
-moz-transition-duration:0.6s;
-webkit-transition-duration:0.6s;
-o-transition-duration:0.6s;
}

.button {
width: 18px;
height: 30px;
overflow: hidden;
position: relative;
z-index: 1000;
margin: 8px 16px 5px 8px;
}

#play:hover {
opacity: 1;
-moz-transition-duration:0.6s;
-webkit-transition-duration:0.6s;
-o-transition-duration:0.6s;
}

/*credit*/
#credit {
font-size:8px;
padding-bottom: 60px;
top: 20px;
width: 420px;

margin-left: 450px;
line-height: 100%;
text-align: center;
letter-spacing: 0.5px;
text-transform: uppercase;
}

#credit a {
font-weight: bold;
color: #c62b1f;
}

#credit a:hover {
color: #c62b1f;
}

/* Credits to http://pohroro.tumblr.com */

#c {
    width: 55px;
    height: 18px;
    font-family: Arial;
    font-size: 7px;
    font-weight:bold;
    text-transform: uppercase;
    bottom:  20px;
    right:  20px;
    text-align: center;
    letter-spacing: 1px;
    line-height: 0px;
    padding: 10px 3px;
    display: block;
    color: #605645;
    background: transparent;
    position: fixed;
}

#c a {
    font-weight: bold;
    line-height: 12px;
    font-size: 15px;
    font-family: Libre Baskerville;
    text-transform: lowercase;
    font-style: italic;
    letter-spacing: -1px;
    color: #971b11;
    text-shadow: 1px 1px #e8e8e8;
}

/*custom divs*/

div.descriptionwords span{
font-family: times;
color: #777;
letter-spacing: 0px;
line-height: 12px;
font-size: 9px;
text-shadow: 1px 1px #e8e8e8;
}

div.descriptionwords span b{
font-size: 8px;
color: #971b11;
letter-spacing: 1px;
text-transform: uppercase;
font-family: cambria;
text-shadow: 1px 1px #e8e8e8;
}

div.descriptionwords span b.specialbold{
font-size: 8px;
letter-spacing: 2px;
text-transform: uppercase;
font-family: cambria;
text-shadow: 1px 1px #e8e8e8;
font-style: italic;
}

div.descriptionwords span b.uppercasebold{
font-size: 8px;
letter-spacing: 0px;
text-transform: uppercase;
font-family: cambria;
text-shadow: 1px 1px #e8e8e8;
}

div.descriptionwords span center{
font-size: 8px;
letter-spacing: 0px;i style="font-weight: bold; letter-spacing: 1px;
}

div.descriptionwords span center i{
font-weight: bold;
letter-spacing: 1px;
}

div.descriptionwords span center b{
text-transform: uppercase;
text-shadow: 1px 1px #e8e8e8;
color: #971b11;
}

{CustomCSS}


</style>
</head>

<!-- Start of StatCounter Code for Tumblr -->
<script type="text/javascript">
var sc_project=11375973;
var sc_invisible=1;
var sc_security="c4052d11";
var scJsHost = (("https:" == document.location.protocol) ?
"https://secure." : "http://www.");
document.write("<sc"+"ript type='text/javascript' src='" +
scJsHost+
"statcounter.com/counter/counter.js'></"+"script>");
</script>
<noscript><div class="statcounter"><a title="web stats"
href="http://statcounter.com/" target="_blank"><img
class="statcounter"
src="//c.statcounter.com/11375973/0/c4052d11/1/" alt="web
stats"></a></div></noscript>
<!-- End of StatCounter Code for Tumblr -->

<body>
<div id="content">
<div id="left">
<div class="right"><a href="/"><img src="http://i.imgur.com/ox9ZX9g.jpg"></div></a>
<div class="dsc">

<div class="title"></div>

<div class="links"><a href="/rules" title="read me.">i.</a> <a href="/ask" title="message." class="">ii.</a> <a href="/navigation" title="navigate." class="">iii.</a> <a href="/about" title="about.">iv.</a></div>
</div>

<hr>
<div class-"descriptionwords">
    <span>
        &nbsp; &nbsp; an indie, unaffiliated <b>PETER PARKER /
        SPIDER-MAN</b> of Marvel's <b>THE AMAZING
        SPIDER-MAN SERIES</b>. semi selective. slow
        and slightly limited interaction, mutuals
        only — please view the <b>'rules'</b> page for
        further details. multiverse &amp; multiship.
        <br>
        <br>
        <b>this blog will contain:</b> canon
        divergence <b>·</b> drug, sex, violence, and gore
        related content <b>·</b> death &amp; death mentions
        <b>·</b> <i>all content will be tagged where needed.</i>
    </span>
    <hr>
    <center>
        Written by Ripley</i><br>
        <b>( est. dec. <b>·</b> 21 <b>·</b> 2016 )</b>
    </center>
</div>

<div id="pag">{block:Pagination}
{block:PreviousPage}
<a href="{PreviousPage}">back</a>
{/block:PreviousPage} <i>or</i> {block:NextPage}
<a href="{NextPage}">forward</a>
{/block:NextPage}{/block:Pagination}
</div>

</div>

<div id="entries">

{block:Posts}

<div id="posts">

<div class="cont">

{block:Text}<div class="capt">
{block:Title}<div class="ptitle">{Title}<br></div>{/block:Title}
{Body}</div>
{/block:Text}

{block:Link}<div class="capt">
<div class="ptitle"><a href="{URL}" {Target}>{Name} →</a></div>
{block:Description}{Description}{/block:Description}</div>
{/block:Link}

{block:Quote}<div class="capt">
<center><div class="quote">{Quote}</div>
{block:Source}
<div class="source"><br>{Source}</div></center>
{/block:Source}</div>
{/block:Quote}

{block:Chat}<div class="capt"><div class="chat">
{block:Title}<div class="ptitle">{Title}</div><p>{/block:Title}
{block:Lines}<div style="padding: 10px 0px; border-bottom: 1px solid {color:border}"><div class="{Alt} user_{UserNumber}">
{block:Label}<b>{Label}</b>{/block:Label}</div>
{Line}<br></div>{/block:Lines}<p></p></div></div>{/block:Chat}

{block:Photo}{LinkOpenTag}
{block:ifnot500pxposts}<img src="{PhotoURL-400}">{/block:ifnot500pxposts}
{block:if500pxposts}<img src="{PhotoURL-500}">{/block:if500pxposts}
{LinkCloseTag}
{block:Caption}<div class="capt">
{Caption}</div>
{/block:Caption}
{/block:Photo}

{block:Photoset}
{block:ifnot500pxposts}{Photoset-400}{/block:ifnot500pxposts}
{block:if500pxposts}{Photoset-500}{/block:if500pxposts}
{block:Caption}<div class="capt">
{Caption}</div>
{/block:Caption}
{/block:Photoset}

{block:Video}
{block:ifnot500pxposts}{Video-400}{/block:ifnot500pxposts}
{block:if500pxposts}{Video-500}{/block:if500pxposts}
{block:Caption}<div class="capt">
{Caption}</div>
{/block:Caption}
{/block:Video}

{block:Audio}<div class="capt">
<div class="albumart">{block:AlbumArt}<img src="{AlbumArtURL}" width="100">{/block:AlbumArt}</div>
<div class="audio"><div id="play">
<div class="button">{AudioPlayerWhite}</div></div>
<div style="padding-top: 20px; width: 400px; text-align: center;"><b>Track:</b> {block:TrackName}{TrackName}{/block:TrackName}<br>
<b>Artist:</b> {block:Artist}{Artist}{/block:Artist}<br>
<b>Album:</b> {block:Album}{Album}{/block:Album}</div></div>
{block:Caption}<br>{Caption}{/block:Caption}</div>{/block:Audio}



{block:Answer}<div class="capt">
<p><div id="ask"><span class="asker">{Asker}: </span><img src={AskerPortraitURL-96} class="askicon"> {Question}</div>
{Answer}</div>{/block:Answer}


<div id="permalink">
{block:Date}

<span class="date"><a href="{Permalink}" >{DayOfMonth}.{MonthNumber}.{ShortYear}{block:NoteCount} / {NoteCount}{/block:NoteCount}</a>{block:PermalinkPage}{block:RebloggedFrom} · <a href="{ReblogParentURL}" title="reblogged from">{ReblogParentName}</a>{block:ContentSource} / <a href="{ReblogRootURL}" title="originally by">{ReblogRootName}</a>{/block:ContentSource}{/block:RebloggedFrom}{/block:PermalinkPage}</span>

{/block:Date}

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


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

</div>

</div>

</div>

</div>

</body>

</html>