outrageous theme

<!DOCTYPE html>
<head>

<!-----

outrageous theme by poisons! base code by animecharacter
feel free to change around while using, but dont steal!
shoot me an ask if theres any bugs! this is my third theme

----->

<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
{block:Description}
<meta name="description" content="{MetaDescription}" />
{/block:Description}

<meta name="image:sidebar img" content="" />
<meta name="image:bg image" content="" />
<meta name="image:favicon" content="" />

<meta name="text:font" content="arial" />
<meta name="text:font size" content="17" />
<meta name="text:sidebar margin left" content="-150" />
<meta name="text:sidebar margin top" content="100" />
<meta name="text:sidebar width" content="170" />
<meta name="text:sidebar img size" content="150" />
<meta name="text:link 1" content="" />
<meta name="text:link 1 url" content="" />
<meta name="text:link 2" content="" />
<meta name="text:link 2 url" content="" />
<meta name="text:link 3" content="" />
<meta name="text:link 3 url" content="" />
<meta name="text:dropdown title" content="" />
<meta name="text:permalink divider" content=""/>

<meta name="color:bg" content="#fff" />
<meta name="color:text" content="#fff" />
<meta name="color:link" content="#fff" />
<meta name="color:link hover" content="#fff" />
<meta name="color:highlight" content="#fff" />
<meta name="color:cursor sparkles" content="fff"/>
<meta name="color:blockquote" content="fff"/>
<meta name="color:tooltip bg" content="#fff" />
<meta name="color:tooltip text" content="#fff" />
<meta name="color:scrollbar" content="fff" />
<meta name="color:scrollbar thumb" content="fff"/>

<meta name="if:DropdownLinks" content="2">
<meta name="if:cursor sparkles" content="" />
<meta name="if:rainbow links" content="" />

<title>{Title}</title>

<link rel="shortcut icon" href="{favicon}">
<link rel="alternate" type="application/rss+xml" href="{RSS}">
<link rel="stylesheet" href="http://static.tumblr.com/qxrkgx6/RWPmgn2qa/normalize.min.css">

<script src="http://static.tumblr.com/qxrkgx6/LuRmgn2rm/modernizr-2.6.2.min.js"></script>

<style type="text/css">


/*
general text styles, fonts and colours
*/


body {
margin:0px;
background: {color:bg} url({image:bg image});
font-family: {text:font};
font-size: {text:font size}px;
line-height:140%;
color: #000;
}

p{
margin:0 0 10px 0;
padding:0;
}

pre {
white-space: pre-wrap;
white-space: -moz-pre-wrap;
white-space: -pre-wrap;
white-space: -o-pre-wrap;
word-wrap: break-word;
}

a{
color:{color:link};
}

a:hover{
color:{color:link hover};
}

li{
margin-left:-15px;
}

/*
containers etc
*/
#wrapper{
width:600px;
margin:50px auto;
}

#sidebar{
width:{text:sidebar width}px;
position:fixed;
text-align:center;
margin-top:{text:sidebar margin top}px;
margin-left:{text:sidebar margin left}px;
}

#sidebar img{
width:{text:sidebar img size}px;
margin-top:10px;
}

#content{
width:400px;
margin-left:200px;
overflow:hidden;
}

.post{
width:400px;
margin:0 0 50px 0;
overflow:hidden;
}

#sidebar img, .post img{
max-width:100%;
}

#nav{
margin:50px 0 0 0;
}

/*
content in the body of the posts - quotes, asks, etc
"media" contains photos, photosets, videos, audio posts
*/
.media{
margin:0 0 10px 0;
}

.title{
font-weight:normal;
font-size:18px;
margin:0 0 10px 0;
}

.quote{
font-weight:normal;
font-size:16px;
font-style:italic;
margin:0 0 10px 0;
}

.question{
margin-bottom:10px;
}

blockquote{
margin:0 0 10px 10px;
padding:0 0 0 10px;
border-left:solid 1px {color:blockquote};
}

#credit{
padding:10px;
width:15px;
height:15px;
position:fixed;
border-radius:100%;
bottom:5px;
left:3px;
font-size:18px;
}

::-webkit-scrollbar {
width: 10px;
background: {color:scrollbar};
border: px solid #000;
}

::-webkit-scrollbar-thumb {
background: {color:scrollbar thumb};
border: px solid #000;
}

/*
post footers - date, tags, via and source
*/
.post .footer{
margin:0;
text-align:left;
}

/*
post notes
*/
ol.notes{
list-style-type:none;
padding:0;
margin:0;
}

ol.notes li.note img{
width:16px;
height:16px;
}

ol.notes li.note{
margin:0px;
}

{CustomCSS}
</style>

{block:ifcursorsparkles}
<script type="text/javascript">
// <![CDATA[
var colour="{color:cursor sparkles}";
var sparkles=120;

/****************************
*  Tinkerbell Magic Sparkle *
* (c) 2005 mf2fm web-design *
*  http://www.mf2fm.com/rv  *
* DON'T EDIT BELOW THIS BOX *
****************************/
var x=ox=400;
var y=oy=300;
var swide=800;
var shigh=600;
var sleft=sdown=0;
var tiny=new Array();
var star=new Array();
var starv=new Array();
var starx=new Array();
var stary=new Array();
var tinyx=new Array();
var tinyy=new Array();
var tinyv=new Array();

window.onload=function() { if (document.getElementById) {
  var i, rats, rlef, rdow;
  for (var i=0; i<sparkles; i++) {
    var rats=createDiv(3, 3);
    rats.style.visibility="hidden";
    document.body.appendChild(tiny[i]=rats);
    starv[i]=0;
    tinyv[i]=0;
    var rats=createDiv(5, 5);
    rats.style.backgroundColor="transparent";
    rats.style.visibility="hidden";
    var rlef=createDiv(1, 5);
    var rdow=createDiv(5, 1);
    rats.appendChild(rlef);
    rats.appendChild(rdow);
    rlef.style.top="2px";
    rlef.style.left="0px";
    rdow.style.top="0px";
    rdow.style.left="2px";
    document.body.appendChild(star[i]=rats);
  }
  set_width();
  sparkle();
}}

function sparkle() {
  var c;
  if (x!=ox || y!=oy) {
    ox=x;
    oy=y;
    for (c=0; c<sparkles; c++) if (!starv[c]) {
      star[c].style.left=(starx[c]=x)+"px";
      star[c].style.top=(stary[c]=y)+"px";
      star[c].style.clip="rect(0px, 5px, 5px, 0px)";
      star[c].style.visibility="visible";
      starv[c]=50;
      break;
    }
  }
  for (c=0; c<sparkles; c++) {
    if (starv[c]) update_star(c);
    if (tinyv[c]) update_tiny(c);
  }
  setTimeout("sparkle()", 40);
}

function update_star(i) {
  if (--starv[i]==25) star[i].style.clip="rect(1px, 4px, 4px, 1px)";
  if (starv[i]) {
    stary[i]+=1+Math.random()*3;
    if (stary[i]<shigh+sdown) {
      star[i].style.top=stary[i]+"px";
      starx[i]+=(i%5-2)/5;
      star[i].style.left=starx[i]+"px";
    }
    else {
      star[i].style.visibility="hidden";
      starv[i]=0;
      return;
    }
  }
  else {
    tinyv[i]=50;
    tiny[i].style.top=(tinyy[i]=stary[i])+"px";
    tiny[i].style.left=(tinyx[i]=starx[i])+"px";
    tiny[i].style.width="2px";
    tiny[i].style.height="2px";
    star[i].style.visibility="hidden";
    tiny[i].style.visibility="visible"
  }
}

function update_tiny(i) {
  if (--tinyv[i]==25) {
    tiny[i].style.width="1px";
    tiny[i].style.height="1px";
  }
  if (tinyv[i]) {
    tinyy[i]+=1+Math.random()*3;
    if (tinyy[i]<shigh+sdown) {
      tiny[i].style.top=tinyy[i]+"px";
      tinyx[i]+=(i%5-2)/5;
      tiny[i].style.left=tinyx[i]+"px";
    }
    else {
      tiny[i].style.visibility="hidden";
      tinyv[i]=0;
      return;
    }
  }
  else tiny[i].style.visibility="hidden";
}

document.onmousemove=mouse;
function mouse(e) {
  set_scroll();
  y=(e)?e.pageY:event.y+sdown;
  x=(e)?e.pageX:event.x+sleft;
}

function set_scroll() {
  if (typeof(self.pageYOffset)=="number") {
    sdown=self.pageYOffset;
    sleft=self.pageXOffset;
  }
  else if (document.body.scrollTop || document.body.scrollLeft) {
    sdown=document.body.scrollTop;
    sleft=document.body.scrollLeft;
  }
  else if (document.documentElement && (document.documentElement.scrollTop || document.documentElement.scrollLeft)) {
    sleft=document.documentElement.scrollLeft;
    sdown=document.documentElement.scrollTop;
  }
  else {
    sdown=0;
    sleft=0;
  }
}

window.onresize=set_width;
function set_width() {
  if (typeof(self.innerWidth)=="number") {
    swide=self.innerWidth;
    shigh=self.innerHeight;
  }
  else if (document.documentElement && document.documentElement.clientWidth) {
    swide=document.documentElement.clientWidth;
    shigh=document.documentElement.clientHeight;
  }
  else if (document.body.clientWidth) {
    swide=document.body.clientWidth;
    shigh=document.body.clientHeight;
  }
}

function createDiv(height, width) {
  var div=document.createElement("div");
  div.style.position="absolute";
  div.style.height=height+"px";
  div.style.width=width+"px";
  div.style.overflow="hidden";
  div.style.backgroundColor=colour;
  return (div);
}
// ]]>
</script>
{/block:ifcursorsparkles}

{block:ifrainbowlinks}
<script type='text/javascript'>
//<![CDATA[
var rate = 50;
if (document.getElementById)
window.onerror=new Function("return true")

var objActive; // The object which event occured in
var act = 0; // Flag during the action
var elmH = 0; // Hue
var elmS = 128; // Saturation
var elmV = 255; // Value
var clrOrg; // A color before the change
var TimerID; // Timer ID
if (document.all) {
document.onmouseover = doRainbowAnchor;
document.onmouseout = stopRainbowAnchor;
}
else if (document.getElementById) {
document.captureEvents(Event.MOUSEOVER | Event.MOUSEOUT);
document.onmouseover = Mozilla_doRainbowAnchor;
document.onmouseout = Mozilla_stopRainbowAnchor;
}
function doRainbow(obj)
{
if (act == 0) {
act = 1;
if (obj)
objActive = obj;
else
objActive = event.srcElement;
clrOrg = objActive.style.color;
TimerID = setInterval("ChangeColor()",100);
}
}
function stopRainbow()
{
if (act) {
objActive.style.color = clrOrg;
clearInterval(TimerID);
act = 0;
}
}
function doRainbowAnchor()
{
if (act == 0) {
var obj = event.srcElement;
while (obj.tagName != 'A' && obj.tagName != 'BODY') {
obj = obj.parentElement;
if (obj.tagName == 'A' || obj.tagName == 'BODY')
break;
}
if (obj.tagName == 'A' && obj.href != '') {
objActive = obj;
act = 1;
clrOrg = objActive.style.color;
TimerID = setInterval("ChangeColor()",100);
}
}
}
function stopRainbowAnchor()
{
if (act) {
if (objActive.tagName == 'A') {
objActive.style.color = clrOrg;
clearInterval(TimerID);
act = 0;
}
}
}
function Mozilla_doRainbowAnchor(e)
{
if (act == 0) {
obj = e.target;
while (obj.nodeName != 'A' && obj.nodeName != 'BODY') {
obj = obj.parentNode;
if (obj.nodeName == 'A' || obj.nodeName == 'BODY')
break;
}
if (obj.nodeName == 'A' && obj.href != '') {
objActive = obj;
act = 1;
clrOrg = obj.style.color;
TimerID = setInterval("ChangeColor()",100);
}
}
}
function Mozilla_stopRainbowAnchor(e)
{
if (act) {
if (objActive.nodeName == 'A') {
objActive.style.color = clrOrg;
clearInterval(TimerID);
act = 0;
}
}
}
function ChangeColor()
{
objActive.style.color = makeColor();
}
function makeColor()
{
// Don't you think Color Gamut to look like Rainbow?
// HSVtoRGB
if (elmS == 0) {
elmR = elmV; elmG = elmV; elmB = elmV;
}
else {
t1 = elmV;
t2 = (255 - elmS) * elmV / 255;
t3 = elmH % 60;
t3 = (t1 - t2) * t3 / 60;
if (elmH < 60) {
elmR = t1; elmB = t2; elmG = t2 + t3;
}
else if (elmH < 120) {
elmG = t1; elmB = t2; elmR = t1 - t3;
}
else if (elmH < 180) {
elmG = t1; elmR = t2; elmB = t2 + t3;
}
else if (elmH < 240) {
elmB = t1; elmR = t2; elmG = t1 - t3;
}
else if (elmH < 300) {
elmB = t1; elmG = t2; elmR = t2 + t3;
}
else if (elmH < 360) {
elmR = t1; elmG = t2; elmB = t1 - t3;
}
else {
elmR = 0; elmG = 0; elmB = 0;
}
}
elmR = Math.floor(elmR).toString(16);
elmG = Math.floor(elmG).toString(16);
elmB = Math.floor(elmB).toString(16);
if (elmR.length == 1) elmR = "0" + elmR;
if (elmG.length == 1) elmG = "0" + elmG;
if (elmB.length == 1) elmB = "0" + elmB
elmH = elmH + rate;
if (elmH >= 360)
elmH = 0;
return '#' + elmR + elmG + elmB;
}
//]]>
</script>
{/block:ifrainbowlinks}

</head>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script><script src="https://static.tumblr.com/rtrqcib/VGGnlh8rf/jquery.style-my-tooltips.min.js"></script><script>(function($){$(document).ready(function(){$("a[title]").style_my_tooltips({tip_follows_cursor:true,tip_delay_time:0,tip_fade_speed:0,attribute:"title"});});})(jQuery);</script>

<style>
.tooltip{
display: inline;
position: relative;}

#s-m-t-tooltip {
text-align:center;
max-width:200px;
padding:2px;
margin:15px;
background-color:{color:tooltip bg};
color:{color:tooltip text};
font-size:17px;
letter-spacing:1px;
border-radius:0px;
word-wrap:break-word;
z-index:999999999999999999999999999999999999;
}
</style>

<body>

<div id="wrapper">

<div id="sidebar">
<img src="{image:sidebar img}" style="max-width:{text:sidebar img size}px;position:inline;border-radius:5px;{block:roundedsidebarimg}border-radius:{text:sidebar img size}px;{/block:roundedsidebarimg}"></a>
{block:Description}
<p>{Description}</p>
{/block:Description}

{block:ifDropdownLinks}<p>
<div align="center">
<select style="padding:2px;font-family: {text: font}; color:{color: text}; border: 1px solid {color: text}" onchange='location=this.options[this.selectedIndex].value;'>

<option>{text:Dropdown Title}</option><p>
<option value="">{text:link 1}</option><p>
<option value="">{text:link 2}</option><p>
<option value="">{text:link 3}</option><p>
</div>
</select><br><br>

</div>

{/block:ifDropdownLinks}

{block:AskEnabled}
<a href="/ask">{AskLabel}</a><br>
{/block:AskEnabled}
{block:SubmissionsEnabled}
<a href="/ask">{SubmitLabel}</a><br>
{/block:SubmissionsEnabled}
{block:HasPages}
{block:Pages}
<a href="{URL}">{Label}</a><br>
{/block:Pages}
{/block:HasPages}
</div>



<div id="content">
{block:Posts}

<div class="post">

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

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

{block:Photoset}
<div class="media">{Photoset-400}</div>
{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
{/block:Photoset}

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

{block:Link}
<div class="title"><a href="{URL}">{Name}</a></div>
{block:Description}
<div class="description">{Description}</div>
{/block:Description}
{/block:Link}

{block:Chat}
{block:Title}
<div class="title">{Title}</div>
{/block:Title}

{block:Lines}
<div class="{Alt} user_{UserNumber}">
{block:Label}
<b>{Label}</b>{/block:Label}
&nbsp;{Line}
</div>
{/block:Lines}
{/block:Chat}

{block:Video}
<div class="media">{Video-400}</div>
{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
{/block:Video}

{block:Audio}
<div class="media">
{block:AlbumArt}<img src="{AlbumArtURL}">{/block:AlbumArt}
{AudioPlayerWhite}
{block:TrackName}{TrackName}<br>{/block:TrackName}
{block:Artist}{Artist}<br>{/block:Artist}
{block:Album}{Album}{/block:Album}
</div>
{block:Caption}{Caption}{/block:Caption}
{/block:Audio}

{block:Answer}
<div class="question">{Asker}: {Question}</div>
<div class="caption">{Answer}</div>
{/block:Answer}

<div id="info">
<center><br>
{block:RebloggedFrom}<a href="{ReblogParentURL}">via</a>{/block:RebloggedFrom}
{text:permalink divider} {block:ContentSource}<a href="{SourceURL}">src</a>{/block:ContentSource}</p></center>
</div>

{block:HasTags}<br>{block:Tags}<a href="{TagURL}">{Tag}</a> {/block:Tags}{/block:HasTags}

{block:PermalinkPage}
{block:NoteCount}
{block:PostNotes}{PostNotes}{/block:PostNotes}
{/block:NoteCount}
{/block:PermalinkPage}
{/block:Date}

</div>
{/block:Posts}

{block:Pagination}
<div id="nav">
{block:PreviousPage}<a href="{PreviousPage}">⇐</a>{/block:PreviousPage}

{block:NextPage}<a href="{NextPage}">⇒</a>{/block:NextPage}
</div>
{/block:Pagination}
</div>
</div>

<div id="credit">
<a title="theme by ophie!" href="http://poisons.tumblr.com"><img src="http://78.media.tumblr.com/291c11b399ac42436dc6522e5b79bf00/tumblr_inline_nk96q6n65S1ry72eo.gif"></a>
</div>

</div>

        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
        <script>window.jQuery || document.write('<script src="http://static.tumblr.com/qxrkgx6/q6kmgn2w2/jquery-1.8.3.min.js"><\/script>')</script>

    </body>
</html>