Hiatus

<meta name="image:Sidebar" content="" />
<meta name="color:links" content="#cc9999;" />


<link href='http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz' rel='stylesheet' type='text/css'><link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'>

<style type="text/css">


.a a:active, a:visited{ color: {color:links}; text-decoration: none;}


.tabs {
    position: relative;
    width: 500px;
}

#credit {right: 1px;bottom: 5px;text-transform: uppercase; position: fixed; font-size: 11px; right: 7px;}


.tabs input {
	position: absolute;
	z-index: 1000;
	width: 125px;
	height: 40px;
	left: 0px;
	top: 0px;
	opacity: 0;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
	cursor: pointer;
}
.tabs input#tab-2{
	left: 120px;
}
.tabs input#tab-3{
	left: 240px;
}
.tabs input#tab-4{
	left: 360px;
}

.tabs label { background-color: #101010;
	font-size: 11px; font-family: yanone kaffeesatz;
	line-height: 40px;
	height: 40px;
	position: relative;
	padding: 5 20px;
    float: left;
	display: block;
	width: 85px;
	color: #e9e9e9;
	letter-spacing: 1px;
	text-transform: uppercase;
	text-align: center;
}

.tabs label:after {
    content: '';
	text-decoation: underline;
	position: absolute;
	left: 0;
	width: 100%;
	display: block;
}

.tabs label:first-of-type {
    z-index: 4;
}

.tab-label-2 {
    z-index: 3;
}

.tab-label-3 {
    z-index: 2;
}

.tab-label-4 {
    z-index: 1;
}

.tabs input:checked + label {
   text-decoration: underline;
	z-index: 6;
}

.clear-shadow {
	clear: both;
}

.lovecontent {
    background-image: url({image:Sidebar});
	position: relative;
    width: 100%;
	height: 340px;
	z-index: 5;
}

.lovecontent div {
    position: absolute;
	top: 0;
	left: 0;
	padding: 30px 50px;
	z-index: 1;
    opacity: 0;
    -webkit-transition: opacity linear 0.1s;
    -moz-transition: opacity linear 0.1s;
    -o-transition: opacity linear 0.1s;
    -ms-transition: opacity linear 0.1s;
    transition: opacity linear 0.1s;
}

.tabs input.tab-selector-1:checked ~ .lovecontent .content-1,
.tabs input.tab-selector-2:checked ~ .lovecontent .content-2,
.tabs input.tab-selector-3:checked ~ .lovecontent .content-3,
.tabs input.tab-selector-4:checked ~ .lovecontent .content-4 {
	z-index: 100;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
    opacity: 1;

    -webkit-transition: opacity ease-out 0.2s 0.1s;
    -moz-transition: opacity ease-out 0.2s 0.1s;
    -o-transition: opacity ease-out 0.2s 0.1s;
    -ms-transition: opacity ease-out 0.2s 0.1s;
    transition: opacity ease-out 0.2s 0.1s;
}
.lovecontent div h2,
.lovecontent div h3{
	color: #398080;
}
.lovecontent div h4 {
font-weight: 500;
margin-left: 50px;
letter-spacing: 3px;
font-family: oswald, georgia;
font-size: 50px;
color: #fff;
width: 300px;
padding-bottom: 20px;
padding-top: 80px;
border-bottom: 3px solid #e9e9e9;
text-align: center; }

.lovecontent div p {
	font-size: 9px;
	line-height: 100%;
	text-align: justify;
	margin: 0;
	color: #222;
	padding: 30px;
	font-family: georgia;
	background:#fff;
}


/* CONTROLS */

iframe#tumblr_controls {
right:3px !important;
position: fixed !important;
-webkit-transition: opacity 0.7s linear;
opacity: 0.2;
-webkit-transition: all 0.8s ease-out;
-moz-transition: all 0.8s ease-out;
transition: all 0.8s ease-out;}

iframe#tumblr_controls:hover{
-webkit-transition: opacity 0.7s linear;
opacity: 1;
-webkit-transition: all 0.4s ease-out;
-moz-transition: all 0.4s ease-out;
transition: all 0.4s ease-out;}

iframe#tumblr_controls {
top: 0% !important;
right:0% !important;
position: fixed !important;}


</style>

<center><br /><br />

<section class="tabs">
	            <input id="tab-1" type="radio" name="radio-set" class="tab-selector-1" checked="checked" />
		        <label for="tab-1" class="tab-label-1">I</label>

	            <input id="tab-2" type="radio" name="radio-set" class="tab-selector-2" />
		        <label for="tab-2" class="tab-label-2">II</label>

	            <input id="tab-3" type="radio" name="radio-set" class="tab-selector-3" />
		        <label for="tab-3" class="tab-label-3">III</label>

	            <input id="tab-4" type="radio" name="radio-set" class="tab-selector-4" />
		        <label for="tab-4" class="tab-label-4">IV</label>

<div class="clear-shadow"></div>

		        <div class="lovecontent">
			        <div class="content-1">
						<center><h4>I'M GONE!</h4>
				    </div>
			        <div class="content-2">
                        <p>
Lorem ipsum dolor sit amet, accusam liberavisse eu sea, saepe scaevola legendos at vix. Magna liber invidunt eu nam, dicta probatus usu no, id propriae sensibus omittantur sea. Saepe erroribus te cum. Legere doming cum in, regione vocibus detracto mei no, et tempor iracundia intellegat ius. Sed minim disputationi no, aliquip fuisset at qui.

Sed id dicat vocibus. Ad usu perfecto democritum, per in indoctum aliquando. Eum no habeo dicit qualisque, odio fastidii petentium et est. Duo te iusto eleifend, duo et summo fuisset, minimum recteque neglegentur cu vix. Cu cum percipit contentiones, in sed porro essent tincidunt. Nam ne virtute fuisset quaerendum, quo erroribus explicari intellegat no, eum ut doctus commune vituperatoribus. <br><br>

Duo stet iusto ne. Ius case accommodare ex. Pro ex porro mundi oratio. Ex malorum phaedrum voluptaria mei, nobis iriure ex ius. Te tacimates pertinax pro, ad pri lorem euismod similique. Congue nostrum sit ne, aliquam tacimates eam ea.

Id sea partem facete vocent, per debet ornatus instructior at. Summo accumsan id mei, falli quaeque omittam his te. Ut dolores sapientem sit, nec cu ferri persequeris intellegebat.

</p>
				    </div>
			        <div class="content-3">
						<p>
REMEMBER, you have to edit this part in HTML rather than apperance options. It's really easy, just scroll down to the bottom of the page and find this text. Also use <*br> rather than <*p> because otherwise it'll look bad! </p>
				    </div>
				    <div class="content-4">
						<p>More stuff here, make sure it's long enough because otherwise it looks super weird.
</p>
				    </div>
		        </div>
			</section>
</div>

<div id="credit" style="font-family: calibri; font-size: 9px;"><br> theme by <a href="http://hclaraosmin.tumblr.com/">claraosmin </a>
</body>