Catastrophe Theme

<!--

Theme Catastrophe by Dayse (m-orbide.tumblr.com).

Please, DON'T REMOVE THE CREDITS, RESPECT THIS SIMPLE RULE! I spent a lot of time to do these themes.

-->

<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js" type="text/javascript"><!--mce:0--></script>
<script src="toggle.js" type="text/javascript"><!--mce:1--></script>
<script type="text/javascript">
$(document).ready(function(){
$(".description").hide();
$(".about").click(function(){
$('.description').slideToggle("fast");
return true;
});
});
</script>

<meta name="color:Background" content="#fff" />
<meta name="color:Text" content="#000" />
<meta name="color:Hover" content="#FFFFFF" />
<meta name="color:Post" content="#eeeeee" />
<meta name="color:Links" content="#000">
<meta name="color:Scrollbar" content="#000">
<meta name="color:Text Shadow" content="#000000"/>


<meta name="if:Show Blog Title" content="1"/>
<meta name="if:Use Banner" content="0">
<meta name="if:Reblog Link On Hover" content="1"/>
<meta name="if:Ask Link" content="1"/>
<meta name="if:Underlined Links" content="1"/>
<meta name="if:Top Buttom" content="1"/>
<meta name="if:Right Notes" content="0"/>
<meta name="if:Left Notes" content="0"/>
<meta name="if:Center Notes" content="1"/>
<meta name="if:Shadow" content="1"/>
<meta name="if:Shadow White" content="0"/>
<meta name="if:Shadow Black" content="1"/>

<meta name="image:Background" content=""/>
<meta name="image:Banner" content="">

<meta name="font:Body" content="Arial"/>

<meta name="text:Body font size" content="12"/>
<meta name="text:Ask Link Text" content="message"/>
<meta name="text:Custom Link One" content="" />
<meta name="text:Custom Link One Title" content="" />
<meta name="text:Custom Link Two" content="" />
<meta name="text:Custom Link Two Title" content="" />
<meta name="text:Custom Link Three" content="" />
<meta name="text:Custom Link Three Title" content="" />
<meta name="text:Custom Link Four" content="" />
<meta name="text:Custom Link Four Title" content="" />
<meta name="text:Custom Link Five" content="" />
<meta name="text:Custom Link Five Title" content="" />
<meta name="text:Custom Link Six" content="" />
<meta name="text:Custom Link Six Title" content="" />


<title>{Title}</title>
<link rel="shortcut icon" href="{Favicon}">
<link rel="alternate" type="application/rss+xml" href="{RSS}">
<link rel="shortcut icon" href="{Favicon}">
<title>Untitled Document</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}

<style type="text/css">

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

#tumblr_controls{
top: 1px !important;
margin: 0 0 0 0;
right: 0px !important;
position: fixed !important;}

body{
color:{color:Text};
background-color:{color:Background};
background-image:url({image:Background});
font-size:{text:Body font size}px;
text-align:justify;
font-family:{font:body};
line-height:15px;}

::-webkit-scrollbar{width:10px;
height:8px;}
::-webkit-scrollbar-button:start:decrement
::-webkit-scrollbar-button:end:increment{display:block;
height:0;
background-color:transparent;}
::-webkit-scrollbar-track-piece{background-color:{color:background};
-webkit-border-radius:0;
-webkit-border-bottom-right-radius:3px;
-webkit-border-bottom-left-radius:3px;}
::-webkit-scrollbar-thumb:vertical{height:50px;
background-color:{color:Scrollbar};}
::-webkit-scrollbar-thumb:horizontal{width:50px;
background-color:{color:Scrollbar};}

#content{
margin: auto auto auto 106px ;
width:90%;
top:0px;

position:auto;
}

#content .posts{
width:1100px;
margin:auto;
height:auto;
{block:PermalinkPage}
width:530px;
margin-right:1060
{/block:PermalinkPage}
}

#content .entry{
{block:IndexPage}
width:500px;
height:auto;
float:left;
margin:5px;
padding:2px;
{block:ifShadow}
{block:ifShadowWhite}
box-shadow: 0px 0px 5px #FFFFFF;
{/block:ifShadowWhite}
{block:ifShadowBlack}
box-shadow: 0px 0px 5px #000000;
{/block:ifShadowBlack}
{/block:ifShadow}
{/block:IndexPage}
{block:PermalinkPage}
width:500px;
{/block:PermalinkPage}
}

#content .entry img{
{block:IndexPage}
max-width:500px;
height:auto;
float:left;
{/block:IndexPage}
}


.header{
width:1250px;
text-align:center;
margin: 20px auto;
z-index:9999;
margin-bottom:10px;
}


a:link, a:active, a:visited{
text-decoration:none;
display: navigate;
font-family:{font:body};
padding:0px;
color:{color:Links};
}

a:hover{
color:{color:Hover};
{block:ifnotUnderlinedLinks}text-decoration:none;{block:ifnotUnderlinedLinks}
{block:ifUnderlinedLinks}text-decoration:underline;{/block:ifUnderlinedLinks}
text-shadow:0px 0px 10px {color:Text Shadow};
}



{block:ifReblogLinkOnHover}
.like_and_reblog_buttons {
list-style: none;
position:absolute;
left:20px;
opacity:0;
-webkit-transition: 0.2s;
-webkit-transition: 0.2s;
-moz-transition: 0.2s;
transition: 0.2s;}

.entry:hover .like_and_reblog_buttons{
opacity:0.9;
-webkit-transition: 0.2s;
-webkit-transition: 0.2s;
-moz-transition: 0.2s;
transition: 0.2s;}

.like_and_reblog_buttons li{
float: left;
margin: 0 0 0 -15px;
padding: 5px;}

.like_and_reblog_buttons li:first-child {
margin-left:-40px;}

{/block:ifReblogLinkOnHover}

.fold {margin-left:8px;
border-color:{color:Background} #ccc #ccc {color:Background};
z-index:1000;
border-style:solid;
border-width:0px; width:0; height:0; opacity:0;
-moz-transition:0.3s ease-in; -webkit-transition:0.3s ease-in; -o-transition:0.3s ease-in; transition:0.3s ease-in;
}

div#entry:hover .fold {opacity:1; border-width:8px;}

}

.post_title{
font-family:{font:body};
display:block;
font-size:{text:Post Title font size}px;
line-height:20px;
}

.link_title{
font-size:{text:Post Title font size}px;
line-height:20px;
font-family:{font:body};
margin-bottom:5px;
}

.top{
text-align:center;
margin-top:2px;
margin-bottom:5px;
}

.nav{
display: navigate;
font-size:{text:Body Font Size}px;
font-family:{font:body};
text-transform:uppercase;
padding:5px;
color:{color:text};
text-decoration:none;
}


.nav a:hover{
display: navigate;
font-size:{text:Body Font Size}px;
font-family:{font:body};
text-transform:Italic;
padding:5px;
color:{color:Hover};
{block:ifnotUnderlinedLinks}text-decoration:none;{block:ifnotUnderlinedLinks}
{block:ifUnderlinedLinks}text-decoration:underline;{/block:ifUnderlinedLinks}}

.title{
font-family:{font:Body};
font-size:{text:Title font size}px;
color:{color:Title};
padding-bottom:20px;
}

h1{
color:{color:Text};
padding-bottom:0px;
font-weight: normal;
font-size:35px;
text-transform: none;
font-family: 'Georgia', cursive ;
line-height: -4px;
{block:ifusebanner}display:none;{/block:ifusebanner}
}

h1a {
color:{color:Text};
}

.permalink{
text-transform:none;
{block:ifLeftNotes}text-align:left;{/block:ifLeftNotes}
{block:ifRightNotes}text-align:right;{/block:ifRightNotes}
{block:ifCenterNotes}text-align:center;{/block:ifCenterNotes}
color:{color:Links};
position: relative;
margin-top: -10px;
font-size: 9px;
opacity: 0;
filter: alpha(opacity = 0);
-moz-transition: all 0.4s;
-webkit-transition: all 0.4s;
-o-transition: all 0.4s;
transition: all 0.4;
}

div#entry:hover .permalink{
margin-top: -5px;
opacity: 1;
filter: alpha(opacity = 100);
-moz-transition: all 0.4s;
-webkit-transition: all 0.4s;
-o-transition: all 0.4s;
transition: all 0.4;
}

.quote{
font-size:{text:Body font size}px;
line-height:20px;
text-transform:none;
margin-bottom:5px;
font-family:{font:body title};
}

.photoset{
margin-bottom:1px;
float:height;
}

.audio{
{block:IndexPage}
{block:ifTwoColumns}width:397px;{/block:ifTwoColumns}
{block:ifThreeColumns}width:349px;{/block:ifThreeColumns}
{/block:IndexPage}
{block:PermalinkPage}
width:488px;
{/block:PermalinkPage}
background-color:#000;
padding:1px;
margin-bottom:4px;
border-color:{color:Post};
}


.audiocap, .videocap{
background-color:{color:Post};
display:block;
padding:10px;
}

div.video embed,
div.post div.video object {
{block:IndexPage}
width:250px !important;
height:150px !important;
height:auto;
float:left;
{/block:IndexPage}
{block:PermalinkPage}
width:500px !important;
height:400px !important;
{/block:PermalinkPage}
}

.message{
font-weight:normal;
margin-bottom:5px;
font-size:9px;
line-height:15px;
display:block;
text-transform:lowercase;
}

.caption{
margin-top:5px;
margin-bottom:5px;
}

</style>

{block:ifTopButtom}
<script>
//** jQuery Scroll to Top Control script- (c) I made this script myself (Kyle Monk) and it is hosted on my personal site so would appreciate if you followed my blog at kylemonk.tumblr.com if you use it or for details on how to change the location.
//** Graphic originally from tumbler dashboard, for details on how to change graphic colour, contact me at kylemonk.tumblr.com
//** v1.1 (April 7th, 10'):
//** 1) Adds ability to scroll to an absolute position (from top of page) or specific element on the page instead.
//** 2) Fixes scroll animation not working in Opera.
var scrolltotop={
//startline: Integer. Number of pixels from top of doc scrollbar is scrolled before showing control
//scrollto: Keyword (Integer, or "Scroll_to_Element_ID"). How far to scroll document up when control is clicked on (0=top).
setting: {startline:100, scrollto: 0, scrollduration:1000, fadeduration:[500, 100]},
controlHTML: '<img src="http://static.tumblr.com/i8axhtw/hBmma2nol/topbuttom.png" style="filter:alpha(opacity=70); -moz-opacity:0.7;"/>', //HTML for control, which is auto wrapped in DIV w/ ID="topcontrol"
controlattrs: {offsetx:35, offsety:60}, //offset of control relative to right/ bottom of window corner
anchorkeyword: '#top', //Enter href value of HTML anchors on the page that should also act as "Scroll Up" links
state: {isvisible:false, shouldvisible:false},
scrollup:function(){
if (!this.cssfixedsupport) //if control is positioned using JavaScript
this.$control.css({opacity:0}) //hide control immediately after clicking it
var dest=isNaN(this.setting.scrollto)? this.setting.scrollto : parseInt(this.setting.scrollto)
if (typeof dest=="string" && jQuery('#'+dest).length==1) //check element set by string exists
dest=jQuery('#'+dest).offset().top
else
dest=0
this.$body.animate({scrollTop: dest}, this.setting.scrollduration);
},
keepfixed:function(){
var $window=jQuery(window)
var controlx=$window.scrollLeft() + $window.width() - this.$control.width() - this.controlattrs.offsetx
var controly=$window.scrollTop() + $window.height() - this.$control.height() - this.controlattrs.offsety
this.$control.css({left:controlx+'px', top:controly+'px'})

},

togglecontrol:function(){
var scrolltop=jQuery(window).scrollTop()
if (!this.cssfixedsupport)
this.keepfixed()
this.state.shouldvisible=(scrolltop>=this.setting.startline)? true : false
if (this.state.shouldvisible && !this.state.isvisible){
this.$control.stop().animate({opacity:1}, this.setting.fadeduration[0])
this.state.isvisible=true
}
else if (this.state.shouldvisible==false && this.state.isvisible){
this.$control.stop().animate({opacity:0}, this.setting.fadeduration[1])
this.state.isvisible=false
}

},
init:function(){
jQuery(document).ready(function($){
var mainobj=scrolltotop
var iebrws=document.all

mainobj.cssfixedsupport=!iebrws || iebrws && document.compatMode=="CSS1Compat" && window.XMLHttpRequest //not IE or IE7+ browsers in standards mode
mainobj.$body=(window.opera)? (document.compatMode=="CSS1Compat"? $('html') : $('body')) : $('html,body')
mainobj.$control=$('<div id="topcontrol">'+mainobj.controlHTML+'</div>')
.css({position:mainobj.cssfixedsupport? 'fixed' : 'absolute', bottom:mainobj.controlattrs.offsety, right:mainobj.controlattrs.offsetx, opacity:0, cursor:'pointer'})
.attr({title:'Scroll To Top'})
.click(function(){mainobj.scrollup(); return false})
.appendTo('body')

if (document.all && !window.XMLHttpRequest && mainobj.$control.text()!='') //loose check for IE6 and below, plus whether control contains any text
mainobj.$control.css({width:mainobj.$control.width()}) //IE6- seems to require an explicit width on a DIV containing text
mainobj.togglecontrol()

$('a[href="' + mainobj.anchorkeyword +'"]').click(function(){
mainobj.scrollup()

return false
})

$(window).bind('scroll resize', function(e){

mainobj.togglecontrol()

})

})

}

}

scrolltotop.init()
</script>
{/block:ifTopButtom}

<script type="text/javascript" src="http://static.tumblr.com/imovwvl/dJWl20ley/jqueryformasonry.js"></script>
<script type="text/javascript" src="http://static.tumblr.com/imovwvl/rSGl20lfv/masonry.js">
</script>
<script src="http://static.tumblr.com/df28qmy/SHUlh3i7s/jquery.infinitescroll.js"></script>
<script src="http://static.tumblr.com/thpaaos/lLwkowcqm/jquery.masonry.js"></script>
<script type="text/javascript">

$(window).load(function () {
$('.posts').masonry(),
$('.masonryWrap').infinitescroll({
navSelector : "div#navigation",
// selector for the paged navigation (it will be hidden)
nextSelector : "div#navigation a#nextPage",
// selector for the NEXT link (to page 2)
itemSelector : ".entry",
// selector for all items you'll retrieve
bufferPx : 10000,
extraScrollPx: 11000,
loadingImg : "",
loadingText : "<em></em>",
},
// call masonry as a callback.
function() { $('.posts').masonry({ appendedContent: $(this) }); }
);
});
</script>

    </head>

<body>
<div class="top">
<div class="header">

<div style="text-align: center;">{block:ifusebanner}<img style="max-width:1500px; max-height:350px; margin-bottom:25px;" src="{image:banner}"/>{/block:ifusebanner}<h1 class="bebas"><a href="/">{block:ifshowblogtitle}{Title}{/block:ifshowblogtitle}</a></h1></div>


<center>{Description}</center>

<div class="nav">

<a href="/" >home</a>&nbsp;
{block:ifAskLink}<a href="/ask" >{text:Ask Link Text}</a>&nbsp;
{/block:ifAskLink}
{block:ifCustomLinkOneTitle}<a href="{text:Custom Link One}" >{text:Custom Link One Title}</a> &nbsp;{/block:ifCustomLinkOneTitle}

{block:ifCustomLinkTwoTitle}<a href="{text:Custom Link Two}" >{text:Custom Link Two Title}</a>&nbsp;&nbsp;{/block:ifCustomLinkTwoTitle}

{block:ifCustomLinkThreeTitle}<a href="{text:Custom Link Three}" >{text:Custom Link Three Title}</a>&nbsp;&nbsp;{/block:ifCustomLinkThreeTitle}

{block:ifCustomLinkFourTitle}<a href="{text:Custom Link Four}" >{text:Custom Link Four Title}</a>&nbsp;&nbsp;{/block:ifCustomLinkFourTitle}

{block:ifCustomLinkFiveTitle}<a href="{text:Custom Link Five}" >{text:Custom Link Five Title}</a>&nbsp;&nbsp;{/block:ifCustomLinkFiveTitle}

{block:ifCustomLinkSixTitle}<a href="{text:Custom Link Six}" >{text:Custom Link Six Title}</a>&nbsp;&nbsp;{/block:ifCustomLinkSixTitle}


<a href="http://m-orbide.tumblr.com/" >theme</a>&nbsp;&nbsp;
</div>
</div>
</div>



<div id="content">

<div class="posts">

{block:Posts}

<div class="entry">

{block:Text}<div id="entry"><div style="background-color:{color:Post};">
<div style="padding-top:15px; padding-bottom:10px; padding-left:10px; padding-right:10px;">
{block:Title}<span class="post_title">{Title}</span>{/block:Title}
{Body}
{block:IndexPage}<br><div class="permalink"><a href="{Permalink}">{NoteCountWithLabel} &nbsp; <a href="{ReblogURL}" target="_blank">reblog</a></a></div>{/block:IndexPage}</div></div></div>
{/block:Text}

{block:Photo}
{block:ifNotReblogLinkOnHover}<div id="entry">
{block:indexpage}<div style="position:absolute; margin-left:-9PX;"><a href="{ReblogURL}" target="_blank"title="reblog"><div class="fold"></div></a></div>{/block:indexpage}{/block:ifNotReblogLinkOnHover}
{block:IndexPage}{block:ifReblogLinkOnHover}<ul class="like_and_reblog_buttons">
<li>{ReblogButton color="white" size="15"}</li>
<li>{LikeButton color="white" size="15"}</li>
</ul>{/block:IndexPage}
{/block:ifReblogLinkOnHover}
{LinkOpenTag}<a href="{Permalink}"><img src="{PhotoUrl-500}" width="500"></a>{LinkCloseTag}{/block:IndexPage}
{block:PermalinkPage}
{block:Caption}{Caption}{/block:Caption}{/block:PermalinkPage}
{block:ifNotReblogLinkOnHover}</div>{/block:ifNotReblogLinkOnHover}
{/block:Photo}

{block:Photoset}
<div id="entry">
<div class="photoset">
{block:IndexPage}{Photoset-500}{/block:IndexPage}
{block:PermalinkPage}{Photoset-500}{/block:PermalinkPage}
{block:IndexPage}<div class="permalink"><a href="{Permalink}">{NoteCountWithLabel} &nbsp; <a href="{ReblogURL}" target="_blank">reblog</a></a></div>{/block:IndexPage}
</div></div>
{/block:Photoset}

{block:Quote}<div id="entry"><div style="background-color:{color:Post};">
<div style="padding-top:15px; padding-bottom:10px; padding-left:10px; padding-right:10px;">
<div class="quote">" {Quote} " </div>
{block:IndexPage}<div class="permalink"><a href="{Permalink}">{NoteCountWithLabel} &nbsp; <a href="{ReblogURL}" target="_blank">reblog</a></a> </div>{/block:IndexPage}</div></div></div>
{/block:Quote}

{block:Link}<div id="entry"><div style="background-color:{color:Post};">
<div style="padding-top:15px; padding-bottom:10px; padding-left:10px; padding-right:10px;">
<a href="{URL}"{Target}><span class="link_title">&rarr; {Name}</span></a>
{block:Description}{Description}{/block:Description}
{block:IndexPage}<br><div class="permalink"><a href="{Permalink}">{NoteCountWithLabel} &nbsp; <a href="{ReblogURL}" target="_blank">reblog</a></a></div>{/block:IndexPage}</div></div></div>
{/block:Link}

{block:Video}<div id="entry">
<div class="video">
{block:IndexPage}{Video-500}{/block:IndexPage}
{block:IndexPage}<div class="permalink"><a href="{Permalink}">{NoteCountWithLabel} &nbsp; <a href="{ReblogURL}" target="_blank">reblog</a></a> </div>{/block:IndexPage}</div>
{block:PermalinkPage}{Video-500}{/block:PermalinkPage}
</div>

{block:PermalinkPage}{block:Caption}<div class="videocap">{Caption}</div>{/block:Caption}{/block:PermalinkPage}
{/block:Video}

{block:Chat}<div id="entry"><div style="background-color:{color:Post};">
<div style="padding-top:15px; padding-bottom:10px; padding-left:10px; padding-right:10px;">
{block:Title}
<div class="ptitle">{Title}</div>
{/block:Title}{block:Lines}{block:Label}<b>{Label}</b> {/block:Label}{Line}<br>{/block:Lines}
{block:IndexPage}<br><div class="permalink"><a href="{Permalink}">{NoteCountWithLabel} &nbsp; <a href="{ReblogURL}" target="_blank">reblog</a></a></div>{/block:IndexPage}</div></div></div>
{/block:Chat}

{block:Audio}<div id="entry">
<div class="audio">{AudioPlayerBlack}</div>
{block:IndexPage}<div class="permalink"><a href="{Permalink}">{NoteCountWithLabel} &nbsp; <a href="{ReblogURL}" target="_blank">reblog</a></a> </div></div>
{block:Caption}<div class="audiocap"><a href="{Permalink}">{Caption}</a></div>{/block:Caption}
{/block:IndexPage}

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

{block:Answer}<div id="entry"><div style="background-color:#f2f2f2;">
<div style="padding-top:15px; padding-bottom:10px; padding-left:10px; padding-right:10px;">
<div class="message">{Asker}&nbsp;murmured: {Question}</div>
{Answer}
{block:IndexPage}<br><div class="permalink"><a href="{Permalink}">{NoteCountWithLabel} &nbsp; <a href="{ReblogURL}" target="_blank">reblog</a></a></div>{/block:IndexPage}</div></div></div>
{/block:Answer}

{block:PostNotes}{PostNotes}{/block:PostNotes}

</div>

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

{block:IndexPage}
<div class="column navigation" id="navigation">
{block:Pagination}
{block:PreviousPage}<a href="{PreviousPage}" class="navigate">{/block:PreviousPage}{block:PreviousPage}</a>{/block:PreviousPage}
{block:NextPage}<a href="{NextPage}" class="navigate" id="nextPage">{/block:NextPage}{block:NextPage}</a>{/block:NextPage}{/block:Pagination}
</div>
{/block:IndexPage}

<!-- If I see you using one of my themes without this credit, I'll report you. -->
<div style="position:fixed;right:8px;top:28px;">
<a href="http://m-orbide.tumblr.com/" target="_blank"><img src="http://static.tumblr.com/i8axhtw/gRWmfr3aq/installtheme.png">
</div>

</body>