ANNOYING THEME

<!DOCTYPE html>

<head>

<meta name="viewport" content="width=device-width, initial-scale=1">

<!--FONTS-->

<style>
@import url('https://fonts.googleapis.com/css2?family=Rubik+Wet+Paint&display=swap');
</style>

<script type="text/javascript">

Splitting();

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

<!--METAS-->

    <!--BACKGROUND OPTIONS-->

    <meta name="color:background" contents="" />

    <meta name="image:background" contents="" />

    <meta name="if:background cover" content="" />

    <meta name="color:bold" contents="" />

    <meta name="color:italic" contents="" />

    <meta name="color:link" cotents="" />

    <!--HEADER-->

    <meta name="if:header text bob" contents="" />

    <meta name="text:header text" contents="" />

    <meta name="color:header text color" contents="" />

    <meta name="color:header text outline" contents="" />

    <meta name="text:header font family" contents="" />

    <!--SIDEBAR ICON OPTIONS-->

    <meta name="image:sidebar icon" contents="" />

    <meta name="if:round icon border" contents="" />

    <meta name="if:circle icon" contents="" />

    <meta name="text:icon border width" contents="" />

    <meta name="color:icon border color" contents="" />

    <meta name="select:icon border style" content="solid" />

    <meta name="select:icon border style" content="dashed" />

    <meta name="select:icon border style" content="dotted" />

    <meta name="select:icon border style" content="double" />

    <meta name="select:icon border style" content="groove" />

    <meta name="select:icon border style" content="ridge" />

    <meta name="select:icon border style" content="inset" />

    <meta name="select:icon border style" content="outset" />


    <!--DESC OPTIONS-->

    <meta name="color:description background" contents="" />

    <meta name="text:description" contents="" />

    <meta name="text:description font family" contents="" />

    <meta name="text:description font size" contents="" />

    <meta name="color:description font color" contents="" />


    <meta name="color:description border color" contents="" />

    <meta name="select:description border style" content="solid" />

    <meta name="select:description border style" content="dashed" />

    <meta name="select:description border style" content="dotted" />

    <meta name="select:description border style" content="double" />

    <meta name="select:description border style" content="groove" />

    <meta name="select:description border style" content="ridge" />

    <meta name="select:description border style" content="inset" />

    <meta name="select:description border style" content="outset" />


    <meta name="image:home link" contents="" />

    <meta name="text:home link title" contents="" />

    <meta name="text:home link font" contents="" />

    <meta name="text:home link font size" contents="" />

    <meta name="color:home link color" contents="" />


    <meta name="image:ask link" contents="" />

    <meta name="text:ask link title" contents="" />

    <meta name="text:ask link font" contents="" />

    <meta name="text:ask link font size" contents="" />

    <meta name="color:ask link color" contents="" />


    <meta name="text:link 1 font" contents="" />

    <meta name="text:link 1 font size" contents="" />

    <meta name="color:link 1 color" contents="" />


    <meta name="text:link 2 font" contents="" />

    <meta name="text:link 2 font size" contents="" />

    <meta name="color:link 2 color" contents="" />


    <meta name="text:link 3 font" contents="" />

    <meta name="text:link 3 font size" contents="" />

    <meta name="color:link 3 color" contents="" />


    <meta name="text:link 1" contents=" " />

    <meta name="text:link 2" contents=" " />

    <meta name="text:link 3" contents=" " />

    <meta name="image:link 1" contents="" />

    <meta name="image:link 2" contents="" />

    <meta name="image:link 3" contents="" />

    <meta name="text:link 1 URL" contents="" />

    <meta name="text:link 2 URL" contents="" />

    <meta name="text:link 3 URL" contents="" />

    <!--POSTS OPTIONS-->

    <meta name="color:posts background" contents="" />

    <meta name="color:posts font color" contents="" />

    <meta name="text:posts font size" contents="" />

    <meta name="text:posts font family" contents="" />

    <meta name="color:posts border color" contents="" />

    <meta name="text:posts border width" contents="" />

    <meta name="select:posts border style" content="solid" />

    <meta name="select:posts border style" content="dashed" />

    <meta name="select:posts border style" content="dotted" />

    <meta name="select:posts border style" content="double" />

    <meta name="select:posts border style" content="groove" />

    <meta name="select:posts border style" content="ridge" />

    <meta name="select:posts border style" content="inset" />

    <meta name="select:posts border style" content="outset" />

    <meta name="if:posts border blur" contents="" />

    <!--SCROLLBAR-->

    <meta name="color:scrollbar thumb" contents="" />

    <meta name="color:scrollbar background" contents="" />

    <meta name="text:scrollbar size" contents="" />

    <!--PAGINATION-->

    <meta name="image:next pagination" contents="" />

    <meta name="image:prev pagination" contents="" />

    <!--FOOTER STUFF-->

    <meta name="color:permalink" contents="" />

    <meta name="text:permalink font family" contents="" />

    <meta name="text:permalink font size" contents="" />

    <meta name="color:via" contents="" />

    <meta name="text:via font family" contents="" />

    <meta name="text:via font size" contents="" />

    <meta name="color:notes" contents="" />

    <meta name="text:notes font family" contents="" />

    <meta name="text:notes font size" contents="" />

    <meta name="color:tags" contents="" />

    <meta name="text:tags font family" contents="" />

    <meta name="text:tags font size" contents="" />

<style type="text/css">

/*DON'T TOUCH MEEE YOU'LL BREAK EVERYTHING*/

.wrapper {

transform: rotate(90deg) translateY(-50vh);

transform-origin: top left;

display: flex;

}

.outer-wrapper {

width: 480px;

height: 540px;

transform: rotate(-90deg) translateX(-50vh);

transform-origin: top left;

overflow-y: scroll;

margin-top: 191px;

overflow-x: hidden;

position: absolute;

}

.outer-wrapper img {

max-width: 100%;

max-height: 100%;

}

.outer-wrapper::-webkit-scrollbar {

display: none;

}

/*--CREEDDITTT--*/

#credit {

    position:fixed;

    left:12px;

    bottom:6px;

    font-size:14px;
}

/*GENERAL STUFF EUGH*/

html {

height: 100%;

}

body {

background-image: url('{image:background}');

{block:ifbackgroundcover}

background-size: cover;

{/block:ifbackgroundcover}

{block:ifnobackgroundcover}

background-repeat: repeat;

{/block:ifnobackgroundcover}

background-color: {color:background};

overflow: hidden;

}

a {

color: {color:link};

}

b, strong, bold {

color: {color:bold};

}

i, italic {

color: {color:italic};

}

blockquote {

margin: 0;

}

::-webkit-scrollbar {

height: {text:scrollbar size};

width: {text:scrollbar size};

background: {color:scrollbar background};

}

::-webkit-scrollbar-thumb {

background: {color:scrollbar thumb};

}

.npf_row {
    margin: 0 !important;
}

hr {

border-width: {text:posts border width};

border-style: {select:posts border style};

border-color: {color:posts border color};

}

#sidebar {

text-align: center;

position: fixed;

margin-left: -250px;

margin-top: 180px;

width: 200px;

max-height: 100%;

}

#sidebar img {

max-width: 100%;

}

.links {

background-color: {color:description background};

width: 192px;

border-width: {text:icon border width};

border-style: {select:description border style};

border-color: {color:description border color};

padding: 4px;

}

/*ALSO DON'T TOUCH YOU'LL BREAK STUFF*/

#con {

left: 50%;

margin-left: -140px;

position: absolute;

}


.post {

padding: 10px;

width: 540px;

min-width: 540px;

color: {color:posts font color};

font-family: {text:posts font family};

font-size: {text:posts font size};

background-color: {color:posts background};

border-width: {text:posts border width};

border-style: {select:posts border style};

border-color: {color:posts border color};

margin-left: 20px;

height: 300px;

max-height: 540px;

overflow-y: auto;

overflow-x: hidden;

{block:ifpostsborderblur}

-webkit-box-shadow: 0 0 5px 2px {color:posts background};
    -moz-box-shadow: 0 0 5px 2px {color:posts background};
    box-shadow: 0 0 5px 2px {color:posts background};

border: transparent;

{/block:ifpostsborderblur}

}

.pagination {

min-width: 80px;

height: auto;

padding: 10px;

margin-left: 20px;

margin-right: 20px;

text-align: center;

}

.pagenotes {

display: inline-block;

margin-left: 10px;

}

ol.notes {

overflow-y: auto;

overflow-x: hidden;

max-height: 300px;

padding: 10px;

margin-top: 0px;

list-style: none;

color: {color:posts font color};

font-family: {text:posts font family};

font-size: {text:posts font size};

background-color: {color:posts background};

border-width: {text:posts border width};

border-style: {select:posts border style};

border-color: {color:posts border color};

{block:ifpostsborderblur}

-webkit-box-shadow: 0 0 5px 2px {color:posts background};
    -moz-box-shadow: 0 0 5px 2px {color:posts background};
    box-shadow: 0 0 5px 2px {color:posts background};

border: transparent;

{/block:ifpostsborderblur}

}

/* photos and videos */

.media {

overflow: hidden;

max-width: 100%;

max-height: 100%;
}

.media img {

display: block;

margin: 0;

max-width: 100%;

max-height: 100%;

}

/* Bob */
@-webkit-keyframes hvr-bob {
  0% {
    -webkit-transform: translateY(-8px);
    transform: translateY(-8px);
  }
  50% {
    -webkit-transform: translateY(-4px);
    transform: translateY(-4px);
  }
  100% {
    -webkit-transform: translateY(-8px);
    transform: translateY(-8px);
  }
}
@keyframes hvr-bob {
  0% {
    -webkit-transform: translateY(-8px);
    transform: translateY(-8px);
  }
  50% {
    -webkit-transform: translateY(-4px);
    transform: translateY(-4px);
  }
  100% {
    -webkit-transform: translateY(-8px);
    transform: translateY(-8px);
  }
}
@-webkit-keyframes hvr-bob-float {
  100% {
    -webkit-transform: translateY(-8px);
    transform: translateY(-8px);
  }
}
@keyframes hvr-bob-float {
  100% {
    -webkit-transform: translateY(-8px);
    transform: translateY(-8px);
  }
}
.hvr-bob {

  {block:ifheadertextbob}

  -webkit-animation-name: hvr-bob-float, hvr-bob;
  animation-name: hvr-bob-float, hvr-bob;
  -webkit-animation-duration: .3s, 1.5s;
  animation-duration: .3s, 1.5s;
  -webkit-animation-delay: 0s, .3s;
  animation-delay: 0s, .3s;
  -webkit-animation-timing-function: ease-out, ease-in-out;
  animation-timing-function: ease-out, ease-in-out;
  -webkit-animation-iteration-count: 1, infinite;
  animation-iteration-count: 1, infinite;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  -webkit-animation-direction: normal, alternate;
  animation-direction: normal, alternate;

  {/block:ifheadertextbob}

  position: fixed;

  margin-top: 120px;

  min-width: 540px;

  max-width: 540px;

  overflow-wrap: anywhere;

  color: {color:header text color};

  font-family: {text:header font family};

  font-size: 50px;

  letter-spacing: 8px;

  z-index: 999;

  text-shadow: -1px -1px 0 {color:header text outline};, 1px -1px 0 {color:header text outline}, -1px 1px 0 {color:header text outline}, 1px 1px 0 {color:header text outline};

}

</style>

</head>

<body>

<div id="con">

<div id="sidebar">

<img src="{image:sidebar icon}" style="

border-width: {text:icon border width};

border-style: {select:icon border style};

border-color: {color:icon border color};

{block:ifroundiconborder}

border-radius: 15px;

{/block:ifroundiconborder}

{block:ifcircleicon}

border-radius: 50%;

{/block:ifcircleicon}">

<div class="links">
<a href="/" style="

font-size: {text:home link font size};

font-family: {text:home link font};

color: {color:home link color};">

<img src="{image:home link}">{text:home link title}</a>&nbsp;&nbsp;

<a href="/ask" style="

font-size: {text:ask link font size};

font-family: {text:ask link font};

color: {color:ask link color};"><img src="{image:ask link}">{text:ask link title}</a>&nbsp;&nbsp;<br><br>

<a href="{text:link 1 URL}" style="

font-size: {text:link 1 font size};

font-family: {text:link 1 font};

color: {color:link 1 color};">{text:link 1}<img src="{image:link 1}"></a>&nbsp;&nbsp;

<a href="{text:link 2 URL}" style="

font-size: {text:link 2 font size};

font-family: {text:link 2 font};

color: {color:link 2 color};">

{text:link 2}<img src="{image:link 2}"></a>


&nbsp;&nbsp;

<a href="{text:link 3 URL}" style="

font-size: {text:link 3 font size};

font-family: {text:link 3 font};

color: {color:link 3 color};">

{text:link 3}<img src="{image:link 3}"></a>

<hr>

<p style="margin: 0px;

font-family: {text:description font family};

font-size: {text:description font size};

color: {color:description font color};

text-align: justify;">

{text:description}

</p>

</div>

</div>

<div class="outer-wrapper">

  <div class="wrapper">

{block:Posts}

<div class="post">

{block:Quote}
<div id="titlequote">&nbsp; {Quote} &nbsp;<i class="fa fa-quote-right"></i></div>
{block:Source}<div id="source">&mdash; {Source}</div>{/block:Source}
{/block:Quote}

{block:Text}
{block:Title}
<div id="title">{Title}</div>{/block:Title}
{Body}
{/block:Text}

{block:link}
<div id="title"><a href="{URL}">&nbsp; {Name}</a></div>
{block:Description}{Description}{/block:Description}
{/block:link}

{block:Chat}
{block:Title}
<div id="title">{Title}</div>{/block:Title}
{/block:Text}
{block:lines}
{block:label}
<br><b>{label}</b>
{/block:label}
{line}
{/block:lines}
{/block:Chat}

{block:Photo}
{linkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}"/>{linkCloseTag}
{/block:Photo}

{block:Photoset}
{Photoset-500}
{/block:Photoset}

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

{block:Audio}
{block:AudioEmbed}{AudioEmbed-500}{/block:AudioEmbed}
{/block:Audio}

{block:Answer}
<div class="q">
<div class="as"> <b><big>{Asker} said:</big></b>
{Question}</div></div>
<div class="a">{Answer}</div>
{/block:Answer}

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

<!-- {block:ContentSource} {SourceURL} {/block:ContentSource} {block:RebloggedFrom} {ReblogRootURL} {ReblogParentURL} {/block:RebloggedFrom} -->

{block:Date}
<div id="permalink">
<a style="color: {color:permalink}; font-family: {text:permalink font family}; font-size: {text:permalink font size}; text-decoration: none;" href="{Permalink}" ><b>{ShortMonth} {DayOfMonthWithSuffix}</b></a>
{block:NoteCount} with <a href="{Permalink}" style="color: {color:notes}; font-family: {text:notes font family}; font-size: {text:notes font size}; text-decoration: none;">{NoteCountWithLabel}</a>{/block:NoteCount}<div style="float:right;">{block:RebloggedFrom}<a href="{ReblogParentURL}" title="{ReblogParentName}" style="color: {color:via}; font-family: {text:via font family}; font-size: {text:via font size}; text-decoration: none;">via</a>{block:ContentSource} <a href="{ReblogRootURL}" title="{ReblogRootName}" style="color: {color:source}; font-family: {text:source font family}; font-size: {text:source font size}; text-decoration: none;">source</a>{/block:ContentSource}{/block:RebloggedFrom}</div>

{block:HasTags}<div class="tags">{block:Tags}<a href="{TagUrl}" style="color: {color:tags}; font-family: {text:tags font family}; font-size: {text:tags font size}; text-decoration: none;">#{Tag}</a>&nbsp;&nbsp;{/block:Tags}</div>{/block:HasTags}

</div>

{/block:Date}

</div>

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

{/block:Posts}

<div class="pagination">
{block:Pagination}
{block:PreviousPage}
<a href="{PreviousPage}"><img src="{image:prev pagination}"></a>
{/block:PreviousPage}


{block:NextPage}
<a href="{NextPage}"><img src="{image:next pagination}"></a>
{/block:NextPage}
{/block:Pagination}
</div>

</div>

</div>

<div class="hvr-bob">

<marquee scrolldelay="90">

{text:header text}

</marquee>

</div>

</div>

</div>

<div id="credit">

                        <a href="https://cod.tumblr.com/" target="_blank" title="CODED BY JOYBOY">🦩</a>

                    </div>

</body></html>