neon;

<!DOCTYPE html>
<head>

<!-----------

neon; theme 02.
© pandathms | tumblr.com

terms:
do not claim as your own
do not steal the code/parts of this code
do not remove my credit

scripts:
gukthemes & catthms    | pxu photoset tutorial
shythemes              | video resize scripts
saturnthms             | icon font
google fonts           | muli font
cyantists              | tumblr controls

------------>

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


<!---- theme variables ---->


<meta name="color:text" content="#000000"/>
<meta name="color:links" content="#626262"/>
<meta name="color:borders" content="#eeeeee"/>
<meta name="color:scrollbar" content="#000000"/>
<meta name="color:scrollbar background" content="#ffffff"/>
<meta name="color:content background" content="#f8f8f8"/>
<meta name="color:posts background" content="#ffffff"/>
<meta name="color:selections" content="#000000"/>
<meta name="color:accent one" content="#729bf7"/>
<meta name="color:accent two" content="#f7729b"/>
<meta name="color:background" content="#000000"/>


<meta name="image:sidebar" content=""/>

<meta name="text:link 1 title" content="link"/>
<meta name="text:link 1 url" content=""/>
<meta name="text:link 2 title" content="link"/>
<meta name="text:link 2 url" content=""/>
<meta name="text:link 3 title" content="link"/>
<meta name="text:link 3 url" content=""/>

<!--- scripts --->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

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

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src ="//static.tumblr.com/fwgzvyf/Oj1o08f6h/shythemes.vr.js"></script>

<!--- icon fonts --->
<link href="//dl.dropbox.com/s/50g6fbds3rh4m0j/saturnicons.css" rel="stylesheet">

<!-- fonts --->
<link href="https://fonts.googleapis.com/css?family=Muli:400,400i,700i,800" rel="stylesheet">

    <style type="text/css">

/* scrollbar */

::-webkit-scrollbar {
background-color: {color:scrollbar bg};
height:8px;
width:5px;
}

::-webkit-scrollbar-thumb:vertical {
background-color:{color:scrollbar};
height:300px;
}

::-webkit-scrollbar-thumb:horizontal {
background-color:{color:scrollbar bg};
height:8px;
}

/* selection */
::-moz-selection {
	color: #ffffff;
	background-color: {color:selections};
}
::selection {
	color: #ffffff;
	background-color: {color:selections};
}



/* tooltips */

#s-m-t-tooltip {
max-width:300px;
margin:15px;
padding:5px;
border:1px solid #eeeeee;
border-radius:0px;
background:{color:background};
color:{color:text};
z-index:999999;
font-size:7px;
font-style:none;
letter-spacing:2px;
font-family:arial;
text-transform:uppercase;
box-shadow:1px 1px 3px rgba(0,0,0,.0);
}

/* body */

body {
    color:{color:text};
    font-family: 'Muli', sans-serif;
    font-size:11px;
    line-height:150%;
    margin:0;
    text-align:left;
    background:{color:background};
}



small {
    font-size:11px;
}

a {

  text-decoration:none;
  padding:5px;
  line-height:15px;
  border-radius:2px;
  color:{color:links};


}


a:hover {
    color:{color:accent one};
}

img {
    opacity:1;
    text-decoration:none;
}

h1 {
    font-size:14px;
    font-weight:bold;
    font-family:arial;
    line-height:150%;
    text-transform:uppercase;
}

blockquote {
    padding-left:10px;
    margin:10px;
    border-left:1px solid #eee;
}


/* navigation */

.navigation {
    width:200px;
    background:transparent;
    margin-top:5px;
    margin-left:-20px;
}




.links {
    text-align:center;
    padding:30px;
    text-transform:uppercase;
    font-size:10px;
    font-weight:bold;
     width:350px;
}

.links a {

    margin: 5px;
  padding: 10px;
  font-size:20px;
  text-align: center;
  text-transform: uppercase;
  transition: 0.5s;
  background-size: 200% auto;
  background: white;
  border-radius: 60px;
    background: linear-gradient(74deg, {color:accent two}, {color:accent one});
  color:transparent;
  -webkit-background-clip: text;
  background-clip: text;
}

.links a:hover {
    background-position: right center;
}
/* sidebar */

.sidebar {

    width:350px;
    margin-top:0px;
    margin-left:750px;
    height:100%;
    right:200px;
    position:fixed;
}
.gradient-side {
    margin:10px;
    width:300px;
    height:300px;
        background: transparent;

}

.gradient-side img {
    padding:0px;
    margin-top:-20px;
    width:300px;
    height:300px;
}




.description {
    text-align:justify;
    padding:20px;
    margin:5px;
    margin-left:25px;
    margin-top:0px;
    font-size:12px;
    width:260px;
    height:80px;
    overflow:auto;
    background:{color:posts background};
    margin-bottom:10px;
    color:{color:Text};
    border:1px solid {color:accent one};
}



/* pagination */
#pagi {
    width:500px;
    background:transparent;
    margin-top:40px;
    text-transform:uppercase;
    font-size:10px;
    font-weight:bold;
    padding:20px;
    letter-spacing:2px;
    color:{color:accent one};
    border-radius:3px;
    text-align:Center;
    margin-left:250px;
    margin-bottom:100px;
}

#pagi a {
    color:{color:accent one};
    padding:5px;
}

#pagi a:hover {
    color:{color:accent two};
}

/* posts */




.entries {
    margin-top:50px;
    width:500px;
    margin-left:250px;
    background:transparent;

}

.posts {
    width:500px;
    background:{color:posts background};
    padding:20px;
    border:1px solid {color:borders};
    color:{color:text};
}


/* quote */

.quote {
    background:linear-gradient(-120deg, {color:accent two}, {color:accent one});
    border-radius:5px;
    text-transform:uppercase;
    letter-spacing:1px;
    padding:10px;
    font-size:12px;
    color:white;
}

.quotesource {
    padding:10px;
    text-align:center;
    color:{color:text};
}

/* chat */

.chat {
    line-height:150%;
    list-style:none;
}

.line.odd {
    padding:10px;
    background:white;
    border:1px solid {color:accent one};
    color:{color:Text};
    border-radius:3px;
    margin-bottom:1px;
}

.line.even {
    padding:10px;
    border:1px solid {color:accent two};
    color:{color:text};
    background:white;
    border-radius:3px;
    margin-bottom:1px;
}

.label {
    text-transform:uppercase;
    font-size:10px;
    letter-spacing:1px;
    font-weight:bold;
}

/* audio */

.cover {
    position:relative;
    z-index:1;
    max-width:100px;
    padding:10px;
    float:left;
}

.playbutton {
    width:20px;
    height:30px;
    overflow:hidden;
    position:relative;
    z-index:2;

}


.playbox {
    background-color:#000;
    position:absolute;
    z-index:2;
    padding:15px 24px 13px 16px;
    margin-top:30px;
    margin-left:30px;
    opacity:0.5;
}

.trackdetails {
    padding:10px;
    width:auto;
    height:100px;
    margin-top:10px;
    margin-left:100px;
}

/* ask */

.question {
    background:linear-gradient(-120deg, {color:accent two}, {color:accent one});
    border-radius:5px;
    text-transform:uppercase;
    letter-spacing:1px;
    padding:10px;
    font-size:12px;
    color:white;
}



.asker {
    text-transform:uppercase;
    color:white;
}

.asker a:hover {
    color:white;
}

.answer {
    margin:10px;
}

/* info */

.info {
    padding:10px;
    text-transform:uppercase;
    border:1px solid {color:borders};
    margin-top:1px;
    width:520px;
    margin-bottom:70px;
    background:{color:posts background};
}

.info a {
     background-image: linear-gradient(120deg, {color:accent two}, {color:accent one});
  background-repeat: no-repeat;
  background-size: 100% 0.2em;
  background-position: 0 88%;
  transition: background-size 0.25s ease-in;
}

.info a:hover{
    background-size: 100% 88%;
    color:white;
}
.tags {
    margin-left:0px;
    margin-top:5px;
    word-wrap: break-word;
}

.tags a {
    text-transform:lowercase;
    margin-right:0px;
    letter-spacing:1px;
    line-height:20px;
}

/* post notes */
.notescontained {
    margin-top:-60px;
    width:540px;
    height:200px;
    overflow:auto;
    background:{color:posts background};
    border:1px solid {color:borders};
}

.notescontained a {
    text-decoration:none;
    color:{color:links hover};
}
ol.notes {
padding:10px;
margin:2px 0px 0px  5px;
list-style-type:none;
}

ol.notes li.note {
padding:10px;
}

ol.notes li.note img.avatar {
vertical-align:-4px;
margin-right:10px;
width:16px;
height:16px;
}

ol.notes li.note span.action {
font-weight:none;
}

ol.notes li.note .answer_content {
font-weight:normal;
}

ol.notes li.note blockquote {
padding:4px 10px;
margin:10px 0px 0px 25px;
}

ol.notes li.note blockquote a {
text-decoration:none;
}

/* controls */
iframe.tmblr-iframe {
    z-index:99999999999999!important;
    top:0!important;
    right:0!important;
    opacity:1;
    transform:scale(0.65);
    transform-origin:100% 0;
    -webkit-transform:scale(0.65);
    -webkit-transform-origin:100% 0;
    -o-transform:scale(0.65);
    -o-transform-origin:100% 0;
    -moz-transform:scale(0.65);
    -moz-transform-origin:100% 0;
    -ms-transform:scale(0.65);
    -ms-transform-origin:100% 0;}

iframe.tmblr-iframe:hover {
    opacity:1!important;}
/* credit */

.panda {
font-size:15px;
position:fixed;
font-weight:bold;
bottom:25px;
right:25px;
z-index:10;
text-align:right;
letter-spacing:1px;
padding:2px;
}

.panda a {
color:{color:accent two};
text-decoration:none;
background:white;
border-radius:60px;
padding-top:10px;
padding:10px;
padding-bottom:6px;
}

.panda a:hover {
color:{color:links hover};
text-decoration:none;
}

</style>
</head>

<body>

<div class="panda">
<a title="theme" href="http://pandathms.tumblr.com/" target="_blank"><span class="sf sf-panda-o"></span></a></div>











<div class="sidebar">


<center><div class="gradient-side"><br>






<img src="{image:sidebar}"></div></center>


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

 <div class="navigation">

<div class="links">
    <a href="/"><span class="saturn-font"><span class="sf sf-home"></span></span></a>
    <a href="/ask"><span class="saturn-font"><span class="sf sf-envelope-2"></span></span></a>
    <a href="{text:link 1 url}"><span class="saturn-font"><span class="sf sf-heart-2"></span></span></a>
    <a href="{text:link 2 url}"><span class="saturn-font"><span class="sf sf-bookmark"></span></span></a>
    <a href="{text:link 3 url}"><span class="saturn-font"><span class="sf sf-menu"></span></span></a>
</div>


</div>






</div>

<div class="entries">

{block:Posts}

<div class="posts">

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


{block:Photo}
<img src="{PhotoURL-500}" width="500px">
{block:Caption}{Caption}{/block:Caption}
{/block:Photo}


{block:Photoset}
<div class="set"><center><div class="pxu"><div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">{block:Photos}
<div class="photo-data"><div class="pxu-photo"><img src="{PhotoURL-500}" width="{PhotoWidth-500}" height="{PhotoHeight-500}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}"></div><a class="tumblr-box" rel="post-{PostID}" href="{PhotoURL-HighRes}"></a></div>{/block:Photos}</div></div></center></div>
{block:Caption}{Caption}{/block:Caption}
{/block:Photoset}


{block:Quote}
<div class="quote">{Quote}</div>
{block:Source}<div class="quotesource"> — {Source}</div>
{/block:Source}{/block:Quote}


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


{block:Chat}
{block:Title}<h1>{Title}</h1>{/block:Title} <div class="chat"> {block:Lines} <li class="line {Alt}"> {block:Label} <span class="label"> {Label}</span> {/block:Label}{Line}</li> {/block:Lines}</div>
{/block:Chat}


{block:Audio}

<div class="playbox"><div class="playbutton">{block:AudioPlayer}{AudioPlayerBlack}{/block:AudioPlayer}</div></div>

{block:AlbumArt}
<img src="{AlbumArtURL}" class="cover">
{/block:AlbumArt}


<div class="trackdetails"><br>
{block:TrackName}<b>TRACK:</b> {TrackName}{/block:TrackName}<br>

{block:Artist}<b>ARTIST:</b> {Artist}{/block:Artist}<br>

<b>PLAYS:</b> {FormattedPlayCount}</div>


{block:Caption}
<div class="caption">{Caption}</div>
{/block:Caption}
{/block:Audio}


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


{block:Answer}
<div class="question">
<div class="asker"><b>{Asker} sent a message:</b></div>
{Question}</div>
<div class="answer">
{Answer}</div>
{/block:Answer}



</div>
 <div class="info">
{block:Date}
<b><a href="{Permalink}" title="{TimeAgo}">{Month} {DayOfMonth}{DayOfMonthSuffix}</b></a>
{/block:Date}

&nbsp;&nbsp;
<a href="{Permalink}">{NoteCountWithLabel}</a>
&nbsp;&nbsp;


<font style="float:right">
<a href="{ReblogURL}"/> Reblog </a>
</font style>





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

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

  <div id="pagi">
{block:IndexPage}
<div id="pagination">
{block:Pagination}
{block:JumpPagination length="5"}
{block:CurrentPage}
<span class="current_page">{PageNumber}</span>
{/block:CurrentPage}
{block:JumpPage}
<a class="jump_page" href="{URL}">{PageNumber}</a>
{/block:JumpPage}
{/block:JumpPagination}
 {/block:Pagination}
</div>
{/block:IndexPage}
</div>


{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}
   <link href="//static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
<script src="//static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
<link href="//static.tumblr.com/wupwnyt/qWVoc4phj/resizing.css" rel="stylesheet" type="text/css"/>

<script>
// PXU Photoset Script by Pixel Union
$(document).ready(function(){
$('.photo-slideshow').pxuPhotoset({
lightbox:true,
rounded:false,
gutter:'0px',
borderRadius:'0px',
photoset:'.photo-slideshow',
photoWrap:'.photo-data',
photo:'.pxu-photo'
});
});
</script>
</body>