GONGGI THEME BY RNIRAE

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<!------------------theme by www.rnirae.tumblr.com/------------------------->

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

<!--TOOLTIP-->
 <link href="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 type="text/javascript" src="http://static.tumblr.com/7qjmkr5/IUmmdsy41/jquery.style-my-tooltips.js"></script><script>(function($){$(document).ready(function(){$("[title]").style_my_tooltips();});})(jQuery);</script>

 <!------>

 <meta name="color:Text" content="#aaa"/>
 <meta name="color:Background" content="#fff"/>
 <meta name="image:Background" content=""/>
 <meta name="image:Icon" content="http://41.media.tumblr.com/ee280c4a7bf844c3963335914653845e/tumblr_n31ijvN6kA1r99kxno1_1280.jpg"/>
 <meta name="color:Scrollbar" content="#8bb7e9"/>

 <meta name="color:Link" content="#ddd"/>
 <meta name="color:Link Hover" content="#f0f0f0"/>

 <meta name="color:Ask Background" content="#fcfcfc"/>

 <meta name="color:Header One" content="#d8d8d8"/>
 <meta name="color:Header One Border" content="#f2f2f2"/>

 <meta name="color:Posts Border" content="#f3f3f3"/>
 <meta name="color:Permalink" content="#bbb"/>
 <meta name="color:Permalink Background" content="#fff"/>
 <meta name="color:Permalink Hover" content="#eee"/>

 <meta name="color:Audio Posts Background" content="#fafafa"/>

 <meta name="color:Navigation Links" content="#dbdbdb"/>
 <meta name="color:First 3 Navigation Links Hover" content="#bce6e6"/>
 <meta name="color:Sidebar Text" content="#ccc"/>
 <meta name="color:Description First Letter" content="#e3eaf2"/>

 <meta name="color:Postnotes" content="#f6f6f6"/>
 <meta name="color:Blockquote" content="#f0f0f0"/>

 <meta name="color:Tooltip Text" content="#aaa"/>
 <meta name="color:Tooltip Background" content="#fff"/>
 <meta name="color:Tooltip Border" content="#efefef"/>
 <meta name="color:Tumblr Lightbox" content="#b8d4d4"/>

 <meta name="text:First Link URL" content="/"/>
 <meta name="text:First Link" content="index"/>
 <meta name="text:Second Link URL" content="/archive"/>
 <meta name="text:Second Link" content="archive"/>
 <meta name="text:Third Link URL" content="/ask"/>
 <meta name="text:Third Link" content="message"/>

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

 <meta name="if:Tiny Cursor" content="1" />

 <style type="text/css">

 /*IMAGES OPACITY*/
img {
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    opacity: .6;
    max-width: 100%;
}
img:hover {
    opacity: .8;
}
#vid {
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    opacity: .6;
}
#vid:hover {
    opacity: .8;
}
.quote {
    font: 12px times;
    font-style: italic;
    letter-spacing: 1px;
    padding-bottom: 5px;
}
.quote:first-letter {
    color: {color:Description First Letter};
}
.source {
    font: 8px calibri;
    text-transform: uppercase;
    letter-spacing: 1px;
    opacity: .8;
}
.uno {
    float: left;
    font-family: tahoma;
    opacity: .3;
    margin-top: -1px;
    margin-right: 5px;
}
/* IMPORTANT */
iframe#tumblr_controls {
    right:2px !important;
    position: fixed !important;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    opacity: 0.16;
}
iframe#tumblr_controls:hover {
    opacity: 0.8;
}
/* ------------ */

body {
    padding: 2x;
    margin: 0px;
    font-family: calibri;
    font-size: 10px;
    text-transform: normal;
    color: {color:Text};
    background-color: {color:Background};
    background-image: url({image:Background});
    {block:ifTinyCursor}
    cursor: url(http://i.imgur.com/ZOrzC.png), auto;
    {/block:ifTinyCursor}
}
a:link, a:active, a:visited {
    text-decoration: none;
    color: {color:Link};
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}
a:hover {
    color: {color:Link hover};
    {block:ifTinyCursor}
    cursor: url(http://cur.cursors-4u.net/others/oth-6/oth589.cur), auto;
    {/block:ifTinyCursor}
}
/* CONTENT/ENTRY */
#wrapper {
    margin-left:auto;
    margin-right:auto;
    width:600px;
    height:auto;
    margin-top:40px;
    margin-bottom:40px;
    padding:0;
    border:0;
    background-color: transparent;
}
#content {
    width:600px;
    height:auto;
    margin-left:auto;
    margin-right:auto;
    margin-top:50px;
    margin-bottom:50px;
    padding:0;
    border:0;
    background-color: transparent;
}
.entry {
    float: left;
    {block:PermalinkPage}
    width: 400px;
    {/block:PermalinkPage}
    {block:IndexPage}
    width: 250px;
    {/block:IndexPage}
    padding: 10px;
    padding-bottom: 7px;
    margin: 10px;
    {block:IndexPage}
    border: 1px solid {color:Posts border};
    background: #fff;
    {/block:IndexPage}
}
{block:IndexPage}
.re a {
    position: relative;
    color: {color:Permalink};
    text-transform: uppercase;
    font: 8px calibri;
    letter-spacing: 1px;
}
.re a:hover {
    color: {color:Permalink Hover};
}
#il {
    text-transform: uppercase;
    font: 8px calibri;
    letter-spacing: 1px;
    text-align:center;
    padding-top: 10px;
    z-index: 9999999999999;
    position: absolute;
    margin-top: -10px;
    opacity: 0;
    height: 20px;
    width: 250px;
    background: {color:Permalink Background};
    display: inline-block;
    -webkit-transition: all .6s ease-in-out;
    -moz-transition: all .6s ease-in-out;
    -ms-transition: all .6s ease-in-out;
    -o-transition: all .6s ease-in-out;
    transition: all .6s ease-in-out;
}
.entry:hover #il {
    margin-top: 0px;
    opacity: .96;
    -webkit-transition: all .6s ease-in-out;
    -moz-transition: all .6s ease-in-out;
    -ms-transition: all .6s ease-in-out;
    -o-transition: all .6s ease-in-out;
    transition: all .6s ease-in-out;
}
{/block:IndexPage}
/* TITLES/HEADERS ETC. */
h1 {
    font-family: calibri;
    font-style: italic;
    font-size: 16px;
    text-transform: lowercase;
    font-weight: normal;
    color: {color:Header One};
    border-bottom: 1px solid {color:Header One Border};
    padding-bottom: 6px;
    padding-left: 10px;
}
h1:first-letter {
    color: {color:Description First Letter};
}
h2 {
    border-bottom: none;
    font-weight: normal;
    font-style: italic;
    margin-top: 0px;
    font-family: cambria;
    letter-spacing: 1px;
    font-size: 16px;
    padding-left: 20px;
}
#s-m-t-tooltip{
    max-width:200px;
    margin:16px;
    padding: 5px;
    background-color: {color:Tooltip background};
    color: {color:Tooltip text};
    font-family:calibri;
    letter-spacing: 1px;
    font-size:8px;
    text-transform:uppercase;
    z-index: 999999;
    border:1px solid {color:Tooltip border};
}
::-webkit-scrollbar {
    width: 6px;
    height: 5px;
}
::-webkit-scrollbar-thumb {
    border: 1px solid {color:Scrollbar};
    background-color: #fff;
}

/* SIDEBAR */
#line {
    z-index: 999;
    position: fixed;
    width: 1px;
    height: 75%;
    background: {color:Posts border};
    {block:IndexPage}
    margin-left: 735px;
    {/block:IndexPage}
    {block:PermalinkPage}
    margin-left: 635px;
    {/block:PermalinkPage}
    margin-top: 48px;
}
.icon img {
    width: 50px;
    height: 50px;
    position: fixed;
    z-index: 99;
    border-radius: 5px;
    {block:IndexPage}
    margin-left: 670px;
    {/block:IndexPage}
    {block:PermalinkPage}
    margin-left: 570px;
    {/block:PermalinkPage}
    margin-top: 52px;
}
#nav {
    text-align: right;
    position: fixed;
    z-index: 99;
    {block:IndexPage}
    margin-left: 620px;
    {/block:IndexPage}
    {block:PermalinkPage}
    margin-left: 520px;
    {/block:PermalinkPage}
    margin-top: 125px;
    width: 100px;
}
#nav a {
    font: 8px calibri;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    font-style: italic;
    color: {color:Navigation Links};
    line-height: 13.5px;
    -webkit-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -ms-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
}
#nav a:hover {
    margin-right: 5px;
}
.i {
    width: 25px;
    height: 1px;
    position: fixed;
    background: {color:Posts border};
    {block:IndexPage}
    margin-left: 693px;
    {/block:IndexPage}
    {block:PermalinkPage}
    margin-left: 593px;
    {/block:PermalinkPage}
    margin-top: 115px;
}
#iaa {
    position: fixed;
    {block:IndexPage}
    margin-left: 735px;
    {/block:IndexPage}
    {block:PermalinkPage}
    margin-left: 635px;
    {/block:PermalinkPage}
    margin-top: 50px;
    z-index: 999;
}
#iaa a {
    font: 8px calibri;
    text-transform: uppercase;
    color: {color:Navigation Links};
    letter-spacing: 2px;
    line-height: 18px;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    border-left: 2px solid transparent;
    padding-left: 20px;
}
#iaa a:hover {
    border-left: 2px solid {color:First 3 Navigation Links Hover};
}
#desc {
    font-style: italic;
    letter-spacing: 1px;
    position: fixed;
    width: 110px;
    height: auto;
    {block:IndexPage}
    margin-left:760px;
    {/block:IndexPage}
    {block:PermalinkPage}
    margin-left: 660px;
    {/block:PermalinkPage}
    margin-top: 123px;
    color: {color:Sidebar Text};
    line-height: 15px;
}
#desc:first-letter {
    font-style: italic;
    font-family: cambria;
    color: {color:Description First Letter};
    text-transform: uppercase;
    font-size:16px;
    float: left;
    margin-right: 2px;
}
.sam {
    width: 25px;
    height: 1px;
    position: fixed;
    background: {color:Posts border};
    {block:IndexPage}
    margin-left: 760px;
    {/block:IndexPage}
    {block:PermalinkPage}
    margin-left: 660px;
    {/block:PermalinkPage}
    margin-top: 110px;
}
/* ANSWER/ASK POSTS */
.ask {
    background: {color:Ask background};
    padding: 8px;
    font: 8px calibri;
    text-transform: uppercase;
    font-style: italic;
    letter-spacing: 1px;
    text-shadow: 1px 1px #fff;
}
.asker {
    font: 8px calibri;
    text-transform: uppercase;
    letter-spacing: 1px;
    text-align: right;
    margin-right: 0px;
    margin-top: 5px;
    margin-bottom: 5px;
}
.ans {
    text-transform: uppercase;
    font: 8px calibri;
    letter-spacing: 1px;
}
/* POSTNOTES AND PERMALINK PAGE */
ol.notes {
    height: 200px;
    overflow: auto;
    width: 400px;
    list-style-type: none;
    margin-left: -40px;
}
ol.notes li.note a {
    color: {color:Text};
}
ol.notes li.note {
    font: 8px calibri;
    text-transform: uppercase;
    letter-spacing: 1px;
    list-style-type: none;
    display: block;
    padding: 6px;
    background: {color:Postnotes};
    border-bottom: 5px solid #fff;
    border-right: 5px solid #fff;
}
img.avatar {
    display: none;
}
#wo {
    border-top: 1px solid {color:Posts border};
    font: 8px calibri;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-top: 10px;
}
#pal {
    border-top: 1px solid {color:Posts border};
    font: 8px calibri;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-top: 10px;
    padding-bottom: 30px;
    margin-bottom: 16px;
    border-bottom: 1px solid {color:Posts border};
    margin-top: 20px;
}
#yuk {
    text-transform: uppercase;
    font-size: 8px;
    font-family: calibri;
    letter-spacing: 1px;
    line-height: 10px;
}
.chil {
     height:5px;
     width:5px;
     margin-top:2px;
     margin-right:5px;
     border:1px solid {color:Posts border};
     background: transparent;
     float: left;
}

blockquote {
    border-left: 1px solid {color:Blockquote};
    padding-left: 6px;
    margin-left: 6px;
}
.cred {
    z-index: 99999999999999999;
    position: fixed;
    font-family: calibri;
    font-size: 8px;
    text-transform: uppercase;
    letter-spacing: 1px;
    bottom: 3px;
    right: 6px;
}
/* AUDIO */
#play {
    width: 28px;
    height: 30px;
    overflow: hidden;
    opacity: .6;
    position: absolute;
}
#gu {
    {block:IndexPage}
    width:222px;
    {/block:IndexPage}
    {block:PermalinkPage}
    width: 372px;
    {/block:PermalinkPage}
    margin-left: 28px;
    padding-top: 8px;
    text-align: center;
    font: 8px calibri;
    text-transform: uppercase;
    letter-spacing: 1px;
    height: 19px;
    background: {color:Audio Posts background};
}
.artist {
    {block:IndexPage}
    font: 8px calibri;
    text-transform: uppercase;
    letter-spacing: 1px;
    text-align: right;
    margin-top: 3px;
    {/block:IndexPage}
}
.tumblrAutoPager_page_info, .tumblrAutoPager_page_separator {
    display:none;
}
#infscr-loading {
    display:none!important;
}
.navigation {
    display:none!important;
}
/*lightbox*/
#vignette { visibility: hidden; }
#tumblr_lightbox img { box-shadow: none !important; border-radius:0 !important; }
#tumblr_lightbox { background-color: transparent !important; }
#tumblr_lightbox div:nth-child(2) { background-color: {color:Tumblr Lightbox}; opacity: .8; }
#tumblr_lightbox_left_link, #tumblr_lightbox_right_link { visibility: hidden; }
#tumblr_lightbox a img { border: 5px solid #fff !important; opacity: 1; }
#tumblr_lightbox_caption { visibility: hidden; }



</style>

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

{block:IndexPage}
<!-------------infinite scroll-------------->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script src="http://static.tumblr.com/6hsqxdt/vmwm2rb4g/infinitescrolling.js"></script>
<script src="http://static.tumblr.com/6hsqxdt/QBym35odk/jquery.masonry.js"></script>
<script>
$(function(){
var $container = $('#content');
$container.imagesLoaded(function(){
$container.masonry({
itemSelector: '.entry',
});
});
$container.infinitescroll({
itemSelector : ".entry",
navSelector : "div.navigation",
nextSelector : ".navigation a#next",
loadingImg : "",
loadingText : "<em></em>",
bufferPx : 10000,
extraScrollPx: 12000,
},

function( newElements ) {
  var $newElems = $( newElements ).css({ opacity: 0 });

$newElems.imagesLoaded(function(){
$newElems.animate({ opacity: 1 });
$container.masonry( 'appended', $newElems, true );
});
}
);
});
</script>
{/block:IndexPage}



</head>


<body>
<!------------------------CREDITS DO NOT REMOVE----------------------->
<a href="http://www.rnirae.tumblr.com/" class="cred">thm</a>
<!------------------------------------------->
<div id="content">

<div id="line"></div>
<div class="icon" title="{Title}"><img src="{image:Icon}"/></div>
<div class="i"></div>
<div id="nav">
    <a href="{text:Link 1}">{text:Link 1 title}</a><br>
    <a href="{text:Link 2}">{text:Link 2 title}</a><br>
    <a href="{text:Link 3}">{text:Link 3 title}</a><br>
    <a href="{text:Link 4}">{text:Link 4 title}</a><br>
    <a href="{text:Link 5}">{text:Link 5 title}</a><br>
    <a href="{text:Link 6}">{text:Link 6 title}</a>
</div>
<div id="iaa">
    <a href="{text:First link url}">{text:first link}</a><br>
    <a href="{text:second link url}">{text:second link}</a><br>
    <a href="{text:third link url}">{text:third link}</a>
</div>

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

<div class="shib"></div>

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

<!------------------>
{block:IndexPage}
<div id="il">
<div class="re"><a href="{ReblogURL}" target="_blank">reblog</a>　//　<a href="{Permalink}">{NoteCountWithLabel}</a></div>
</div>
{/block:IndexPage}

<!------------------>


{block:Photo}
{block:IndexPage}<a href="{PhotoURL-500}"><img class="photo" src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="100%"/></a>
{/block:IndexPage}

{block:PermalinkPage}
{LinkOpenTag}<div class="photo"><a href="{PhotoURL-HighRes}"><img class="photo" src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="100%"/></a></div>

{LinkCloseTag}
{/block:PermalinkPage}
{/block:Photo}





{block:Photoset}
{block:IndexPage}
{Photoset-250}
{/block:IndexPage}
{block:PermalinkPage}
{Photoset-400}
{/block:PermalinkPage}
{/block:Photoset}





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





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





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





{block:Chat}
{block:Title}<h1>{Title}</h1>{/block:Title}
{block:Lines}
{block:Label}{Label}{/block:Label}
{Line}
{/block:Lines}
{/block:Chat}






{block:Audio}
<div id="play">
{AudioPlayerGrey}
</div>
<div id="gu">
    {block:TrackName}
    {TrackName}
    {/block:TrackName}
</div>
        {block:IndexPage}
    {block:Artist}
<div class="artist">
    by {Artist}
</div>
    {/block:Artist}
        {/block:IndexPage}
{/block:Audio}





{block:Answer}
<div class="ask">
{Question}
</div>
<div class="asker">
said {Asker}
</div>
<div class="ans">
{Answer}
</div>
{/block:Answer}





{block:Video}
{block:IndexPage}
<div id="vid">{Video-250}</div>
{/block:IndexPage}
{block:PermalinkPage}
<div id="vid">{Video-400}</div>
{/block:PermalinkPage}
{/block:Video}



<!------------------------PERMALINK PAGE------------------------------>
{block:PermalinkPage}
    {block:Caption}
    <div id="wo">
    {Caption}
    </div>
    {/block:Caption}

<div id="pal">
<div id="yuk">

{block:Date}
<p>
<div class="chil"></div>{ShortMonth}. {DayofMonth} {Year} <p>
<div class="chil"></div>{NoteCountWithLabel}

{/block:Date}


{block:RebloggedFrom}
<p>
<div class="chil"></div><a href="{ReblogParentURL}" title="{ReblogParentName}">via</a> | <a href="{ReblogRootURL}" title="{ReblogRootName}">source</a>
{/block:RebloggedFrom}

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


{block:PostNotes}
{PostNotes}
{/block:PostNotes}
{/block:PermalinkPage}
<!----------------------------------------------------------->

<!-------->

<!-------------->

</div>
{/block:Posts}
</div>

<div id="wrapper">
<div class="navigation">
    {block:Pagination}
{block:PreviousPage}<a href="{PreviousPage}">«</a>{/block:PreviousPage}
{block:CurrentPage}<span class="current_page">{PageNumber}</span>{/block:CurrentPage}

{block:NextPage}<a id="next" href="{NextPage}">»</a>{/block:NextPage}
    {/block:Pagination}
</div>
</div>



</body>

</html>