Wendy Theme Revamp - by Chloe

<!DOCTYPE html>
<head>
<!--
 _                  _     _
| |__  _   _    ___| |__ | | ___   ___
| '_ \| | | |  / __| '_ \| |/ _ \ / _ \
| |_) | |_| | | (__| | | | | (_) |  __/
|_.__/ \__, |  \___|_| |_|_|\___/ \___|
       |___/

Wendy Revamp by Chloe | @dontbrag | @bychloethemes
Do not delete the credit. Do not claim as your own. Do not copy any ideas or code. Do not redistribute.

For html help go to @htmlqueens

-->
<meta name="image:Sidebar" content="" />

<meta name="color:Background" content="#f6f6f6" />
<meta name="color:Text" content="#000" />
<meta name="color:Links" content="#666" />
<meta name="color:Posts" content="#fff" />
<meta name="color:Accent" content="#ccc" />

<meta name="if:Pagination" content="0" />
<meta name="if:Captions" content="1" />
<meta name="if:Tags On Index Page" content="1" />
<meta name="if:Black Permalinks" content="0" />

<meta name="text:Link 1" content="" />
<meta name="text:URL 1" content="" />
<meta name="text:Link 2" content="" />
<meta name="text:URL 2" content="" />
<meta name="text:Link 3" content="" />
<meta name="text:URL 3" content="" />

{block:Description}
<meta name="description" content="{MetaDescription}" />
{/block:Description}
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1.0, width=device-width" />
<title>{block:TagPage}{Tag} posts | {/block:TagPage} {block:PostSummary}{PostSummary} | {/block:PostSummary}{Title}</title>
<title>{text:Tab Title}</title>
<link rel="shortcut icon" href="{Favicon}">
<link rel="alternate" type="application/rss+xml" href="{RSS}">
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
<link href="http://static.tumblr.com/wgijwsy/k1Hm9ei8b/normalize.css" rel="stylesheet" type="text/css" />
<link href='//fonts.googleapis.com/css?family=Raleway:400,600' rel='stylesheet' type='text/css'>
<style type="text/css">
body {
    background: {color:Background};
    color: {color:Text};
    font-family: 'Raleway', sans-serif;
    font-size: 12px;
    margin: 0;
    padding: 0;
}
iframe, img, embed, object, video {
    max-width: 100%;
}
img {
    height: auto;
    width: auto;
    vertical-align:middle;
}
blockquote {
    border-left:1px solid {color:Accent};
    margin:0 0 0 15px;
    padding:0 0 0 5px;
}
a {
    color:{color:Links};
    text-decoration:none;
}
a:focus {
    outline:none;
}
b, strong {
    font-weight:600;
}
hr {
    height:1px;
    border:0;
    background:{color:Accent};
}
h1 {
    font-weight:400;
}
cite {
    margin-top:3px;
    display:block;
    text-align:right;
}
.credit {
    width:14px;
    height:13px;
    color: {color:Links};
    position:fixed;
    bottom: 15px;
    left: 15px;
    line-height: 14px;
    font-size:12px;
    text-transform: uppercase;
    padding:3px 4px;
    overflow: hidden;
        z-index:999999999999999999;
    text-align:left;
    -webkit-transition: all 0.5s ease-in-out;
       -moz-transition: all 0.5s ease-in-out;
         -o-transition: all 0.5s ease-in-out;
            transition: all 0.5s ease-in-out;
  }
    .credit:hover {
    width:126px;
    background:#000;
    color:#fff;
    -webkit-transition: all 0.5s ease-in-out;
       -moz-transition: all 0.5s ease-in-out;
         -o-transition: all 0.5s ease-in-out;
            transition: all 0.5s ease-in-out;
  }
  .credit a {
    color:#fff;
    text-decoration: none;
  }
  .credit .mine {
    opacity:0;
    visibility:hidden;
  }
  .credit:hover .mine {
    opacity: 1;
    visibility: visible;
    -webkit-transition: all 0.5s ease-in-out 0.5s;
       -moz-transition: all 0.5s ease-in-out 0.5s;
         -o-transition: all 0.5s ease-in-out 0.5s;
            transition: all 0.5s ease-in-out 0.5s;
}
.sidebar1 {
    width:200px;
    position:fixed;
    bottom:20px;
    padding:15px;
    z-index:9;
    left:-120px;
    margin-left:50%;
    text-align:justify;
    background:{color:Posts};
}
.sidebar1 h1 {
    margin:0;
    text-align:center;
}
p.description {
    margin:0;

}
ul.navlinks {
    padding:0;
    list-style-type:none;
    text-align:center;
    margin:0;
}
ul.navlinks li {
    display:inline-block;
    margin:0;
}
ul.navlinks li:after {
    content:' · ';
    margin:0 3px;
}
ul.navlinks li:first-child:before {
    content:' · ';
    margin:0 3px;
}
a.next {
    float:right;
}
.content {
    {block:IndexPage}
    margin-left:auto;
    margin-right:auto;
    width: 1160px;
    {/block:IndexPage}
    {block:PermalinkPage}
    width:430px;
    margin-bottom:60px;
    margin-left:50%;
    left:-580px;
    {/block:PermalinkPage}
}
article {
    {block:IndexPage}
    margin:20px 145px 20px 145px;
    width: 250px;
    {/block:IndexPage}
    padding:15px;
    position:relative;
    {block:permalinkpage}
    margin-top:20px;
    width:400px;
    {/block:permalinkpage}
    background:{color:Posts};
}
article h1 {
    margin:0;
}
article p {
    margin:10px 0;
}
article ul {
    padding:0;
    margin-left:30px;
}
.photoset {
    margin-bottom:-1px;
}
.short h1 {
    font-size:2em;
}
.medium h1 {
    font-size:1.5em;
}
.long h1 {
    font-size:1em;
}
ul.chat-list {
    list-style-type:none;
    padding:0;
    margin:0;
}
ul.chat-list li {
    margin:3px 0;
    padding:3px 0;
}
span.label {
    font-weight:bold;
}
.tumblr_audio_player {
    height: 30px;
    width: 250px;
}
.question2 p {
    display:inline;
    margin:0;
}
ul.permalinks2 {
    color:gray;
    list-style-type:none;
    padding:0;
    margin:0;
    font-size:22px;
    font-family:verdana;
    padding:0 5px;
    text-align:left;
    overflow:hidden;
    visibility:hidden;
    opacity:0;
    position:absolute;
    right:-55px;
    top:0px;
    width:20px;
    -webkit-transition: all 0.4s ease-in-out;
       -moz-transition: all 0.4s ease-in-out;
         -o-transition: all 0.4s ease-in-out;
            transition: all 0.4s ease-in-out;
}
.hovers:hover ul.permalinks2 {
   visibility:visible;
   opacity:1;
   right:-33px;
    -webkit-transition: all 0.4s ease-in-out;
       -moz-transition: all 0.4s ease-in-out;
         -o-transition: all 0.4s ease-in-out;
            transition: all 0.4s ease-in-out;
}
ul.permalinks2 li {
    border-bottom:0;
    margin:0;
    padding:0;
}
ul.permalinks2 li:last-child {
    margin-top:6px;
}
ul.permalinks2 li a {
    {block:IfNotBlackPermalinks}
    color:#ccc;
    {/block:IfNotBlackPermalinks}
    {block:IfBlackPermalinks}
    color:#000;
    {/block:IfBlackPermalinks}
}
ol.notes {
    list-style-type: none;
    margin:0 5px 0 0;
    padding:0;
}

ol.notes li.note {
    padding:0;
    text-align:left;
    line-height:16px;
    width:100%;
    border:0;
    border-radius:0;
    background:transparent;
    padding-bottom:3px;
    padding-top:3px;
}
ol.notes li.note img.avatar {
    display:none;
}

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

ol.notes li.note .answer_content {
    font-weight: normal;
}
.taggy {
    font-size:10px;
}
#infscr-loading {
    position:absolute;
    bottom:-10px;
    width:280px;
    left:145px;
    text-align:left;
    color:{color:Links};
}
#infscr-loading img{
    display:none;
}
</style>
</head>
<body>
<div class="sidebar1">
    <h1><a href="/">{Title}</a></h1>
    <hr>
    {block:IfSidebarImage}
    <img src="{image:Sidebar}">
    <hr>
    {/block:IfSidebarImage}
    {block:Description}<p class="description">{Description}</p>{/block:Description}
    <hr>
    <ul class="navlinks">
        <li><a href="/">home</a></li>
        {block:AskEnabled}
        <li><a href="/ask">ask</a></li>
        {/block:AskEnabled}
        {block:SubmissionsEnabled}
        <li><a href="/submit">submit</a></li>
        {/block:SubmissionsEnabled}
        {block:HasPages}
        {block:Pages}
        <li><a href="{URL}">{Label}</a></li>
        {/block:Pages}
        {/block:HasPages}
        {block:IfLink1}
        <li><a href="{text:URL 1}">{text:Link 1}</a></li>
        {/block:IfLink1}
        {block:IfLink2}
        <li><a href="{text:URL 2}">{text:Link 2}</a></li>
        {/block:IfLink2}
        {block:IfLink3}
        <li><a href="{text:URL 3}" >{text:Link 3}</a></li>
        {/block:IfLink3}
        <li><a href="/archive">archive</a></li>
        <li><a href="http://dontbrag.tumblr.com" target="_blank">theme</a></li>
    </ul>
    {block:IfPagination}
    <hr>
    {/block:IfPagination}
    {block:Pagination}
    <div class="pagination" {block:IfNotPagination}style="visibility:hidden;height:0;overflow-hidden;"{/block:IfNotPagination}>
    {block:PreviousPage}<a class="prev" href="{PreviousPage}">prev.</a>{/block:PreviousPage}
    {block:NextPage}<a class="next" href="{NextPage}">next</a>{/block:NextPage}
    </div>
{/block:Pagination}
</div>
<div class="content">
{block:Posts}
<article class="hovers">
    {block:IndexPage}
    <ul class="permalinks2">
        <li>{block:IfNotBlackPermalinks}{LikeButton}{/block:IfNotBlackPermalinks}{block:IfBlackPermalinks}{LikeButton color="black"}{/block:IfBlackPermalinks}</li>
        <li>{block:IfNotBlackPermalinks}{ReblogButton}{/block:IfNotBlackPermalinks}{block:IfBlackPermalinks}{ReblogButton color="black"}{/block:IfBlackPermalinks}</li>
        <li><a href="{Permalink}"><i class="fa fa-link"></i></a></li>
    </ul>
    {/block:IndexPage}
    {block:Text}
    <div class="text">
        {block:Title}<h1>{Title}</h1>{block:Title}
        <p>{Body}</p>
    </div>
    {/block:Text}

    {block:Photo}
    <div class="photo">
        <img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" />
    {block:indexpage}
    {block:IfCaptions}
    {block:Caption}<p>{Caption}</p>{/block:Caption}
    {/block:IfCaptions}
    {/block:indexpage}
    {block:permalinkpage}
    {block:Caption}<p>{Caption}</p>{/block:Caption}
    {/block:permalinkpage}
    </div>
    {/block:Photo}

    {block:Photoset}
    <div class="photoset">
    {block:indexpage}
    {Photoset-250}
    {block:IfCaptions}
    {block:Caption}<p>{Caption}</p>{/block:Caption}
    {/block:IfCaptions}
    {/block:indexpage}
    {block:permalinkpage}
    {Photoset-400}
    {block:Caption}<p>{Caption}</p>{/block:Caption}
    {/block:permalinkpage}
    </div>
    {/block:Photoset}

    {block:Quote}
    <div class="quote {Length}">
        <h1>&ldquo;{Quote}&rdquo;</h1>
        {block:Source}<cite>-&nbsp;{Source}</cite>{/block:Source}
    </div>
    {/block:Quote}

    {block:Link}
    <div class="link">
        <h1>&#8627;<a href="{URL}" {Target}>{Name}</a></h1>
        {block:Description}<p>{Description}</p>{/block:Description}
    </div>
    {/block:Link}

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

    {block:Audio}
<div class="audio">
    {block:AudioPlayer}{AudioPlayerBlack}{/block:AudioPlayer}
            Artist: <span{block:Artist} style="display:none;"
            {/block:Artist}>Unknown</span>
            {block:Artist}{Artist}{/block:Artist}</br>
            Title: <span{block:TrackName} style="display:none;"
            {/block:TrackName}>Unknown</span>
            {block:TrackName}{TrackName}{/block:TrackName}</br>
            Album: <span{block:Album} style="display:none;"
            {/block:Album}>Unknown</span>
            {block:Album}{Album}{/block:Album}{block:PlayCount}</br>
            Plays: {FormattedPlayCount}{/block:PlayCount}
</div>
{/block:Audio}

    {block:Video}
    <div class="video">
    {block:indexpage}
    {Video-250}
    {block:IfCaptions}
    {block:Caption}<p>{Caption}</p>{/block:Caption}
    {/block:IfCaptions}
    {/block:indexpage}
    {block:permalinkpage}
    {Video-400}
    {block:Caption}<p>{Caption}</p>{/block:Caption}
    {/block:permalinkpage}
    </div>
    {block:Video}

    {block:Answer}
    <div class="answer">
    <div>{lang:Asker asked 2}: {Question}</div>
    {block:Answerer}
    <div class="question2">{Answerer} replied: {Answer}</div>
    {/block:Answerer}
    <p>{Replies}</p>
    </div>
    {/block:Answer}
    {block:indexpage}
<!-- {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}
{/block:IndexPage}
{block:IndexPage}
{block:IfTagsOnIndexPage}
{block:HasTags}<div class="taggy">{block:Tags}<a href="{TagURL}">#{Tag}</a>&nbsp;{/block:Tags}</div>{/block:HasTags}
{/block:IfTagsOnIndexPage}
{/block:IndexPage}
</article>
{block:PermalinkPage}
{block:HasTags}
<article id="tags">
        filed under: {block:Tags}<a href="{TagURL}">#{Tag}</a>&nbsp;{/block:Tags}
</article>{/block:HasTags}
{block:PostNotes}
<article id="notes" class="postnotes">
    {PostNotes}
</article>
{/block:PostNotes}
{/block:PermalinkPage}
{/block:Posts}
</div>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
<script src="http://static.tumblr.com/wgijwsy/Ebfm2v4gy/jquery.masonry.min.js"></script>
<script src="http://static.tumblr.com/wgijwsy/u2vm2hxv6/jquery.infinitescroll.min.js"></script>
<script src="http://static.tumblr.com/iwtk77u/Yhym2yygt/jquery.imagesloaded.min.js"></script>
<!--Code for infinite scroll and grid layout-->
<script>
(function() {
    var $tumblelog = $('.content');
    {block:IfNotPagination}
    $tumblelog.infinitescroll({
        navSelector  : ".pagination",
        nextSelector : ".pagination a:first",
        itemSelector : "article",
        bufferPx     : 50,
        done : "",
        loading: {
            finishedMsg: "<p>You've reached the end of the Earth.</p>",
            img : "",
            msg: null,
            msgText: "<p><i class='fa fa-spinner fa-pulse fa-3x'></i></p>"
        },
    },
      function( newElements ) {
            var $newElems = $( newElements ).css({ opacity: 0 });
            $newElems.imagesLoaded(function(){
                $newElems.animate({ opacity: 1 });
                $tumblelog.masonry( 'appended', $newElems);
            });
          }
    );
    {/block:IfNotPagination}
    $tumblelog.imagesLoaded( function(){
      $tumblelog.masonry({
        columnWidth: function( containerWidth ) {
            return containerWidth / 100;
          }
      });
    });
})();
</script>
<div class="credit">
  <i class="fa fa-diamond"></i>&nbsp;<a class="mine" target="_blank" href="http://dontbrag.tumblr.com">ByChloeThemes</a>
</div>
</body>
</html>