EDITC - THEME 01. IR

<link href="https://fonts.googleapis.com/css2?family=Marck+Script&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Roboto&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Righteous&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Notable&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=VT323&display=swap" rel="stylesheet">

<html>

<!--
THEME 01. - EDICT
INTERSTELLAR RESOURCES
PLEASE MESSAGE IF YOU HAVE ANY ISSUES


SKELETON CODE BY
 https://fratdadbase.tumblr.com/
-->



    <head>

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


<link href="https://static.tumblr.com/5omyijl/bzrn2yg7i/style-my-tooltips.css" rel="stylesheet" type="text/css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
<script src="https://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:500
});
});
})(jQuery);
</script>



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


        <meta name="image:body" content=""/>
        <meta name="image:info" content=""/>
        <meta name="image:sidebox" content="https://via.placeholder.com/600x150"/>
        <meta name="image:topimage" content="https://via.placeholder.com/320x150"/>
        <meta name="image:bottomimage" content="https://via.placeholder.com/320x150"/>
        <meta name="image:header1" content=""/>

        <meta name="color:text" content="#1e1e1e"/>
        <meta name="color:background" content="#ffffff"/>
        <meta name="color:post" content="#ffffff"/>
        <meta name="color:container" content="#ffffff"/>
        <meta name="color:main link" content="#9cbdb1"/>
        <meta name="color:navigation" content="#000000" />
        <meta name-"color: navigation hover" content="#222222"/>
        <meta name="color:blockquote" content="#000000"/>
        <meta name="color:sidebox" content=""/>
        <meta name="color:sideboxfont" content=""/>
        <meta name="color:middletext" content="#f6f6f6"/>
        <meta name="color:bold" content="#373737"/>
        <meta name="color:italic" content="#656565"/>
        <meta name="color:header1" content=""/>
        <meta name="color:header2" content="#000000"/>
        <meta name="color:header3" content="#000000"/>
        <meta name="color:header4" content="#ffffff"/>
        <meta name="color:header4background" content="#000000"/>
        <meta name="color:header4border" content="#222222"/>
        <meta name="color:title" content="#333333"/>

        <meta name="text:middletext" content="put stuff here"/>
        <meta name="text:sidebox" content="put stuff here"/>
        <meta name="text:link one title" content="title here" />
        <meta name="text:link one url" content="/url here"/>
        <meta name="text:link two title" content="title here" />
        <meta name="text:link two url" content="/url here"/>
        <meta name="text:link three title" content="title here" />
        <meta name="text:link three url" content="/url here"/>

    </head>

<style type="text/css">

/*                        SCROLL BAR                */

::-webkit-scrollbar {
  width: 2px;
  height: 2px;
}
::-webkit-scrollbar-button {
  width: 0px;
  height: 0px;
}
::-webkit-scrollbar-thumb {
  background: transparent;
  border: 0px none transparent;
  border-radius: 50px;
}
::-webkit-scrollbar-thumb:hover {
  background:  transparent;
}
::-webkit-scrollbar-thumb:active {
  background:  transparent;
}
::-webkit-scrollbar-track {
  background: transparent;
  border: 0px none transparent;
  border-radius: 0px;
}
::-webkit-scrollbar-track:hover {
  background: transparent;
}
::-webkit-scrollbar-track:active {
  background: transparent;
}
::-webkit-scrollbar-corner {
  background: transparent;
}


/*                        BODY                */

body {
   background-color:{color:background};
   background-image: url('{image:body}');
   background-repeat: no-repeat;
   font-family:helvetica, sans-serif;
   font-size: 11px;
   color:{color:text};
}


#container {
    position:absolute;
    background-color: {color:container};
    padding: 5px;
    width: 260px;
    margin-top:60px;
    margin-left: 200px;
    height:450px;
    overflow:auto;
    overflow-x:hidden;
    z-index: 99999999;
    border: 2px solid {color:middletext};
}

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

.posts {
    width:250px;
    margin-bottom:40px;
    background-color: {color:post};
    padding: 5px;
    border-bottom: 1px solid #ebebeb;
}

/*                        IMAGE DECOR                */

#sidebox {
    position: absolute;
    background-color: {color:background};
    padding: 5px;
    width: 600px;
    height: 150px;
    left: 207px;
    top: 540px;
    overflow: none;
    text-align: justify;
    border: 2px solid #ebebeb;
    color: {color:sideboxfont};
    z-index: 0;
}


#sidetext {
    background-color: {color:background};
    width:575px;
    position: absolute;
    height: 125px;
    left: 220px;
    top: 555px;
    padding: 5px;
    text-align: justify;
    z-index: 999999;
    opacity: 0;
    overflow: auto;
    -webkit-transition: all 0.6s ease-in-out;
    -moz-transition: all 0.6s ease-in-out;
    -o-transition: all 0.6s ease-in-out;
    -ms-transition: all 0.6s ease-in-out;
    transition: all 0.6s ease-in-out;

}

#sidetext:hover {
    opacity: 1;
    -webkit-transition: all 0.6s ease-in-out;
    -moz-transition: all 0.6s ease-in-out;
    -o-transition: all 0.6s ease-in-out;
    -ms-transition: all 0.6s ease-in-out;
    transition: all 0.6s ease-in-out;
}

.topimage {
    position:absolute;
    background-color: {color:container};
    padding: 5px;
    width: 320px;
    margin-top:60px;
    margin-left: 480px;
    height:150px;
    overflow:auto;
    overflow-x:hidden;
    z-index: 99999999;
    border: 2px solid #ebebeb;
}

.middletext {
    position: absolute;
    background-color: {color:middletext};
    padding: 5px;
    width: 300px;
    height: 75px;
    margin-top: 250px;
    margin-left: 490px;
    overflow:auto;
}

.bottomimage {
    position:absolute;
    background-color: {color:container};
    padding: 5px;
    width: 320px;
    margin-top:360px;
    margin-left: 480px;
    height:150px;
    overflow:auto;
    overflow-x:hidden;
    z-index: 99999999;
    border: 2px solid #ebebeb;
}


#s-m-t-tooltip {
    max-width:400px;
    margin:15px;
    padding:2px 8px;
    background: {color:bold};
    background-image:url('');
    background-repeat:repeat;
    background-attachment:fixed;
    border-left: 3px solid {color:italic};
    border-right: 3px solid {color:italic};
    color:{color:text};
    text-shadow:1px 1px 0px #000,
    z-index:99999999999999999999;
    font-size:9px;
    letter-spacing:2px;
    font-style:bold;
    letter-spacing:2px;
    font-family: calibri;
    text-transform:uppercase;
}


/*                        FONT DECOR                */


h1 {
    font-family: 'Notable', sans-serif;
    font-size: 15px;
    text-align:center;
    text-transform:uppercase;
    color: {color:header1};
    background-image: url('{image:header1}');
    background-position:left;
    background-repeat:repeat;
    background-attachment:fixed;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;

}

h2 {
    text-align:center;
    text-transform:uppercase;
    color: {color:header2};
    font-family: 'Righteous', cursive;
    letter-spacing: 1px;
    font-size: 25px;
}

h3 {
    text-align:center;
    text-transform:uppercase;
    color: {color:header3};
    font-family: 'VT323', monospace;
    font-size: 12px;
}

h4 {
    text-align: center;
    text-transform: uppercase;
    color: {color:header4};
    font-family: courier;
    font-weight: bold;
    font-size: 15px;
    padding-top: 5px;
    padding-bottom: 5px;
    background-color: {color:header4background};
    border-left: 4px solid {color:header4border};
    border-right: 4px solid {color:header4border};
}

t, title {
    text-align: right;
    font-size: 18px;
    font-family: georgia;
    color: {color:title};
    text-transform: uppercase;

}

b, bold, strong {
    text-align:center;
    text-transform:uppercase;
    color: {color:bold};
    font-family: 'Righteous', cursive;
    font-size: 13px;
}

i, italic {
    text-align:center;
    text-transform:uppercase;
    color: {color:italic};
    font-family: 'Marck Script', cursive;
    text-transform: lowercase;
    font-size: 20px;
}

code {
    size: 10px;
    font-family: courier new;
    text-transform: uppercase;
}

blockquote {
    border-left: 1px solid {color:blockquote};
    padding: 5px;
    margin:0px 0px 5px 5px;
    border-radius: 3px;
}

blockquote img {
    max-width:100%;
    height:100%;
}

.chat ul {
    list-style: none;
	margin: 0;
	padding: 10;
}

.chat li {
    border-radius: 0.2em;
	border: 1px solid rgba(0, 0, 0, 0.05);
	box-shadow: 1px 1px 1px rgb(255, 255, 255) inset;
	margin-bottom: 2%;
	padding: 2%;
	width: 50%;
}

.chat .odd {
    float: left;
	background: rgb(236, 236, 236);
	padding-bottom: 10px;
}
.chat .even {
	float: right;
	background: rgb(166, 230, 255);
	padding-bottom: 10px;
}


/*                        LINKS DECOR                */

a {
    text-decoration:none;
    color: {color:main link};
    font-family: 'Roboto', sans-serif;
    text-transform: uppercase;
    font-size: 9px;
    -webkit-transition: all 0.6s ease-in-out;
    -moz-transition: all 0.6s ease-in-out;
    -o-transition: all 0.6s ease-in-out;
    -ms-transition: all 0.6s ease-in-out;
    transition: all 0.6s ease-in-out;
}

a:hover {
    letter-spacing: 1px;
    -webkit-transition: all 0.6s ease-in-out;
    -moz-transition: all 0.6s ease-in-out;
    -o-transition: all 0.6s ease-in-out;
    -ms-transition: all 0.6s ease-in-out;
    transition: all 0.6s ease-in-out;
}


.navigation {
    top: 590px;
    left: 830px;
    width: auto;
    height: auto;
    position: absolute;
}

.navigation a {
    font-family: 'VT323', monospace;
    color: {color:navigation};
    font-size: 12px;
    display: inline-block;
    text-align: justify;
     -webkit-transition: all 0.6s ease-in-out;
    -moz-transition: all 0.6s ease-in-out;
    -o-transition: all 0.6s ease-in-out;
    -ms-transition: all 0.6s ease-in-out;
    transition: all 0.6s ease-in-out;
}

.navigation a:hover {
    color: {color:navigation hover};
     -webkit-transition: all 0.6s ease-in-out;
    -moz-transition: all 0.6s ease-in-out;
    -o-transition: all 0.6s ease-in-out;
    -ms-transition: all 0.6s ease-in-out;
    transition: all 0.6s ease-in-out;
}

.credit {
    position: absolute;
    left: 95%;
    top: 95%;
    width: auto;
    height: auto;
}

.credit a {
    font-size: 15px;
    color: {color:navigation};
    -webkit-transition: all 0.6s ease-in-out;
    -moz-transition: all 0.6s ease-in-out;
    -o-transition: all 0.6s ease-in-out;
    -ms-transition: all 0.6s ease-in-out;
    transition: all 0.6s ease-in-out;
}

.credit a:hover {
    color: {color:navigation hover};
    -webkit-transition: all 0.6s ease-in-out;
    -moz-transition: all 0.6s ease-in-out;
    -o-transition: all 0.6s ease-in-out;
    -ms-transition: all 0.6s ease-in-out;
    transition: all 0.6s ease-in-out;
}

.tags {
    text-align:center;
    background-color:transparent;
    padding-bottom:6px;
    padding-top:4px;
    opacity: .5;
}


.tags a {
    color #66947e;
    font-family: courier new;
    text-decoration:none;
    text-transform:lowercase;
    -webkit-transition: all 0.6s ease-in-out;
    -moz-transition: all 0.6s ease-in-out;
    -o-transition: all 0.6s ease-in-out;
    -ms-transition: all 0.6s ease-in-out;
    transition: all 0.6s ease-in-out;
}

.tags a:hover {
    color: #aec4ba;
    text-shadow: 0 0 5px rgba(137, 132, 53, 0.5);
    letter-spacing: 0px;
}

.info {
    font-size:8px;
    text-align:center;
    background-color:#ffffff;
    background-image: url('{image:info}');
    padding-top:2px;
    padding-bottom: 2px;
    border-bottom: 1px solid #000000;
}

.info a {
    font-size:8px;
    color:#ffffff;
    text-shadow: 2px 2px 2px #ffffff;
    text-decoration:none;
    text-transform:normal;
    -webkit-transition: all 0.6s ease-in-out;
    -moz-transition: all 0.6s ease-in-out;
    -o-transition: all 0.6s ease-in-out;
    -ms-transition: all 0.6s ease-in-out;
    transition: all 0.6s ease-in-out;
}
.info a:hover {
    color:#98b1b9;
    text-shadow: 2px 2px 2px #98b1b9;
    color: transparent;
    text-shadow: 0 0 5px rgba(137, 132, 53, 0.5);
}


/*                        ASK DECOR                */

#asker {
   text-transform:uppercase;
   padding-bottom:5px;
   font-family: 'VT323', monospace;
   text-align:center;
   font-size: 15px;
   line-height: 16px;
   color: {color:bold};
}

#asker a {
   text-transform:uppercase;
   padding-bottom:5px;
   font-family: 'VT323', monospace;
   text-align:center;
   font-size: 15px;
   line-height: 16px;
   color: {color:bold};
}

#question {
    text-transform: None;
    font-family: calibri;
    font-size: 12px;
}

#header {
    text-align:center;
    font-size:10px;
    margin-top:40px;
}
#pagination {
    position:fixed;
    text-align:center;
    top: 50px;
    left: 455px;
}


/*                        NOTE                */



.notecontainer {
    background-color: transparent;
    border: 0px solid transparent;
    width:380px;
    padding: 0px;
    text-transform:uppercase;
    font-style:normal;
    font-size: 10px;
    height: 150px;
    overflow: auto;
    margin-left: 50px;
    text-align:left;

}
.note {
    background-color: transparent;
    border: 1px solid transparent;
    width:280px;
    padding: 0px;
    text-transform:uppercase;
    font-style:normal;
    font-size: 10px;
    height: auto;
    overflow: auto;
    margin-left: -25px;
    text-align:left;

}

.note li {
    list-style-type:none;
    padding: 10px;
    text-align:left;
    margin:0px;
    -moz-transition-duration:0.5s;
    -webkit-transition-duration:0.5s;
    -o-transition-duration:0.5s;}

.note img.avatar {
    margin-right: 10px;
    width: 25px;
    height: 25px;}

</style>





<body>


<div class="navigation">
<a href="/" title="home">HOME</a><br>
<a href="/ask" title="ask">QUESTIONS</a><br>
<a href="{text: link one url}" title="{text:link one title}">{text:link one title}</a><br>
<a href="{text:link two url}" title="{text:link two title}">{text:link two title}</a><br>
<a href="{text:link three url}" title="{text:link three title}">{text:link three title}</a><br>
</div>


<div class="topimage"><img src="{image:topimage}"></div>

<div class="middletext">
    <center>
     {text:middletext}
    </center>
</div>

<div class="bottomimage"><img src="{image:bottomimage}"></div>

<div id="sidebox"><img src="{image:sidebox}"></div>

<div id="sidetext">{text:sidebox}</div>

<div class="credit">
    <a href="https://interstellarresources.tumblr.com">☾</a>
</div>


<div id="pagination">{block:Pagination}
{block:PreviousPage}<a href="{PreviousPage}" style="margin-left: -460px;">prev</a>{/block:PreviousPage} {block:NextPage}<a href="{NextPage}">next</a>
{/block:NextPage}
{/block:Pagination}</div>

<div id="container">

{block:Posts}

<div class="posts">

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

{block:Photo}<center>{LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}"/>{LinkCloseTag}</center>{block:Caption}{Caption}{/block:Caption}
{/block:Photo}

{block:Photoset}{Photoset}{block:Caption}{Caption}{/block:Caption}{/block:Photoset}

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

{block:Video}
<div class="video">{Video-250}</div>
{/block:Video}

{block:Panorama}{LinkOpenTag}<img src="{PhotoURL-Panorama}" alt="{PhotoAlt}"/>{LinkCloseTag}{block:Caption}{Caption}{/block:Caption}{/block:Panorama}


{block:Quote}<t>"{Quote}"</t><br>{block:Source}<i><center>{Source}</center></i>{/block:Source}{/block:Quote}


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


{block:Chat}
          {block:Title}
            <h1>{Title}</h1>{/block:Title}<br>
<ul class="convo">{block:Lines}<li class="line_{Alt} user_{UserNumber}">{block:Label}<span class="label"><strong>{Label}</strong></span>{/block:Label}
{Line}</li>{/block:Lines}</ul>
            {/block:Chat}



{block:Video}{Video-250}{block:Caption}{Caption}{/block:Caption}{/block:Video}


{block:Audio}{AudioEmbed}{block:Caption}{Caption}{/block:Caption}{/block:Audio}


{block:Answer}
<div id="asker" style="word-wrap: break-word; max-width: 100%; margin-bottom: -20px;">{asker} asked</div>
<div id="question" style="word-wrap: break-word; max-width: 100%">{Question}</div>
<div id="answer" style="margin-top: 20px;">{Answer}</div>
{/block:Answer}


    <div class="info">

{block:Date}
<a href="{Permalink}"style="font-size: 12px; font-family: 'VT323', monospace;" title="{TimeAgo}, {ShortMonth} {DayOfMonthWithZero} with {NoteCount} notes ">{ShortMonth} {DayOfMonthWithZero} </a>
{/block:Date}


&nbsp;&nbsp;&nbsp;

<a href="{ReblogURL}" style="font-size:12px; font-family: 'VT323', monospace;" title="reblog"> Reblog </a>



{block:NoRebloggedFrom}
{block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}
{/block:NoRebloggedFrom}


{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 class="tags">{block:HasTags}{block:Tags}<a href="{TagURL}"> &nbsp;#{Tag}</a>{/block:Tags}{/block:HasTags}</div>
</div>

{/block:Posts}

<div class="notecontainer">
{block:PostNotes}{PostNotes}{/block:PostNotes}
</div>

</div>
</body>
</html>