single blog

Jack in the Box

<style>
#CSSbyiKiwipop {
}
#MadeforVibe {
}
body {
	background: #ffcfe8;
}
.sf {
	display: none;
}
table {
	background: transparent;
}
#save {
	top: 50px;
	left: 0px;
}
a:link, a:active, a:visited {
	font: 7.5pt verdana;
	color: #424242;
	font-weight: bold;
}
a:hover {
	color: #c4c4c4;
}
a.nav:link, a.nav:visited, a.nav:active {
	font: 14px century gothic;
	font-weight: normal;
	color: #ffffff;
	background-color: #6d6d6d;
	border-top: 20px solid #ffcfe8;
	text-decoration: none;
	display: block;
	text-align: center;
	text-transform: uppercase;
}
a.nav:hover {
	font: 14px century gothic;
	font-weight: normal;
	color: #ffffff;
	border-top: 20px solid #6d6d6d;
}
h1 {
	font-family: impact;
	font-size: 32;
	font-weight: normal;
	color: #ffffff;
	text-align: center;
	background-color: #ffb5db;
	border-left: 5px solid #ff75bc;
	border-right: 5px solid #ff75bc;
	margin-top: 0px;
	margin-bottom: 6px;
	text-transform: lowercase;
}
h2 {
	font-family: century gothic;
	font-size: 20;
	color: #ff5aaf;
	font-weight: normal;
	text-align: center;
	letter-spacing: 2px;
	text-transform: uppercase;
	border-top: #e3e3e3 solid 5px;
	line-height: 5px;
	margin-top: 3px;
	margin-bottom: 10px;
}
h3 {
	font-family: georgia;
	font-size: 18;
	color: #636363;
	font-weight: normal;
	text-align: right;
	letter-spacing: 1px;
	text-transform: lowercase;
	border-right: 25px solid #ff84f8;
	border-top: 2px solid #ff84f8;
	border-bottom: 2px solid #ff84f8;
	line-height: 18px;
	padding-right: 10px;
	margin-bottom: 6px;
	margin-top: 3px;
}
h4 {
	font-family: georgia;
	font-size: 14;
	color: #b0b0b0;
	font-weight: normal;
	text-align: left;
	letter-spacing: 3px;
	text-transform: uppercase;
	border-top: #ffc0e1 dashed 2px;
	padding-left: 10px;
	margin-bottom: 6px;
	margin-top: 3px;
}
tr, td, body, .text {
	font-family: verdana;
	font-size: 7.5pt;
	color: #939393;
}
textarea {
	font: 6pt verdana;
	color: #FFFFFF;
	background: #e7e7e7;
	border: 1px solid #ffaad6;
	margin-bottom: 3px;
	height: 20px;
	width: 88px;
}
b {
	font: 7.5pt verdana;
	font-weight: bold;
	color: #f40a83;
	letter-spacing: 1px;
}
i {
	font: 7.5pt verdana;
	font-weight: normal;
	font-style: italic;
	color: #808080;
}
.u {
	font: 7.5pt verdana;
	font-weight: normal;
	border-bottom: 1px solid #ff9efe;
	color: #ff9efe;
}
</style>
<p>
</p>
<center><table cellspacing="0" cellpadding="0">
<tr><td width="600">
<div style="width: 600px; height: auto; text-align: center;">
<center><table width="600" cellspacing="5" cellpadding="0"><tr>
<td width="200">
<a href="/~riyvern" class="nav">link</a>
</td>
<td width="200">
<a href="/~riyvern" class="nav">link</a>
</td>
<td width="200">
<a href="/~riyvern" class="nav">link</a>
</td>
<td width="200">
<a href="/~riyvern" class="nav">link</a>
</td>
<td width="200">
<a href="/~riyvern" class="nav">link</a>
</td>
<td width="200">
<a href="/~riyvern" class="nav">link</a>
</td>
</tr></table></center>
</div>
</td></tr>
<tr><td width="600">
<div style="width: 600px; height: 400px; background-color: #ffffff; overflow: auto; text-align: center; padding: 5px; border-bottom: 10px solid #000000;">
<h1>Fever's got me sweating</h1>
<b>bold</b> <i>italic</i> <font class="u">underline</font> <a href="/~riyvern">link</a>
<p>
Hey, you, did you turn up the heat. It's getting hotter and I'm growing weak. Maybe it's because you're standing close to me. I'm comin down with something feverishly.
</p>
<p>
I think my body's in shock. It just don't know what to do.
I feel my temperature rising past 102.
</p>
<p>
Fever, fever, fever, fever
</p>
<p>
Fever (Turn up the heat). Fever (Come on and get sick with me). Give me what you got, cause you know it's getting hot.
Fever(I'm turning flush). Fever (I'm burning up). Fever's got me sweating and you know I'm burning up.

</p>
<h2> and you know I'm burning up</h2>
Hey, you, did you turn up the heat. It's getting hotter and I'm growing weak. Maybe it's because you're standing close to me. I'm comin down with something feverishly.
<p>
I think my body's in shock. It just don't know what to do.
I feel my temperature rising past 102.
</p>
<p>
Fever, fever, fever, fever
</p>
<p>
Fever (Turn up the heat). Fever (Come on and get sick with me). Give me what you got, cause you know it's getting hot.
Fever(I'm turning flush). Fever (I'm burning up). Fever's got me sweating and you know I'm burning up.

</p>
<h3>Hey, you, did you turn up the heat</h3>
Hey, you, did you turn up the heat. It's getting hotter and I'm growing weak. Maybe it's because you're standing close to me. I'm comin down with something feverishly.
<p>
I think my body's in shock. It just don't know what to do.
I feel my temperature rising past 102.
</p>
<p>
Fever, fever, fever, fever
</p>
<p>
Fever (Turn up the heat). Fever (Come on and get sick with me). Give me what you got, cause you know it's getting hot.
Fever(I'm turning flush). Fever (I'm burning up). Fever's got me sweating and you know I'm burning up.

</p>
<h4>It's getting hotter and I'm growing weak</h4>
Hey, you, did you turn up the heat. It's getting hotter and I'm growing weak. Maybe it's because you're standing close to me. I'm comin down with something feverishly.
<p>
I think my body's in shock. It just don't know what to do.
I feel my temperature rising past 102.
</p>
<p>
Fever, fever, fever, fever
</p>
<p>
Fever (Turn up the heat). Fever (Come on and get sick with me). Give me what you got, cause you know it's getting hot.
Fever(I'm turning flush). Fever (I'm burning up). Fever's got me sweating and you know I'm burning up.
</p>
<h1>Credit</h1>
Layout by <a href="/~Riyvern">Vibe</a>.
</div>
</td></tr>
</table></center>

<style>
#CSSbyiKiwipop {
}
#MadeforVibe {
}
body {
	background: #feffd1;
}
.sf {
	display: none;
}
table {
	background: transparent;
}
#save {
	top: 50px;
	left: 0px;
}
a:link, a:active, a:visited {
	font: 7.5pt verdana;
	color: #945408;
	font-weight: bold;
}
a:hover {
	color: #f3c48c;
}
a.nav:link, a.nav:visited, a.nav:active {
	font: 14px century gothic;
	font-weight: normal;
	color: #ffffff;
	background-color: #bf7f33;
	border-top: 20px solid #feffd1;
	text-decoration: none;
	display: block;
	text-align: center;
	text-transform: uppercase;
}
a.nav:hover {
	font: 14px century gothic;
	font-weight: normal;
	color: #ffffff;
	border-top: 20px solid #bf7f33;
}
h1 {
	font-family: impact;
	font-size: 32;
	font-weight: normal;
	color: #ffffff;
	text-align: center;
	background-color: #f8f184;
	border-left: 5px solid #e0b543;
	border-right: 5px solid #e0b543;
	margin-top: 0px;
	margin-bottom: 6px;
	text-transform: lowercase;
}
h2 {
	font-family: century gothic;
	font-size: 20;
	color: #a66424;
	font-weight: normal;
	text-align: center;
	letter-spacing: 2px;
	text-transform: uppercase;
	border-top: #fffaaf solid 5px;
	line-height: 5px;
	margin-top: 3px;
	margin-bottom: 10px;
}
h3 {
	font-family: georgia;
	font-size: 18;
	color: #f3e942;
	font-weight: normal;
	text-align: right;
	letter-spacing: 1px;
	text-transform: lowercase;
	border-right: 25px solid #a95f17;
	border-top: 2px solid #a95f17;
	border-bottom: 2px solid #a95f17;
	line-height: 18px;
	padding-right: 10px;
	margin-bottom: 6px;
	margin-top: 3px;
}
h4 {
	font-family: georgia;
	font-size: 14;
	color: #c38446;
	font-weight: normal;
	text-align: left;
	letter-spacing: 3px;
	text-transform: uppercase;
	border-top: #feffaf dashed 2px;
	padding-left: 10px;
	margin-bottom: 6px;
	margin-top: 3px;
}
tr, td, body, .text {
	font-family: verdana;
	font-size: 7.5pt;
	color: #a2896b;
}
textarea {
	font: 6pt verdana;
	color: #FFFFFF;
	background: #faffa8;
	border: 1px solid #dba566;
	margin-bottom: 3px;
	height: 20px;
	width: 88px;
}
b {
	font: 7.5pt verdana;
	font-weight: bold;
	color: #72440e;
	letter-spacing: 1px;
}
i {
	font: 7.5pt verdana;
	font-weight: normal;
	font-style: italic;
	color: #c38f53;
}
.u {
	font: 7.5pt verdana;
	font-weight: normal;
	border-bottom: 1px solid #e8b476;
	color: #e8b476;
}
</style>
<p>
</p>
<center><table cellspacing="0" cellpadding="0">
<tr><td width="600">
<div style="width: 600px; height: auto; text-align: center;">
<center><table width="600" cellspacing="5" cellpadding="0"><tr>
<td width="200">
<a href="/~riyvern" class="nav">link</a>
</td>
<td width="200">
<a href="/~riyvern" class="nav">link</a>
</td>
<td width="200">
<a href="/~riyvern" class="nav">link</a>
</td>
<td width="200">
<a href="/~riyvern" class="nav">link</a>
</td>
<td width="200">
<a href="/~riyvern" class="nav">link</a>
</td>
<td width="200">
<a href="/~riyvern" class="nav">link</a>
</td>
</tr></table></center>
</div>
</td></tr>
<tr><td width="600">
<div style="width: 600px; height: 400px; background-color: #ffffff; overflow: auto; text-align: center; padding: 5px; border-bottom: 10px solid #724a1c;">
<h1>Fever's got me sweating</h1>
<b>bold</b> <i>italic</i> <font class="u">underline</font> <a href="/~riyvern">link</a>
<p>
Hey, you, did you turn up the heat. It's getting hotter and I'm growing weak. Maybe it's because you're standing close to me. I'm comin down with something feverishly.
</p>
<p>
I think my body's in shock. It just don't know what to do.
I feel my temperature rising past 102.
</p>
<p>
Fever, fever, fever, fever
</p>
<p>
Fever (Turn up the heat). Fever (Come on and get sick with me). Give me what you got, cause you know it's getting hot.
Fever(I'm turning flush). Fever (I'm burning up). Fever's got me sweating and you know I'm burning up.

</p>
<h2> and you know I'm burning up</h2>
Hey, you, did you turn up the heat. It's getting hotter and I'm growing weak. Maybe it's because you're standing close to me. I'm comin down with something feverishly.
<p>
I think my body's in shock. It just don't know what to do.
I feel my temperature rising past 102.
</p>
<p>
Fever, fever, fever, fever
</p>
<p>
Fever (Turn up the heat). Fever (Come on and get sick with me). Give me what you got, cause you know it's getting hot.
Fever(I'm turning flush). Fever (I'm burning up). Fever's got me sweating and you know I'm burning up.

</p>
<h3>Hey, you, did you turn up the heat</h3>
Hey, you, did you turn up the heat. It's getting hotter and I'm growing weak. Maybe it's because you're standing close to me. I'm comin down with something feverishly.
<p>
I think my body's in shock. It just don't know what to do.
I feel my temperature rising past 102.
</p>
<p>
Fever, fever, fever, fever
</p>
<p>
Fever (Turn up the heat). Fever (Come on and get sick with me). Give me what you got, cause you know it's getting hot.
Fever(I'm turning flush). Fever (I'm burning up). Fever's got me sweating and you know I'm burning up.
</p>
<h4>It's getting hotter and I'm growing weak</h4>
Hey, you, did you turn up the heat. It's getting hotter and I'm growing weak. Maybe it's because you're standing close to me. I'm comin down with something feverishly.
<p>
I think my body's in shock. It just don't know what to do.
I feel my temperature rising past 102.
</p>
<p>
Fever, fever, fever, fever
</p>
<p>
Fever (Turn up the heat). Fever (Come on and get sick with me). Give me what you got, cause you know it's getting hot.
Fever(I'm turning flush). Fever (I'm burning up). Fever's got me sweating and you know I'm burning up.
</p>
<h1>Credit</h1>
Layout by <a href="/~Riyvern">Vibe</a>.
</div>
</td></tr>
</table></center>

Good For: Role Play Characters / About Me Pages / Blogs / Guild Webbies, ect.
IE Compatible: Yes
Featured Song: Fever by Family Force 5
Color Schemes: Rockin Princess / Vanilla and Chocolate / Blueberries / Oh My Jhudora!
Notes: This style gets its name from it's spiffy navigation. The navigation links at the top "pop up" as you hover over them. The blog space is very spacious and allows room for written content and fairy large images.

Photo Frame

<style>
#CSSbyiKiwipop {
}
#MadeforVibe {
}
body {
	background: #e3e3e3;
}
.sf {
	display: none;
}
table {
	background: transparent;
}
#save {
	top: 50px;
	left: 900px;
}
a:link, a:active, a:visited {
	font: 7.5pt verdana;
	color: #000000;
	font-weight: bold;
}
a:hover {
	color: #fffea8;
}
a.nav:link, a.nav:visited, a.nav:active {
	font: 10px georgia;
	font-weight: normal;
	color: #ffffff;
	background-color: #000000;
	text-decoration: none;
	display: block;
	text-align: center;
	text-transform: uppercase;
}
a.nav:hover {
	font: 10px georgia;
	font-weight: normal;
	color: #ffffff;
	background-color: #474747;
}
#title {
	top: 0px;
	left: 0px;
	width: 96%;
	background-color: #000000;
	border-bottom: 5px solid #ffffff;
	padding-bottom: 5px;
	padding-left: 50px;
}
#line {
	top: 74px;
	left: 0px;
	width: 100%;
	height: 3px;
	background-color: #000000;
	font: 7.5pt verdana;
	color: #e3e3e3;
}
#main {
	top: 74px;
	left: 20px;
	width: 500px;
	height: 400px;
	overflow: auto;
	background-color: #ffffff;
	border-right: 3px solid #000000;
	border-left: 3px solid #000000;
	border-bottom: 3px solid #000000;
	font: 7.5pt verdana;
	color: #5f5c61;
	text-align: justify;
	padding: 5px;
}
#image {
	top: 74px;
	left: 540px;
	width: 250px;
	height: 405px;
	overflow: auto;
	background-color: #ffffff;
	border-right: 3px solid #000000;
	border-left: 3px solid #000000;
	border-bottom: 3px solid #000000;
	font: 7.5pt verdana;
	color: #5f5c61;
	text-align: justify;
	padding-left: 5px;
	padding-right: 5px;
	padding-bottom: 5px;
}
#navi {
	top: 490px;
	left: 19px;
	width: 786px;
	height: auto;
	overflow: auto;
	font: 7.5pt verdana;
	color: #5f5c61;
	text-align: justify;
}
h1 {
	font-family: georgia;
	font-size: 32;
	font-weight: normal;
	color: #202020;
	text-align: left;
	border-right: 20px solid #fffebc;
	border-bottom: 5px solid #fffebc;
	margin-top: 5px;
	margin-bottom: 6px;
	letter-spacing: -3px;
	text-transform: lowercase;
	line-height: 12px;
	padding-left: 10px;
}
h2 {
	font-family: georgia;
	font-size: 18;
	color: #3b3b3b;
	font-weight: normal;
	text-align: right;
	text-transform: lowercase;
	border-top: #ffffff double 8px;
	background-color: #f1f1f1;
	margin-top: 3px;
	margin-bottom: 6px;
	line-height: 10px;
	padding-right: 10px;
}
h3 {
	font-family: century gothic;
	font-size: 16;
	color: #939393;
	font-weight: normal;
	text-align: center;
	letter-spacing: 1px;
	text-transform: uppercase;
	border-left: 50px solid #fffe9a;
	border-right: 20px solid #fffe9a;
	border-bottom: 3px solid #fffe9a;
	line-height: 18px;
	margin-bottom: 6px;
	margin-top: 3px;
}
h4 {
	font-family: century gothic;
	font-size: 14;
	color: #ffffff;
	font-weight: normal;
	text-align: center;
	letter-spacing: 3px;
	text-transform: uppercase;
	background-color: #d9d9d9;
	border-bottom: dashed 1px #ffffff;
	padding-left: 5px;
	margin-bottom: 6px;
	margin-top: 3px;
}
tr, td, body, .text {
	font-family: verdana;
	font-size: 7.5pt;
	color: #5f5c61;
}
textarea {
	font: 6pt verdana;
	color: #FFFFFF;
	background: #d4d4d4;
	border: 1px solid #575757;
	margin-bottom: 3px;
	height: 20px;
	width: 88px;
}
b {
	font: 7.5pt verdana;
	font-weight: bold;
	color: #000000;
	letter-spacing: 1px;
}
b.a {
	font: 52px century gothic;
	font-weight: normal;
	color: #fff000;
	letter-spacing: 10px;
	text-transform: uppercase;
}
b.b {
	font: 52px century gothic;
	font-weight: normal;
	color: #ffffff;
	letter-spacing: 10px;
	text-transform: uppercase;
}
i {
	font: 7.5pt verdana;
	font-weight: normal;
	font-style: italic;
	color: #a4a4a4;
}
.u {
	font: 7.5pt verdana;
	font-weight: normal;
	border-bottom: 1px solid #4e4e4e;
	color: #4e4e4e;
}
</style>
<div id="title" style="position: absolute;">
<b class="a">Infinity</b> <b class="b">*</b>
</div>
<div id="line" style="position: absolute;">
.
</div>
<div id="main" style="position: absolute;">
<h1>Here's my key philosophy</h1>
<b>bold</b> <i>italic</i> <font class="u">underline</font> <a href="/~riyvern">link</a>
<p>
Here's my key philosophy. A freak like me just needs infinity. 
</p>
<p>
Relax. Take your time.
</p>
<p>
And take your time to trust in me. And you will find infinity, infinity. And take your time to trust in me. And you will find infinity, infinity.
</p>
<p>
The time goes by so naturally and you'll receive infinity. 

</p>
<h2>a freak like me just needs infinity</h2>
Here's my key philosophy. A freak like me just needs infinity. 
<p>
Relax. Take your time.
</p>
<p>
And take your time to trust in me. And you will find infinity, infinity. And take your time to trust in me. And you will find infinity, infinity.
</p>
<p>
The time goes by so naturally and you'll receive infinity. 

</p>
<h3>take your time and trust in me</h3>
Here's my key philosophy. A freak like me just needs infinity. 
<p>
Relax. Take your time.
</p>
<p>
And take your time to trust in me. And you will find infinity, infinity. And take your time to trust in me. And you will find infinity, infinity.
</p>
<p>
The time goes by so naturally and you'll receive infinity. 

</p>
<h4>and you will find infinity</h4>
Here's my key philosophy. A freak like me just needs infinity. 
<p>
Relax. Take your time.
</p>
<p>
And take your time to trust in me. And you will find infinity, infinity. And take your time to trust in me. And you will find infinity, infinity.
</p>
<p>
The time goes by so naturally and you'll receive infinity. 

</p>
<h1>Credit</h1>
Layout by <a href="/~Riyvern">Vibe</a>.
</div>
<div id="image" style="position: absolute;">
<img src="http://i48.tinypic.com/ru73vk.jpg">
</div>
<div id="navi" style="position: absolute;">
<center><table width="786">
<tr>
<td width="131">
<a href="/~riyvern" class="nav">link</a>
</td>
<td width="131">
<a href="/~riyvern" class="nav">link</a>
</td>
<td width="131">
<a href="/~riyvern" class="nav">link</a>
</td>
<td width="131">
<a href="/~riyvern" class="nav">link</a>
</td>
<td width="131">
<a href="/~riyvern" class="nav">link</a>
</td>
<td width="131">
<a href="/~riyvern" class="nav">link</a>
</td>
</tr>
<tr>
<td width="131">
<a href="/~riyvern" class="nav">link</a>
</td>
<td width="131">
<a href="/~riyvern" class="nav">link</a>
</td>
<td width="131">
<a href="/~riyvern" class="nav">link</a>
</td>
<td width="131">
<a href="/~riyvern" class="nav">link</a>
</td>
<td width="131">
<a href="/~riyvern" class="nav">link</a>
</td>
<td width="131">
<a href="/~riyvern" class="nav">link</a>
</td>
</tr>
</table></center>
</div>
<div id="save" style="position: absolute;">
</div>

<style>
#CSSbyiKiwipop {
}
#MadeforVibe {
}
body {
	background: #ffe0f8;
}
.sf {
	display: none;
}
table {
	background: transparent;
}
#save {
	top: 50px;
	left: 900px;
}
a:link, a:active, a:visited {
	font: 7.5pt verdana;
	color: #ff6edf;
	font-weight: bold;
}
a:hover {
	color: #ffc0f1;
}
a.nav:link, a.nav:visited, a.nav:active {
	font: 10px georgia;
	font-weight: normal;
	color: #ffffff;
	background-color: #ffbd70;
	text-decoration: none;
	display: block;
	text-align: center;
	text-transform: uppercase;
}
a.nav:hover {
	font: 10px georgia;
	font-weight: normal;
	color: #ffffff;
	background-color: #ff6edf;
}
#title {
	top: 0px;
	left: 0px;
	width: 96%;
	background-color: #ffbd70;
	border-bottom: 5px solid #ffffff;
	padding-bottom: 5px;
	padding-left: 50px;
}
#line {
	top: 74px;
	left: 0px;
	width: 100%;
	height: 3px;
	background-color: #ffbd70;
	font: 7.5pt verdana;
	color: #e3e3e3;
}
#main {
	top: 74px;
	left: 20px;
	width: 500px;
	height: 400px;
	overflow: auto;
	background-color: #ffffff;
	border-right: 3px solid #ffbd70;
	border-left: 3px solid #ffbd70;
	border-bottom: 3px solid #ffbd70;
	font: 7.5pt verdana;
	color: #9f949d;
	text-align: justify;
	padding: 5px;
}
#image {
	top: 74px;
	left: 540px;
	width: 250px;
	height: 405px;
	overflow: auto;
	background-color: #ffffff;
	border-right: 3px solid #ffbd70;
	border-left: 3px solid #ffbd70;
	border-bottom: 3px solid #ffbd70;
	font: 7.5pt verdana;
	color: #9f949d;
	text-align: justify;
	padding-left: 5px;
	padding-right: 5px;
	padding-bottom: 5px;
}
#navi {
	top: 490px;
	left: 19px;
	width: 786px;
	height: auto;
	overflow: auto;
	font: 7.5pt verdana;
	color: #5f5c61;
	text-align: justify;
}
h1 {
	font-family: georgia;
	font-size: 32;
	font-weight: normal;
	color: #ff78e1;
	text-align: left;
	border-right: 20px solid #ffeac1;
	border-bottom: 5px solid #ffeac1;
	margin-top: 5px;
	margin-bottom: 6px;
	letter-spacing: -3px;
	text-transform: lowercase;
	line-height: 12px;
	padding-left: 10px;
}
h2 {
	font-family: georgia;
	font-size: 18;
	color: #ffa800;
	font-weight: normal;
	text-align: right;
	text-transform: lowercase;
	border-top: #ffffff double 8px;
	background-color: #ffdef8;
	margin-top: 3px;
	margin-bottom: 6px;
	line-height: 10px;
	padding-right: 10px;
}
h3 {
	font-family: century gothic;
	font-size: 16;
	color: #ff5bda;
	font-weight: normal;
	text-align: center;
	letter-spacing: 1px;
	text-transform: uppercase;
	border-left: 50px solid #ffa800;
	border-right: 20px solid #ffa800;
	border-bottom: 3px solid #ffa800;
	line-height: 18px;
	margin-bottom: 6px;
	margin-top: 3px;
}
h4 {
	font-family: century gothic;
	font-size: 14;
	color: #ffffff;
	font-weight: normal;
	text-align: center;
	letter-spacing: 3px;
	text-transform: uppercase;
	background-color: #ffbef0;
	border-bottom: dashed 1px #ffffff;
	padding-left: 5px;
	margin-bottom: 6px;
	margin-top: 3px;
}
tr, td, body, .text {
	font-family: verdana;
	font-size: 7.5pt;
	color: #9f949d;
}
textarea {
	font: 6pt verdana;
	color: #FFFFFF;
	background: #ffddf7;
	border: 1px solid #f8c45f;
	margin-bottom: 3px;
	height: 20px;
	width: 88px;
}
b {
	font: 7.5pt verdana;
	font-weight: bold;
	color: #ffa800;
	letter-spacing: 1px;
}
b.a {
	font: 52px century gothic;
	font-weight: normal;
	color: #ffffff;
	letter-spacing: 10px;
	text-transform: uppercase;
}
b.b {
	font: 52px century gothic;
	font-weight: normal;
	color: #ffde9e;
	letter-spacing: 10px;
	text-transform: uppercase;
}
i {
	font: 7.5pt verdana;
	font-weight: normal;
	font-style: italic;
	color: #f483db;
}
.u {
	font: 7.5pt verdana;
	font-weight: normal;
	border-bottom: 1px solid #ffd178;
	color: #ffd178;
}
</style>
<div id="title" style="position: absolute;">
<b class="a">Infinity</b> <b class="b">*</b>
</div>
<div id="line" style="position: absolute;">
.
</div>
<div id="main" style="position: absolute;">
<h1>Here's my key philosophy</h1>
<b>bold</b> <i>italic</i> <font class="u">underline</font> <a href="/~riyvern">link</a>
<p>
Here's my key philosophy. A freak like me just needs infinity. 
</p>
<p>
Relax. Take your time.
</p>
<p>
And take your time to trust in me. And you will find infinity, infinity. And take your time to trust in me. And you will find infinity, infinity.
</p>
<p>
The time goes by so naturally and you'll receive infinity. 

</p>
<h2>a freak like me just needs infinity</h2>
Here's my key philosophy. A freak like me just needs infinity. 
<p>
Relax. Take your time.
</p>
<p>
And take your time to trust in me. And you will find infinity, infinity. And take your time to trust in me. And you will find infinity, infinity.
</p>
<p>
The time goes by so naturally and you'll receive infinity. 

</p>
<h3>take your time and trust in me</h3>
Here's my key philosophy. A freak like me just needs infinity. 
<p>
Relax. Take your time.
</p>
<p>
And take your time to trust in me. And you will find infinity, infinity. And take your time to trust in me. And you will find infinity, infinity.
</p>
<p>
The time goes by so naturally and you'll receive infinity. 

</p>
<h4>and you will find infinity</h4>
Here's my key philosophy. A freak like me just needs infinity. 
<p>
Relax. Take your time.
</p>
<p>
And take your time to trust in me. And you will find infinity, infinity. And take your time to trust in me. And you will find infinity, infinity.
</p>
<p>
The time goes by so naturally and you'll receive infinity. 

</p>
<h1>Credit</h1>
Layout by <a href="/~Riyvern">Vibe</a>.
</div>
<div id="image" style="position: absolute;">
<img src="http://i50.tinypic.com/2cx16b.jpg">
</div>
<div id="navi" style="position: absolute;">
<center><table width="786">
<tr>
<td width="131">
<a href="/~riyvern" class="nav">link</a>
</td>
<td width="131">
<a href="/~riyvern" class="nav">link</a>
</td>
<td width="131">
<a href="/~riyvern" class="nav">link</a>
</td>
<td width="131">
<a href="/~riyvern" class="nav">link</a>
</td>
<td width="131">
<a href="/~riyvern" class="nav">link</a>
</td>
<td width="131">
<a href="/~riyvern" class="nav">link</a>
</td>
</tr>
<tr>
<td width="131">
<a href="/~riyvern" class="nav">link</a>
</td>
<td width="131">
<a href="/~riyvern" class="nav">link</a>
</td>
<td width="131">
<a href="/~riyvern" class="nav">link</a>
</td>
<td width="131">
<a href="/~riyvern" class="nav">link</a>
</td>
<td width="131">
<a href="/~riyvern" class="nav">link</a>
</td>
<td width="131">
<a href="/~riyvern" class="nav">link</a>
</td>
</tr>
</table></center>
</div>
<div id="save" style="position: absolute;">
</div>

Good For: Sites / Role Play Characters / About Me Pages / Blogs / Guild Webbies, ect.
IE Compatible: No
Featured Song: Infinity by Guru Jost Project
Color Schemes: Sunshine on a Dreary Day / Tangerines and Strawberries / Basic Blues / Perfectly Purple
Notes: Two content areas fall down from the title, which stretches across the page. There's plenty of navigation links in this layout and a large area for both your content and an image.

Modernized

<style>
#CSSbyiKiwipop {
}
#MadeforVibe {
}
body {
	background: #efefef;
}
.sf {
	display: none;
}
table {
	background: none;
}
#save {
	top: 50px;
	left: 900px;
}
a:link, a:active, a:visited {
	font: 7.5pt verdana;
	color: #a315d7;
	font-weight: bold;
	text-decoration: none;
}
a:hover {
	color: #ffffff;
	background-color: #a315d7;
}
a.nav:link, a.nav:visited, a.nav:active {
	font: 5pt small fonts;
	font-weight: normal;
	color: #ffffff;
	background-color: #e5adff;
	text-align: center;
	padding: 10px;
	text-transform: uppercase;
}
a.nav:hover {
	color: #b15cd9;
}
#title {
	top: 30px;
	left: 300px;
	width: 600px;
	height: auto;
	font: 40px impact;
	color: #30b08d;
	text-transform: uppercase;
	text-align: left;
	overflow: hidden;
	padding-left: 20px;
	z-index: 1;
}
#bg {
	top: 67px;
	left: 300px;
	width: 600px;
	height: 300px;
	border-top: solid 100px #30b08d;
	border-bottom: solid 60px #30b08d;
	overflow: hidden;
}
#mbg {
	top: 75px;
	left: 320px;
	width: 550px;
	height: 400px;
	overflow: hidden;
	background-color: #ffffff;
	padding: 5px;
	padding-top: 30px;
	font: 7.5pt verdana;
	color: #9f949d;
	text-align: justify;
	border-bottom: 10px solid #e5adff;
}
#main {
	width: 550px;
	height: 400px;
	overflow: auto;
	font: 7.5pt verdana;
	color: #9f949d;
	text-align: center;
}
#navi {
	top: 85px;
	left: 275px;
	width: 650px;
	height: auto;
	overflow: hidden;
	background-color: #e5adff;
	padding-bottom: 3px;
	z-index: 1;
	text-align: right;
}
h1 {
	font-family: arial;
	font-size: 26;
	font-weight: normal;
	color: #a7dcd0;
	text-align: left;
	margin-top: 5px;
	margin-bottom: 10px;
	text-transform: lowercase;
	letter-spacing: -2px;
	line-height: 16px;
	padding-left: 10px;
}
h2 {
	font-family: impact;
	font-size: 18;
	color: #af74dc;
	font-weight: normal;
	text-align: center;
	text-transform: lowercase;
	margin-top: 3px;
	margin-bottom: 6px;
	padding-left: 60px;
}
tr, td, body, .text {
	font-family: verdana;
	font-size: 7.5pt;
	color: #9f949d;
}
textarea {
	font: 6pt verdana;
	color: -blocked-;
	background: #f9f9f9;
	border: 1px solid #e0e0e0;
	margin-bottom: 3px;
	height: 20px;
	width: 88px;
}
b {
	font: 7.5pt verdana;
	font-weight: normal;
	background: #af74dc;
	color: #ffffff;
	padding: 1px;
}
i {
	font: 7.5pt verdana;
	font-weight: normal;
	font-style: italic;
	color: #74dcbb;
}
.u {
	font: 7.5pt verdana;
	font-weight: normal;
	border-bottom: 1px solid #d8abe8;
	color: #53b193;
}
</style>
<div id="title" style="position: absolute;">
(Broken Rose)
</div>
<div id="bg" style="position: absolute;">
</div>
<div id="navi" style="position: absolute;">
<a href="/" class="nav">link</a>
<a href="/" class="nav">link</a>
<a href="/" class="nav">link</a>
<a href="/" class="nav">link</a>
<a href="/" class="nav">link</a>
<a href="/" class="nav">link</a>
<a href="/" class="nav">link</a>
<a href="/~riyvern" class="nav">css</a>
</div>
<div id="mbg" style="position: absolute;">
<div id="main" style="position: absolute;">
<h1>i need your love</h1>
<b>bold</b> <i>italic</i> <font class="u">underline</font> <a href="/">link</a>
<p>
I need your love. I'm a broken rose. Oh baby, help me from frozen pain. With your smile, your eyes, and sing me, just for me.
</p>
<p>
I wanna need your love… I was a broken rose. I wanna need your love… 
</p>
<p>
I need your love. I'm a broken rose. Oh baby, help me from frozen pain. With your smile, your eyes, and sing me, just for me.
</p>
<p>
I wanna need your love… I was a broken rose. I wanna need your love… 
</p>
<p>
I need your love. I'm a broken rose. Oh baby, help me from frozen pain. With your smile, your eyes, and sing me, just for me.
</p>
<p>
I wanna need your love… I was a broken rose. I wanna need your love… 
</p>

<h2>i'm a broken rose</h2>
I need your love. I'm a broken rose. Oh baby, help me from frozen pain. With your smile, your eyes, and sing me, just for me.
<p>
I wanna need your love… I was a broken rose. I wanna need your love… 
</p>
<p>
I need your love. I'm a broken rose. Oh baby, help me from frozen pain. With your smile, your eyes, and sing me, just for me.
</p>
<p>
I wanna need your love… I was a broken rose. I wanna need your love… 
</p>
<p>
I need your love. I'm a broken rose. Oh baby, help me from frozen pain. With your smile, your eyes, and sing me, just for me.
</p>
<p>
I wanna need your love… I was a broken rose. I wanna need your love… 
</p>
</div>
</div>

<style>
#CSSbyiKiwipop {
}
#MadeforVibe {
}
body {
	background: #333333;
}
.sf {
	display: none;
}
table {
	background: black;
}
#save {
	top: 50px;
	left: 900px;
}
a:link, a:active, a:visited {
	font: 7.5pt verdana;
	color: #202020;
	font-weight: bold;
	text-decoration: none;
}
a:hover {
	color: #ffffff;
	background-color: #202020;
}
a.nav:link, a.nav:visited, a.nav:active {
	font: 5pt small fonts;
	font-weight: normal;
	color: #ffffff;
	background-color: #000000;
	text-align: center;
	padding: 10px;
	text-transform: uppercase;
}
a.nav:hover {
	color: #3b3b3b;
}
#title {
	top: 30px;
	left: 300px;
	width: 600px;
	height: auto;
	font: 40px impact;
	color: #202020;
	text-transform: uppercase;
	text-align: left;
	overflow: hidden;
	padding-left: 20px;
	z-index: 1;
}
#bg {
	top: 67px;
	left: 300px;
	width: 600px;
	height: 300px;
	border-top: solid 100px #202020;
	border-bottom: solid 60px #202020;
	overflow: hidden;
}
#mbg {
	top: 75px;
	left: 320px;
	width: 550px;
	height: 400px;
	overflow: hidden;
	background-color: #4d4d4d;
	padding: 5px;
	padding-top: 30px;
	font: 7.5pt verdana;
	color: #9f949d;
	text-align: justify;
	border-bottom: 10px solid #000000;
}
#main {
	width: 550px;
	height: 400px;
	overflow: auto;
	font: 7.5pt verdana;
	color: #9f949d;
	text-align: center;
}
#navi {
	top: 85px;
	left: 275px;
	width: 650px;
	height: auto;
	overflow: hidden;
	background-color: #000000;
	padding-bottom: 3px;
	z-index: 1;
	text-align: right;
}
h1 {
	font-family: arial;
	font-size: 26;
	font-weight: normal;
	color: #2c2c2c;
	text-align: left;
	margin-top: 5px;
	margin-bottom: 10px;
	text-transform: lowercase;
	letter-spacing: -2px;
	line-height: 16px;
	padding-left: 10px;
}
h2 {
	font-family: impact;
	font-size: 18;
	color: #000000;
	font-weight: normal;
	text-align: center;
	text-transform: lowercase;
	margin-top: 3px;
	margin-bottom: 6px;
	padding-left: 60px;
}
tr, td, body, .text {
	font-family: verdana;
	font-size: 7.5pt;
	color: #9f949d;
}
textarea {
	font: 6pt verdana;
	color: #000000;
	background: #424242;
	border: 1px solid #111111;
	margin-bottom: 3px;
	height: 20px;
	width: 88px;
}
b {
	font: 7.5pt verdana;
	font-weight: normal;
	background: #000000;
	color: #aeaeae;
	padding: 1px;
}
i {
	font: 7.5pt verdana;
	font-weight: normal;
	font-style: italic;
	color: #ffffff;
}
.u {
	font: 7.5pt verdana;
	font-weight: normal;
	border-bottom: 1px solid #aeaeae;
	color: #000000;
}
</style>
<div id="title" style="position: absolute;">
(Broken Rose)
</div>
<div id="bg" style="position: absolute;">
</div>
<div id="navi" style="position: absolute;">
<a href="/" class="nav">link</a>
<a href="/" class="nav">link</a>
<a href="/" class="nav">link</a>
<a href="/" class="nav">link</a>
<a href="/" class="nav">link</a>
<a href="/" class="nav">link</a>
<a href="/" class="nav">link</a>
<a href="/~riyvern" class="nav">css</a>
</div>
<div id="mbg" style="position: absolute;">
<div id="main" style="position: absolute;">
<h1>i need your love</h1>
<b>bold</b> <i>italic</i> <font class="u">underline</font> <a href="/">link</a>
<p>
I need your love. I'm a broken rose. Oh baby, help me from frozen pain. With your smile, your eyes, and sing me, just for me.
</p>
<p>
I wanna need your love… I was a broken rose. I wanna need your love… 
</p>
<p>
I need your love. I'm a broken rose. Oh baby, help me from frozen pain. With your smile, your eyes, and sing me, just for me.
</p>
<p>
I wanna need your love… I was a broken rose. I wanna need your love… 
</p>
<p>
I need your love. I'm a broken rose. Oh baby, help me from frozen pain. With your smile, your eyes, and sing me, just for me.
</p>
<p>
I wanna need your love… I was a broken rose. I wanna need your love… 
</p>

<h2>i'm a broken rose</h2>
I need your love. I'm a broken rose. Oh baby, help me from frozen pain. With your smile, your eyes, and sing me, just for me.
<p>
I wanna need your love… I was a broken rose. I wanna need your love… 
</p>
<p>
I need your love. I'm a broken rose. Oh baby, help me from frozen pain. With your smile, your eyes, and sing me, just for me.
</p>
<p>
I wanna need your love… I was a broken rose. I wanna need your love… 
</p>
<p>
I need your love. I'm a broken rose. Oh baby, help me from frozen pain. With your smile, your eyes, and sing me, just for me.
</p>
<p>
I wanna need your love… I was a broken rose. I wanna need your love… 
</p>
</div>
</div>

Good For: Role Play Characters / About Me Pages / Guild Webbies, ect.
IE Compatible: No
Featured Song: Broken Rose by Black Stones
Color Schemes: Trendy / Black Ashes / Akalina
Notes: A simple design with overlaying navigation and a unique title. The blog is spacious enough to add large images. It is easy to edit but can be a bit tricky if you don't have basic knowledge of CSS/HTML.

multiple blog

The Blogger

<style>
#CSSbyiKiwipop {
}
#MadeforVibe {
}
body {
	background: #bbe4f1;
}
.sf {
	display: none;
}
table {
	background: transparent;
}
a:link, a:active, a:visited {
	font: 7.5pt verdana;
	color: #8e8e8e;
	font-weight: bold;
}
a:hover {
	color: #dcdcdc;
}
a.nav:link, a.nav:visited, a.nav:active {
	font: 14px century gothic;
	font-weight: normal;
	color: #ffffff;
	text-decoration: none;
	display: block;
	background-color: #c6c6c6;
	border-right: 10px solid #a7a7a7;
	border-left: 10px solid #a7a7a7;
	text-align: center;
	text-transform: uppercase;
}
a.nav:hover {
	font: 14px century gothic;
	font-weight: normal;
	color: #ffffff;
	background-color: #f1f1f1;
	border-right: 10px solid #a7a7a7;
	border-left: 10px solid #a7a7a7;
	text-align: center;
}
h1 {
	font-family: georgia;
	font-size: 32;
	font-weight: normal;
	color: #45bce3;
	text-align: left;
	border-bottom: 2px dashed #96f487;
	border-top: 6px solid #ffffff;
	margin-top: 0px;
	margin-bottom: 6px;
	letter-spacing: -3px;
	text-transform: lowercase;
	padding-left: 5px;
	line-height: 16px;
}
h2 {
	font-family: georgia;
	font-size: 20;
	color: #7ef16b;
	font-weight: normal;
	text-align: left;
	letter-spacing: -2px;
	text-transform: lowercase;
	border-right: #bfbfbf solid 50px;
	border-top: #bfbfbf dashed 2px;
	padding-right: 10px;
	margin-top: 3px;
	margin-bottom: 6px;
}
h3 {
	font-family: century gothic;
	font-size: 18;
	color: #00a2ff;
	font-weight: normal;
	text-align: left;
	letter-spacing: 1px;
	text-transform: lowercase;
	background-color: #e5e5e5;
	border-bottom: 2px solid #b3b3b3;
	line-height: 11px;
	padding-left: 10px;
	margin-bottom: 6px;
	margin-top: 3px;
}
h4 {
	font-family: leelawadee;
	font-size: 14;
	color: #96f487;
	font-weight: normal;
	text-align: center;
	letter-spacing: 3px;
	text-transform: uppercase;
	border-bottom: #8dd5ff double 3px;
	padding-left: 5px;
	margin-bottom: 6px;
	margin-top: 3px;
}
tr, td, body, .text {
	font-family: verdana;
	font-size: 7.5pt;
	color: #939393;
}
textarea {
	font: 6pt verdana;
	color: #FFFFFF;
	background: #dedede;
	border: 1px solid #c9c9c9;
	margin-bottom: 3px;
	height: 20px;
	width: 88px;
}
b {
	font: 7.5pt verdana;
	font-weight: bold;
	color: #00a2ff;
	letter-spacing: 1px;
}
i {
	font: 7.5pt verdana;
	font-weight: normal;
	font-style: italic;
	color: #9fcde7;
}
.u {
	font: 7.5pt verdana;
	font-weight: normal;
	border-bottom: 1px solid #96f487;
	color: #96f487;
}
</style>
<p>
</p>
<center><table><tr>
<td width="600" valign="top">
<div style="width: 600px; height: 400px; overflow: hidden; background-color: #ffffff; padding: 4px; text-align: center;">
<a name="one"></a>
<div style="width: 600px; height: 400px; overflow: auto; text-align: center;">
<h1>the great escape *</h1>
<b>bold</b> <i>italic</i> <font class="u">underline</font> <a href="/~rivyern">link</a>
<p>
Tonight will change our lives. It's so good to be by your side. But we'll cry. We won't give up the fight. We'll scream loud at the top of our lungs and they'll think it's just cause we're young. And we'll feel so alive.
</p>
<p>
Throw it away, forget yesterday, we'll make the great escape. We won't hear a word they say, they don't know us anyway. Watch it burn. Let it die. Cause we are finally free tonight

</p>
<h2>Throw it away</h2>
Tonight will change our lives. It's so good to be by your side. But we'll cry. We won't give up the fight. We'll scream loud at the top of our lungs and they'll think it's just cause we're young. And we'll feel so alive.
<p>
Throw it away, forget yesterday, we'll make the great escape. We won't hear a word they say, they don't know us anyway. Watch it burn. Let it die. Cause we are finally free tonight

</p>
<h3>Forget yesterday</h3>
Tonight will change our lives. It's so good to be by your side. But we'll cry. We won't give up the fight. We'll scream loud at the top of our lungs and they'll think it's just cause we're young. And we'll feel so alive.
<p>
Throw it away, forget yesterday, we'll make the great escape. We won't hear a word they say, they don't know us anyway. Watch it burn. Let it die. Cause we are finally free tonight

</p>
<h4>we'll make the great escape</h4>
Tonight will change our lives. It's so good to be by your side. But we'll cry. We won't give up the fight. We'll scream loud at the top of our lungs and they'll think it's just cause we're young. And we'll feel so alive.
<p>
Throw it away, forget yesterday, we'll make the great escape. We won't hear a word they say, they don't know us anyway. Watch it burn. Let it die. Cause we are finally free tonight
</p>
</div>
<p>

<a name="two"></a>
</p>
<div style="width: 600px; height: 400px; overflow: auto; text-align: center;">
<h1>section 2 *</h1>
</div>
<p>

<a name="three"></a>
</p>
<div style="width: 600px; height: 400px; overflow: auto; text-align: center;">
<h1>section 3 *</h1>
</div>
<p>

<a name="four"></a>
</p>
<div style="width: 600px; height: 400px; overflow: auto; text-align: center;">
<h1>section 4 *</h1>
</div>
<p>

<a name="five"></a>
</p>
<div style="width: 600px; height: 400px; overflow: auto; text-align: center;">
<h1>section 5 *</h1>
</div>
<p>

<a name="six"></a>
</p>
<div style="width: 600px; height: 400px; overflow: auto; text-align: center;">
<h1>section 6 *</h1>
</div>
</div>
</td>

<td width="200" valign="top">
<div style="width: 200px; height: 400px; overflow: auto; background-color: #ffffff; padding: 4px; text-align: center;">
<h1>Sidebar *</h1>
Tonight will change our lives. It's so good to be by your side. But we'll cry. We won't give up the fight. We'll scream loud at the top of our lungs and they'll think it's just cause we're young. And we'll feel so alive.
<p>
Throw it away, forget yesterday, we'll make the great escape. We won't hear a word they say, they don't know us anyway. Watch it burn. Let it die. Cause we are finally free tonight

</p>
<h1>Credit *</h1>
Layout by <a href="/~Riyvern">Vibe</a>.
</div>
</td>
</tr></table></center>
<center><table><tr><td width="811" valign="top">
<div style="width: 811px; height: auto; background-color: #ffffff; padding: 4px; text-align: center;">
<center><table width="811" cellspacing="5" cellpadding="0"><tr>
<td width="200">
<a href="#one" class="nav">Section 1</a>
</td>
<td width="200">
<a href="#two" class="nav">Section 2</a>
</td>
<td width="200">
<a href="#three" class="nav">Section 3</a>
</td>
<td width="200">
<a href="#four" class="nav">Section 4</a>
</td>
<td width="200">
<a href="#five" class="nav">Section 5</a>
</td>
<td width="200">
<a href="#six" class="nav">Section 6</a>
</td>
</tr></table></center>
</div>
</td></tr></table></center>

<style>
#CSSbyiKiwipop {
}
#MadeforVibe {
}
body {
	background: #ffbcee;
}
.sf {
	display: none;
}
table {
	background: transparent;
}
a:link, a:active, a:visited {
	font: 7.5pt verdana;
	color: #f43888;
	font-weight: bold;
}
a:hover {
	color: #ff9ec7;
}
a.nav:link, a.nav:visited, a.nav:active {
	font: 14px century gothic;
	font-weight: normal;
	color: #ffffff;
	text-decoration: none;
	display: block;
	background-color: #be6cf3;
	border-right: 10px solid #9b48d0;
	border-left: 10px solid #9b48d0;
	text-align: center;
	text-transform: uppercase;
}
a.nav:hover {
	font: 14px century gothic;
	font-weight: normal;
	color: #ffffff;
	background-color: #e7c1ff;
	border-right: 10px solid #9b48d0;
	border-left: 10px solid #9b48d0;
	text-align: center;
}
h1 {
	font-family: georgia;
	font-size: 32;
	font-weight: normal;
	color: #d698fd;
	text-align: left;
	border-bottom: 2px dashed #ffbcf9;
	border-top: 6px solid #ffffff;
	margin-top: 0px;
	margin-bottom: 6px;
	letter-spacing: -3px;
	text-transform: lowercase;
	padding-left: 5px;
	line-height: 16px;
}
h2 {
	font-family: georgia;
	font-size: 20;
	color: #ff55dd;
	font-weight: normal;
	text-align: left;
	letter-spacing: -2px;
	text-transform: lowercase;
	border-right: #a862d5 solid 50px;
	border-top: #a862d5 dashed 2px;
	padding-right: 10px;
	margin-top: 3px;
	margin-bottom: 6px;
}
h3 {
	font-family: century gothic;
	font-size: 18;
	color: #b33bff;
	font-weight: normal;
	text-align: left;
	letter-spacing: 1px;
	text-transform: lowercase;
	background-color: #ffc8f4;
	border-bottom: 2px solid #ff9aeb;
	line-height: 11px;
	padding-left: 10px;
	margin-bottom: 6px;
	margin-top: 3px;
}
h4 {
	font-family: leelawadee;
	font-size: 14;
	color: #d592ff;
	font-weight: normal;
	text-align: center;
	letter-spacing: 3px;
	text-transform: uppercase;
	border-bottom: #ff17e1 double 3px;
	padding-left: 5px;
	margin-bottom: 6px;
	margin-top: 3px;
}
tr, td, body, .text {
	font-family: verdana;
	font-size: 7.5pt;
	color: #939393;
}
textarea {
	font: 6pt verdana;
	color: #FFFFFF;
	background: #e5c3ff;
	border: 1px solid #d9a8ff;
	margin-bottom: 3px;
	height: 20px;
	width: 88px;
}
b {
	font: 7.5pt verdana;
	font-weight: bold;
	color: #7f18cf;
	letter-spacing: 1px;
}
i {
	font: 7.5pt verdana;
	font-weight: normal;
	font-style: italic;
	color: #ff9fc8;
}
.u {
	font: 7.5pt verdana;
	font-weight: normal;
	border-bottom: 1px solid #cd93f9;
	color: #cd93f9;
}
</style>
<p>
</p>
<center><table><tr>
<td width="600" valign="top">
<div style="width: 600px; height: 400px; overflow: hidden; background-color: #ffffff; padding: 4px; text-align: center;">
<a name="one"></a>
<div style="width: 600px; height: 400px; overflow: auto; text-align: center;">
<h1>the great escape *</h1>
<b>bold</b> <i>italic</i> <font class="u">underline <a href="/~rivyern">link</a>
<p>
Tonight will change our lives. It's so good to be by your side. But we'll cry. We won't give up the fight. We'll scream loud at the top of our lungs and they'll think it's just cause we're young. And we'll feel so alive.
</p>
<p>
Throw it away, forget yesterday, we'll make the great escape. We won't hear a word they say, they don't know us anyway. Watch it burn. Let it die. Cause we are finally free tonight

</p>
<h2>Throw it away</h2>
Tonight will change our lives. It's so good to be by your side. But we'll cry. We won't give up the fight. We'll scream loud at the top of our lungs and they'll think it's just cause we're young. And we'll feel so alive.
<p>
Throw it away, forget yesterday, we'll make the great escape. We won't hear a word they say, they don't know us anyway. Watch it burn. Let it die. Cause we are finally free tonight

</p>
<h3>Forget yesterday</h3>
Tonight will change our lives. It's so good to be by your side. But we'll cry. We won't give up the fight. We'll scream loud at the top of our lungs and they'll think it's just cause we're young. And we'll feel so alive.
<p>
Throw it away, forget yesterday, we'll make the great escape. We won't hear a word they say, they don't know us anyway. Watch it burn. Let it die. Cause we are finally free tonight

</p>
<h4>we'll make the great escape</h4>
Tonight will change our lives. It's so good to be by your side. But we'll cry. We won't give up the fight. We'll scream loud at the top of our lungs and they'll think it's just cause we're young. And we'll feel so alive.
<p>
Throw it away, forget yesterday, we'll make the great escape. We won't hear a word they say, they don't know us anyway. Watch it burn. Let it die. Cause we are finally free tonight
</p>
</font>
</div>
<p>

<a name="two"></a>
</p>
<div style="width: 600px; height: 400px; overflow: auto; text-align: center;">
<h1>section 2 *</h1>
</div>
<p>

<a name="three"></a>
</p>
<div style="width: 600px; height: 400px; overflow: auto; text-align: center;">
<h1>section 3 *</h1>
</div>
<p>

<a name="four"></a>
</p>
<div style="width: 600px; height: 400px; overflow: auto; text-align: center;">
<h1>section 4 *</h1>
</div>
<p>

<a name="five"></a>
</p>
<div style="width: 600px; height: 400px; overflow: auto; text-align: center;">
<h1>section 5 *</h1>
</div>
<p>

<a name="six"></a>
</p>
<div style="width: 600px; height: 400px; overflow: auto; text-align: center;">
<h1>section 6 *</h1>
</div>
</div>
</td>

<td width="200" valign="top">
<div style="width: 200px; height: 400px; overflow: auto; background-color: #ffffff; padding: 4px; text-align: center;">
<h1>Sidebar *</h1>
Tonight will change our lives. It's so good to be by your side. But we'll cry. We won't give up the fight. We'll scream loud at the top of our lungs and they'll think it's just cause we're young. And we'll feel so alive.
<p>
Throw it away, forget yesterday, we'll make the great escape. We won't hear a word they say, they don't know us anyway. Watch it burn. Let it die. Cause we are finally free tonight

</p>
<h1>Credit *</h1>
Layout by <a href="/~Riyvern">Vibe</a>.
</div>
</td>
</tr></table></center>
<center><table><tr><td width="811" valign="top">
<div style="width: 811px; height: auto; background-color: #ffffff; padding: 4px; text-align: center;">
<center><table width="811" cellspacing="5" cellpadding="0"><tr>
<td width="200">
<a href="#one" class="nav">Section 1</a>
</td>
<td width="200">
<a href="#two" class="nav">Section 2</a>
</td>
<td width="200">
<a href="#three" class="nav">Section 3</a>
</td>
<td width="200">
<a href="#four" class="nav">Section 4</a>
</td>
<td width="200">
<a href="#five" class="nav">Section 5</a>
</td>
<td width="200">
<a href="#six" class="nav">Section 6</a>
</td>
</tr></table></center>
</div>
</td></tr></table></center>

Good For: Sites / Role Play Characters / About Me Pages / Blogs / Guild Webbies, ect.
IE Compatible: Yes
Featured Song: The Great Escape by Boys Like Girls
Color Schemes: Cool Sensation / Faerie Princess / Feverish / Neon Ash
Notes: A simple anchored blog with a sidebar and navigation along the bottom. The headers add a touch of spiffiness to this style. This style is very easy to edit and is fully customize like all Vibe layouts.

Building Blocks

<style>
#CSSbyiKiwipop {
}
#MadeforVibe {
}
body {
	background: #ddbce6;
}
.sf {
	display: none;
}
table {
	background: transparent;
}
#save {
	top: 50px;
	left: 900px;
}
a:link, a:active, a:visited {
	font: 7.5pt verdana;
	color: #7dd8f6;
	font-weight: normal;
	text-decoration: none;
}
a:hover {
	color: #ffffff;
	background-color: #d6f5ff;
}
a.nav:link, a.nav:visited, a.nav:active {
	font: 18px georgia;
	font-weight: normal;
	color: transparent;
	background-color: transparent;
	border-left: 20px solid #c98cdb;
	text-decoration: none;
	display: block;
	margin-bottom: 3px;
	text-align: right;
	padding-right: 5px;
	text-transform: lowercase;
}
a.nav:hover {
	font: 18px georgia;
	font-weight: normal;
	color: #ffffff;
	background-color: #c98cdb;
}
a.nav2:link, a.nav2:visited, a.nav2:active {
	font: 18px georgia;
	font-weight: normal;
	color: transparent;
	background-color: transparent;
	border-left: 20px solid #96b5e3;
	text-decoration: none;
	display: block;
	margin-bottom: 3px;
	text-align: right;
	padding-right: 5px;
	text-transform: lowercase;
}
a.nav2:hover {
	font: 18px georgia;
	font-weight: normal;
	color: #ffffff;
	background-color: #96b5e3;
}
#title {
	top: 30px;
	left: 50px;
	height: auto;
	width: auto;
}
#main {
	top: 100px;
	left: 100px;
	width: 400px;
	height: 300px;
	overflow: hidden;
	background-color: #ffffff;
	border: 5px solid #ffffff;
	font: 7.5pt verdana;
	color: #9f949d;
	text-align: justify;
}
#navi {
	top: 100px;
	left: 520px;
	width: auto;
	height: auto;
	overflow: auto;
	font: 7.5pt verdana;
	color: #5f5c61;
	text-align: justify;
}
h1 {
	font-family: georgia;
	font-size: 32;
	font-weight: normal;
	color: #96b5e3;
	text-align: left;
	border-bottom: 2px solid #f2dff8;
	margin-top: 5px;
	margin-bottom: 6px;
	letter-spacing: -3px;
	text-transform: lowercase;
	line-height: 16px;
	padding-left: 10px;
}
h2 {
	font-family: georgia;
	font-size: 18;
	color: #d985f1;
	font-weight: normal;
	font-style: italic;
	text-align: right;
	text-transform: lowercase;
	border-bottom: #85c5f1 solid 1px;
	margin-top: 3px;
	margin-bottom: 6px;
	line-height: 18px;
	padding-right: 10px;
}
h3 {
	font-family: century gothic;
	font-size: 16;
	color: #85c5f1;
	font-weight: normal;
	text-align: center;
	letter-spacing: 1px;
	text-transform: uppercase;
	border-left: 20px double #a760bc;
	border-right: 20px double #a760bc;
	line-height: 18px;
	margin-bottom: 6px;
	margin-top: 3px;
}
h4 {
	font-family: century gothic;
	font-size: 14;
	color: #a760bc;
	font-weight: normal;
	text-align: center;
	letter-spacing: 3px;
	text-transform: uppercase;
	border-top: dashed 1px #7dd8f6;
	padding-left: 5px;
	margin-bottom: 6px;
	margin-top: 3px;
}
tr, td, body, .text {
	font-family: verdana;
	font-size: 7.5pt;
	color: #9f949d;
}
textarea {
	font: 6pt verdana;
	color: #FFFFFF;
	background: #ffddf7;
	border: 1px solid #f8c45f;
	margin-bottom: 3px;
	height: 20px;
	width: 88px;
}
b {
	font: 7.5pt verdana;
	font-weight: bold;
	color: #b327db;
	letter-spacing: 1px;
}
b.a {
	font: 52px century gothic;
	font-weight: normal;
	color: #ffffff;
	letter-spacing: 5px;
	text-transform: uppercase;
}
b.b {
	font: 52px georgia;
	font-weight: normal;
	font-style: italic;
	color: #af50cb;
	letter-spacing: 10px;
	text-transform: lowercase;
	padding-left: 15px;
}
i {
	font: 7.5pt verdana;
	font-weight: normal;
	font-style: italic;
	color: #ddbce6;
}
.u {
	font: 7.5pt verdana;
	font-weight: normal;
	border-bottom: 1px solid #4dc8fb;
	color: #4dc8fb;
}
</style>
<div id="title" style="position: absolute;">
<b class="a">I need a</b> <b class="b">Hero!</b>
</div>
<div id="main" style="position: absolute;">
<a name="one"></a>
<div style="width: 400px; height: 300px; overflow: auto;">
<h1>i need a hero to save me now *</h1>
<b>bold</b> <i>italic</i> <font class="u">underline</font> <a href="/~riyvern">link</a>
<p>
I'm just a step away. I'm just a breath away. Losing my faith today. Falling off the edge today.
</p>
<p>
I am just a man. Not superhuman. I'm not superhuman. Someone save me from the hate.
</p>
<p>
It's just another war. Just another family torn. Falling from my faith today. Just a step from the edge. Just another day in the world we live.

</p>
<h2>I need a hero, save me now</h2>
I've gotta fight today. To live another day. Speaking my mind today. My voice will be heard today.
<p>
I've gotta make a stand. But I am just a man. I'm not superhuman. My voice will be heard today.
</p>
<p>
It's just another war. Just another family torn. My voice will be heard today. It's just another kill.The countdown begins to destroy ourselves.

</p>
<h3>I need a hero to save my life</h3>
Who's gonna fight for what's right? Who's gonna help us survive? We're in the fight of our lives. And we're not ready to die.
<p>
Who's gonna fight for the weak? Who's gonna make 'em believe? I've got a hero, I've got a hero living in me.

</p>
<h4>A hero will save me just in time</h4>
I'm gonna fight for what's right. Today I'm speaking my mind. And if it kills me tonight, I will be ready to die.
<p>
A hero's not afraid to give his life. A hero's gonna save me just in time.
</p>
</div>

<a name="two"></a>
<div style="width: 400px; height: 300px; overflow: auto;">
<h1>Section 2</h1>
</div>

<a name="three"></a>
<div style="width: 400px; height: 300px; overflow: auto;">
<h1>Section 3</h1>
</div>

<a name="four"></a>
<div style="width: 400px; height: 300px; overflow: auto;">
<h1>Section 4</h1>
</div>

<a name="five"></a>
<div style="width: 400px; height: 300px; overflow: auto;">
<h1>Section 5</h1>
</div>

<a name="six"></a>
<div style="width: 400px; height: 300px; overflow: auto;">
<h1>Section 6</h1>
</div>
</div>
<div id="navi" style="position: absolute;">
<a href="#one" class="nav">section 1</a>
<a href="#two" class="nav2">section 2</a>
<a href="#three" class="nav">section 3</a>
<a href="#four" class="nav2">section 4</a>
<a href="#five" class="nav">section 5</a>
<a href="#six" class="nav2">section 6</a>
<a href="/~riyvern" class="nav">credit</a>
</div>
<div id="save" style="position: absolute;">
</div>

<style>
#CSSbyiKiwipop {
}
#MadeforVibe {
}
body {
	background: #525252;
}
.sf {
	display: none;
}
table {
	background: transparent;
}
#save {
	top: 50px;
	left: 900px;
}
a:link, a:active, a:visited {
	font: 7.5pt verdana;
	color: #f122b1;
	font-weight: normal;
	text-decoration: none;
}
a:hover {
	color: #ffffff;
	background-color: #ff88d9;
}
a.nav:link, a.nav:visited, a.nav:active {
	font: 18px georgia;
	font-weight: normal;
	color: transparent;
	background-color: transparent;
	border-left: 20px solid #9ee622;
	text-decoration: none;
	display: block;
	margin-bottom: 3px;
	text-align: right;
	padding-right: 5px;
	text-transform: lowercase;
}
a.nav:hover {
	font: 18px georgia;
	font-weight: normal;
	color: #ffffff;
	background-color: #9ee622;
}
a.nav2:link, a.nav2:visited, a.nav2:active {
	font: 18px georgia;
	font-weight: normal;
	color: transparent;
	background-color: transparent;
	border-left: 20px solid #ff8bda;
	text-decoration: none;
	display: block;
	margin-bottom: 3px;
	text-align: right;
	padding-right: 5px;
	text-transform: lowercase;
}
a.nav2:hover {
	font: 18px georgia;
	font-weight: normal;
	color: #ffffff;
	background-color: #ff8bda;
}
#title {
	top: 30px;
	left: 50px;
	height: auto;
	width: auto;
}
#main {
	top: 100px;
	left: 100px;
	width: 400px;
	height: 300px;
	overflow: hidden;
	background-color: #ffffff;
	border: 5px solid #ffffff;
	font: 7.5pt verdana;
	color: #9f949d;
	text-align: justify;
}
#navi {
	top: 100px;
	left: 520px;
	width: auto;
	height: auto;
	overflow: auto;
	font: 7.5pt verdana;
	color: #5f5c61;
	text-align: justify;
}
h1 {
	font-family: georgia;
	font-size: 32;
	font-weight: normal;
	color: #ff8ddb;
	text-align: left;
	border-bottom: 2px solid #e7ffbc;
	margin-top: 5px;
	margin-bottom: 6px;
	letter-spacing: -3px;
	text-transform: lowercase;
	line-height: 16px;
	padding-left: 10px;
}
h2 {
	font-family: georgia;
	font-size: 18;
	color: #a8d55a;
	font-weight: normal;
	font-style: italic;
	text-align: right;
	text-transform: lowercase;
	border-bottom: #fb9ede solid 1px;
	margin-top: 3px;
	margin-bottom: 6px;
	line-height: 18px;
	padding-right: 10px;
}
h3 {
	font-family: century gothic;
	font-size: 16;
	color: #ff55c9;
	font-weight: normal;
	text-align: center;
	letter-spacing: 1px;
	text-transform: uppercase;
	border-left: 20px double #a8d55a;
	border-right: 20px double #a8d55a;
	line-height: 18px;
	margin-bottom: 6px;
	margin-top: 3px;
}
h4 {
	font-family: century gothic;
	font-size: 14;
	color: #a1d743;
	font-weight: normal;
	text-align: center;
	letter-spacing: 3px;
	text-transform: uppercase;
	border-top: dashed 1px #ff55c9;
	padding-left: 5px;
	margin-bottom: 6px;
	margin-top: 3px;
}
tr, td, body, .text {
	font-family: verdana;
	font-size: 7.5pt;
	color: #9f949d;
}
textarea {
	font: 6pt verdana;
	color: #FFFFFF;
	background: #beed6d;
	border: 1px solid #deffa4;
	margin-bottom: 3px;
	height: 20px;
	width: 88px;
}
b {
	font: 7.5pt verdana;
	font-weight: bold;
	color: #9ee622;
	letter-spacing: 1px;
}
b.a {
	font: 52px century gothic;
	font-weight: normal;
	color: #ffffff;
	letter-spacing: 5px;
	text-transform: uppercase;
}
b.b {
	font: 52px georgia;
	font-weight: normal;
	font-style: italic;
	color: #9ee622;
	letter-spacing: 10px;
	text-transform: lowercase;
	padding-left: 15px;
}
i {
	font: 7.5pt verdana;
	font-weight: normal;
	font-style: italic;
	color: #f8a3dd;
}
.u {
	font: 7.5pt verdana;
	font-weight: normal;
	border-bottom: 1px solid #b9e866;
	color: #b9e866;
}
</style>
<div id="title" style="position: absolute;">
<b class="a">I need a</b> <b class="b">Hero!</b>
</div>
<div id="main" style="position: absolute;">
<a name="one"></a>
<div style="width: 400px; height: 300px; overflow: auto;">
<h1>i need a hero to save me now *</h1>
<b>bold</b> <i>italic</i> <font class="u">underline</font> <a href="/~riyvern">link</a>
<p>
I'm just a step away. I'm just a breath away. Losing my faith today. Falling off the edge today.
</p>
<p>
I am just a man. Not superhuman. I'm not superhuman. Someone save me from the hate.
</p>
<p>
It's just another war. Just another family torn. Falling from my faith today. Just a step from the edge. Just another day in the world we live.

</p>
<h2>I need a hero, save me now</h2>
I've gotta fight today. To live another day. Speaking my mind today. My voice will be heard today.
<p>
I've gotta make a stand. But I am just a man. I'm not superhuman. My voice will be heard today.
</p>
<p>
It's just another war. Just another family torn. My voice will be heard today. It's just another kill.The countdown begins to destroy ourselves.

</p>
<h3>I need a hero to save my life</h3>
Who's gonna fight for what's right? Who's gonna help us survive? We're in the fight of our lives. And we're not ready to die.
<p>
Who's gonna fight for the weak? Who's gonna make 'em believe? I've got a hero, I've got a hero living in me.

</p>
<h4>A hero will save me just in time</h4>
I'm gonna fight for what's right. Today I'm speaking my mind. And if it kills me tonight, I will be ready to die.
<p>
A hero's not afraid to give his life. A hero's gonna save me just in time.
</p>
</div>

<a name="two"></a>
<div style="width: 400px; height: 300px; overflow: auto;">
<h1>Section 2</h1>
</div>

<a name="three"></a>
<div style="width: 400px; height: 300px; overflow: auto;">
<h1>Section 3</h1>
</div>

<a name="four"></a>
<div style="width: 400px; height: 300px; overflow: auto;">
<h1>Section 4</h1>
</div>

<a name="five"></a>
<div style="width: 400px; height: 300px; overflow: auto;">
<h1>Section 5</h1>
</div>

<a name="six"></a>
<div style="width: 400px; height: 300px; overflow: auto;">
<h1>Section 6</h1>
</div>
</div>
<div id="navi" style="position: absolute;">
<a href="#one" class="nav">section 1</a>
<a href="#two" class="nav2">section 2</a>
<a href="#three" class="nav">section 3</a>
<a href="#four" class="nav2">section 4</a>
<a href="#five" class="nav">section 5</a>
<a href="#six" class="nav2">section 6</a>
<a href="/~riyvern" class="nav">credit</a>
</div>
<div id="save" style="position: absolute;">
</div>

Good For: Role Play Characters / About Me Pages / Blogs / Guild Webbies, ect.
IE Compatible: No
Featured Song: Hero by Skillet
Color Schemes: Cotton Candy / Toxic Gummi Bears / Orange Pop / Dusted Rose
Notes: This style obviously gets it's name from it's super cute block navigation. When hovered over, the blocks expand, revealing the name of the link. The large title attracts attention and the small blog area keeps all your content compact.

Stacked

<style>
#CSSbyiKiwipop {
}
#MadeforVibe {
}
body {
	background: #312e2e;
}
.sf {
	display: none;
}
table {
	background: transparent;
}
#save {
	top: 50px;
	left: 900px;
}
a:link, a:active, a:visited {
	font: 10.5px calibri;
	color: #c2ec04;
	font-weight: normal;
	text-decoration: none;
}
a:hover {
	color: #ffffff;
	background-color: #c2ec04;
}
a.nav:link, a.nav:visited, a.nav:active {
	font: 12px tahoma;
	font-weight: normal;
	color: #ffffff;
	background-color: #000000;
	text-decoration: none;
	display: block;
	text-align: center;
	padding: 2px;
	text-transform: lowercase;
}
a.nav:hover {
	font: 12px tahoma;
	font-weight: normal;
	color: #ffffff;
	background-color: #fd4992;
}
#title {
	top: 45px;
	left: 185px;
	height: auto;
	width: auto;
}
#main {
	top: 100px;
	left: 100px;
	width: 600px;
	height: 300px;
	overflow: hidden;
	background-color: #ffffff;
	border: 5px solid #ffffff;
	font: 10.5px calibri;
	color: #9f949d;
	text-align: justify;
}
#navi {
	top: 412px;
	left: 95px;
	width: auto;
	height: auto;
	overflow: auto;
	font: 10.5px calibri;
	color: #5f5c61;
	text-align: justify;
}
h1 {
	font-family: georgia;
	font-size: 32;
	font-weight: normal;
	color: #d4f906;
	text-align: left;
	border-bottom: 2px solid #ffecf0;
	margin-top: 5px;
	margin-bottom: 10px;
	letter-spacing: -3px;
	text-transform: lowercase;
	line-height: 16px;
	padding-left: 10px;
}
h2 {
	font-family: century gothic;
	font-size: 18;
	color: #f6ab44;
	font-weight: normal;
	text-align: left;
	text-transform: lowercase;
	border-bottom: #fdf984 solid 1px;
	margin-top: 3px;
	margin-bottom: 6px;
	line-height: 18px;
	padding-left: 10px;
}
tr, td, body, .text {
	font-family: calibri;
	font-size: 10.5px;
	color: #9f949d;
}
textarea {
	font: 6pt verdana;
	color: #FFFFFF;
	background: #c2ec04;
	border: 1px solid #ff8a56;
	margin-bottom: 3px;
	height: 20px;
	width: 88px;
}
b {
	font: 10.5px calibri;
	font-weight: bold;
	color: #803970;
}
b.a {
	font: 40px georgia;
	font-weight: normal;
	color: #ffffff;
	letter-spacing: 1px;
	text-transform: lowercase;
}
b.b {
	font: 40px georgia;
	font-weight: normal;
	font-style: italic;
	color: #fd4992;
	letter-spacing: 2px;
	padding-left: 15px;
	text-transform: lowercase;
}
i {
	font: 10.5px calibri;
	font-weight: normal;
	font-style: italic;
	color: #ed96bd;
}
.u {
	font: 10.5px calibri;
	font-weight: normal;
	border-bottom: 1px solid #ff8a56;
	color: #ff8a56;
}
</style>
<div id="title" style="position: absolute;">
<b class="a">the dj</b> <b class="b">will make you move </b> <b class="a"> *</b>
</div>
<div id="main" style="position: absolute;">
<a name="one"></a>
<div style="width: 600px; height: 300px; overflow: auto;">
<h1>tonight you will feel the grove*</h1>
<b>bold</b> <i>italic</i> <font class="u">underline</font> <a href="/">link</a>
<p>
The dj will make you move. Tonight you will feel the groove. The music, it sets you free. And dance to my melody.
</p>
<p>
The dj will make you move (makes me move). Tonight you will feel the groove (feel the groove). The music, it sets you free (sets me free). And dance to my melody (dance with me!)
</p>
<p>
The dj will make you move. Tonight you will feel the groove. The music, it sets you free. And dance to my melody.
</p>
<p>
The dj will make you move (makes me move). Tonight you will feel the groove (feel the groove). The music, it sets you free (sets me free). And dance to my melody (dance with me!)

</p>
<h2>the music, it sets you free</h2>
The dj will make you move. Tonight you will feel the groove. The music, it sets you free. And dance to my melody.
<p>
The dj will make you move (makes me move). Tonight you will feel the groove (feel the groove). The music, it sets you free (sets me free). And dance to my melody (dance with me!)
</p>
<p>
The dj will make you move. Tonight you will feel the groove. The music, it sets you free. And dance to my melody.
</p>
<p>
The dj will make you move (makes me move). Tonight you will feel the groove (feel the groove). The music, it sets you free (sets me free). And dance to my melody (dance with me!)
</p>
</div>

<a name="two"></a>
<div style="width: 600px; height: 300px; overflow: auto;">
<h1>section two*</h1>
</div>

<a name="three"></a>
<div style="width: 600px; height: 300px; overflow: auto;">
<h1>section three*</h1>
</div>

<a name="four"></a>
<div style="width: 600px; height: 300px; overflow: auto;">
<h1>section four*</h1>
</div>

<a name="five"></a>
<div style="width: 600px; height: 300px; overflow: auto;">
<h1>section five*</h1>
</div>
</div>
<div id="navi" style="position: absolute;">
<table cellspacing="5" cellpadding="0">
<tr>
<td width="200">
<a href="#one" class="nav">section one</a>
</td>
<td width="200">
<a href="#two" class="nav">section two</a>
</td>
<td width="200">
<a href="#three" class="nav">section three</a>
</td>
</tr>
<tr>
<td width="200">
<a href="#four" class="nav">section four</a>
</td>
<td width="200">
<a href="#five" class="nav">section five</a>
</td>
<td width="200">
<a href="/~riyvern" class="nav">css</a>
</td>
</tr>
</table>
</div>
<div id="save" style="position: absolute;">	
</div>

<style>
#CSSbyiKiwipop {
}
#MadeforVibe {
}
body {
	background: #8e6565;
}
.sf {
	display: none;
}
table {
	background: transparent;
}
#save {
	top: 50px;
	left: 900px;
}
a:link, a:active, a:visited {
	font: 10.5px calibri;
	color: #a77373;
	font-weight: normal;
	text-decoration: none;
}
a:hover {
	color: #ffffff;
	background-color: #c99c9c;
}
a.nav:link, a.nav:visited, a.nav:active {
	font: 12px tahoma;
	font-weight: normal;
	color: #ffffff;
	background-color: #a77373;
	text-decoration: none;
	display: block;
	text-align: center;
	padding: 2px;
	text-transform: lowercase;
}
a.nav:hover {
	font: 12px tahoma;
	font-weight: normal;
	color: #ffffff;
	background-color: #c99c9c;
}
#title {
	top: 45px;
	left: 185px;
	height: auto;
	width: auto;
}
#main {
	top: 100px;
	left: 100px;
	width: 600px;
	height: 300px;
	overflow: hidden;
	background-color: #6f4242;
	border: 5px solid #6f4242;
	font: 10.5px calibri;
	color: #dbbfbf;
	text-align: justify;
}
#navi {
	top: 412px;
	left: 95px;
	width: auto;
	height: auto;
	overflow: auto;
	font: 10.5px calibri;
	color: #5f5c61;
	text-align: justify;
}
h1 {
	font-family: georgia;
	font-size: 32;
	font-weight: normal;
	color: #e7d38f;
	text-align: left;
	border-bottom: 2px solid #8e6060;
	margin-top: 5px;
	margin-bottom: 10px;
	letter-spacing: -3px;
	text-transform: lowercase;
	line-height: 16px;
	padding-left: 10px;
}
h2 {
	font-family: century gothic;
	font-size: 18;
	color: #bf6161;
	font-weight: normal;
	text-align: left;
	text-transform: lowercase;
	border-bottom: #debb70 solid 1px;
	margin-top: 3px;
	margin-bottom: 6px;
	line-height: 18px;
	padding-left: 10px;
}
tr, td, body, .text {
	font-family: calibri;
	font-size: 10.5px;
	color: #dbbfbf;
}
textarea {
	font: 6pt verdana;
	color: #FFFFFF;
	background: #debb70;
	border: 1px solid #b76262;
	margin-bottom: 3px;
	height: 20px;
	width: 88px;
}
b {
	font: 10.5px calibri;
	font-weight: bold;
	color: #cfa343;
}
b.a {
	font: 40px georgia;
	font-weight: normal;
	color: #ffffff;
	letter-spacing: 1px;
	text-transform: lowercase;
}
b.b {
	font: 40px georgia;
	font-weight: normal;
	font-style: italic;
	color: #ecd29a;
	letter-spacing: 2px;
	padding-left: 15px;
	text-transform: lowercase;
}
i {
	font: 10.5px calibri;
	font-weight: normal;
	font-style: italic;
	color: #cf6843;
}
.u {
	font: 10.5px calibri;
	font-weight: normal;
	border-bottom: 1px solid #ecd29a;
	color: #ecd29a;
}
</style>
<div id="title" style="position: absolute;">
<b class="a">the dj</b> <b class="b">will make you move </b> <b class="a"> *</b>
</div>
<div id="main" style="position: absolute;">
<a name="one"></a>
<div style="width: 600px; height: 300px; overflow: auto;">
<h1>tonight you will feel the grove*</h1>
<b>bold</b> <i>italic</i> <font class="u">underline</font> <a href="/">link</a>
<p>
The dj will make you move. Tonight you will feel the groove. The music, it sets you free. And dance to my melody.
</p>
<p>
The dj will make you move (makes me move). Tonight you will feel the groove (feel the groove). The music, it sets you free (sets me free). And dance to my melody (dance with me!)
</p>
<p>
The dj will make you move. Tonight you will feel the groove. The music, it sets you free. And dance to my melody.
</p>
<p>
The dj will make you move (makes me move). Tonight you will feel the groove (feel the groove). The music, it sets you free (sets me free). And dance to my melody (dance with me!)

</p>
<h2>the music, it sets you free</h2>
The dj will make you move. Tonight you will feel the groove. The music, it sets you free. And dance to my melody.
<p>
The dj will make you move (makes me move). Tonight you will feel the groove (feel the groove). The music, it sets you free (sets me free). And dance to my melody (dance with me!)
</p>
<p>
The dj will make you move. Tonight you will feel the groove. The music, it sets you free. And dance to my melody.
</p>
<p>
The dj will make you move (makes me move). Tonight you will feel the groove (feel the groove). The music, it sets you free (sets me free). And dance to my melody (dance with me!)
</p>
</div>

<a name="two"></a>
<div style="width: 600px; height: 300px; overflow: auto;">
<h1>section two*</h1>
</div>

<a name="three"></a>
<div style="width: 600px; height: 300px; overflow: auto;">
<h1>section three*</h1>
</div>

<a name="four"></a>
<div style="width: 600px; height: 300px; overflow: auto;">
<h1>section four*</h1>
</div>

<a name="five"></a>
<div style="width: 600px; height: 300px; overflow: auto;">
<h1>section five*</h1>
</div>
</div>
<div id="navi" style="position: absolute;">
<table cellspacing="5" cellpadding="0">
<tr>
<td width="200">
<a href="#one" class="nav">section one</a>
</td>
<td width="200">
<a href="#two" class="nav">section two</a>
</td>
<td width="200">
<a href="#three" class="nav">section three</a>
</td>
</tr>
<tr>
<td width="200">
<a href="#four" class="nav">section four</a>
</td>
<td width="200">
<a href="#five" class="nav">section five</a>
</td>
<td width="200">
<a href="/~riyvern" class="nav">css</a>
</td>
</tr>
</table>
</div>
<div id="save" style="position: absolute;">	
</div>

Good For: Sites / Role Play Characters / About Me Pages / Guild Webbies, ect.
IE Compatible: No
Featured Song: Make You Move by DJ S3RL
Color Schemes: Kidd Sykle / Chocolate & Caramel
Notes:
A six sectioned blog with a large title overtop the main content. The content area is wide enough for large images and can easily be made taller if needed. The color schemes for this style are certainly different and eye catching.

Cutting Edge

<style>
#CSSbyiKiwipop {
}
#MadeforVibe {
}
body {
	background: #333333;
}
.sf {
	display: none;
}
table {
	background: transparent;
}
#save {
	top: 50px;
	left: 900px;
}
a:link, a:active, a:visited {
	font: 10.5px calibri;
	color: #f927d4;
	font-weight: normal;
	text-decoration: none;
}
a:hover {
	color: #ffffff;
	background-color: #f927d4;
}
a.nav:link, a.nav:visited, a.nav:active {
	font: 5pt small fonts;
	font-weight: normal;
	color: #ffffff;
	background-color: #202020;
	text-decoration: none;
	display: block;
	text-align: center;
	padding: 3px;
	text-transform: uppercase;
}
a.nav:hover {
	color: #ffffff;
	background-color: #f927d4;
}
#title {
	top: 452px;
	left: 185px;
	height: auto;
	width: auto;
	z-index: 2;
}
#shadow {
	top: 454px;
	left: 187px;
	height: auto;
	width: auto;
	z-index: 1;
}
#image {
	top: 20px;
	left: 21px;
	height: 390px;
	width: 438px;
	padding: 5px;
	background-color: #202020;
	z-index: 1;
}
#main {
	top: 70px;
	left: 469px;
	width: 430px;
	height: 375px;
	overflow: hidden;
	background-color: #202020;
	border: 5px solid #202020;
	font: 10.5px calibri;
	color: #9f949d;
	text-align: justify;
}
#navi {
	top: 51px;
	left: 475px;
	width: auto;
	height: auto;
	overflow: auto;
	font: 10.5px calibri;
	color: #5f5c61;
	text-align: justify;
}
h1 {
	font-family: arial;
	font-size: 26;
	font-weight: normal;
	color: #f8f12e;
	text-align: left;
	border-bottom: 2px solid #808080;
	margin-top: 5px;
	margin-bottom: 10px;
	text-transform: lowercase;
	letter-spacing: -2px;
	line-height: 16px;
	padding-left: 10px;
}
h2 {
	font-family: century gothic;
	font-size: 18;
	color: #f927d4;
	font-weight: normal;
	text-align: left;
	text-transform: lowercase;
	border-bottom: #3db334 dashed 1px;
	margin-top: 3px;
	margin-bottom: 6px;
	line-height: 18px;
	padding-left: 10px;
}
tr, td, body, .text {
	font-family: calibri;
	font-size: 10.5px;
	color: #9f949d;
}
textarea {
	font: 6pt verdana;
	color: #000000;
	background: #424242;
	border: 1px solid #111111;
	margin-bottom: 3px;
	height: 20px;
	width: 88px;
}
b {
	font: 10.5px calibri;
	font-weight: bold;
	color: #4fb3ad;
}
b.a {
	font: 40px impact;
	font-weight: normal;
	font-style: italic;
	color: #4fb3ad;
	letter-spacing: 1px;
	text-transform: uppercase;
}
b.b {
	font: 40px impact;
	font-weight: normal;
	font-style: italic;
	color: #000000;
	letter-spacing: 1px;
	text-transform: uppercase;
}
i {
	font: 10.5px calibri;
	font-weight: normal;
	font-style: italic;
	color: #f8f12e;
}
.u {
	font: 10.5px calibri;
	font-weight: normal;
	border-bottom: 1px solid #d7fffd;
	color: #d7fffd;
}
</style>
<div id="image" style="position: absolute;">
<img src="http://i56.tinypic.com/2us7wax.jpg">
</div>
<div id="title" style="position: absolute;">
<b class="a">written in the stars, a million miles away</b>
</div>
<div id="shadow" style="position: absolute;">
<b class="b">written in the stars, a million miles away</b>
</div>
<div id="main" style="position: absolute;">
<a name="one"></a>
<div style="width: 430px; height: 375px; overflow: auto;">
<h1>a message to the main</h1>
<b>bold</b> <i>italic</i> <font class="u">underline</font> <a href="/">link</a>
<p>
Oh written in the stars, A million miles away. A message to the main. Ooooh. Seasons come and go, But I will never change. And I'm on my way.
</p>
<p>
Oh written in the stars, A million miles away. A message to the main. Ooooh. Seasons come and go, But I will never change. And I'm on my way.
</p>
<p>
Oh written in the stars, A million miles away. A message to the main. Ooooh. Seasons come and go, But I will never change. And I'm on my way.
</p>
<p>
Oh written in the stars, A million miles away. A message to the main. Ooooh. Seasons come and go, But I will never change. And I'm on my way.
</p>
<p>
Oh written in the stars, A million miles away. A message to the main. Ooooh. Seasons come and go, But I will never change. And I'm on my way.
</p>
<p>

</p>
<h2>Seasons come and go, but i'll never change</h2>
<p>
Oh written in the stars, A million miles away. A message to the main. Ooooh. Seasons come and go, But I will never change. And I'm on my way.
</p>
<p>
Oh written in the stars, A million miles away. A message to the main. Ooooh. Seasons come and go, But I will never change. And I'm on my way.
</p>
<p>
Oh written in the stars, A million miles away. A message to the main. Ooooh. Seasons come and go, But I will never change. And I'm on my way.
</p>
<p>
Oh written in the stars, A million miles away. A message to the main. Ooooh. Seasons come and go, But I will never change. And I'm on my way.
</p>
<p>
Oh written in the stars, A million miles away. A message to the main. Ooooh. Seasons come and go, But I will never change. And I'm on my way.
</p>
<p>
</p>
</div>

<a name="two"></a>
<div style="width: 430px; height: 375px; overflow: auto;">
<h1>section two*</h1>
</div>

<a name="three"></a>
<div style="width: 430px; height: 375px; overflow: auto;">
<h1>section three*</h1>
</div>

<a name="four"></a>
<div style="width: 430px; height: 375px; overflow: auto;">
<h1>section four*</h1>
</div>

<a name="five"></a>
<div style="width: 430px; height: 375px; overflow: auto;">
<h1>section five*</h1>
</div>
</div>
<div id="navi" style="position: absolute;">
<table cellspacing="5" cellpadding="0"><tr>
<td>
<a href="#one" class="nav">section one</a>
</td>
<td>
<a href="#two" class="nav">section two</a>
</td>
<td>
<a href="#three" class="nav">section three</a>
</td>
<td>
<a href="#four" class="nav">section four</a>
</td>
<td>
<a href="#five" class="nav">section five</a>
</td>
<td>
<a href="/~riyvern" class="nav">css</a>
</td>
</tr></table>
</div>
<div id="save" style="position: absolute;">	
</div>

Good For: Role Play Characters / About Me Pages / Sites / Guild Webbies, ect.
IE Compatible: No
Featured Song: Written In The Stars by Tinie Tempah feat. Eric Turner
Color Schemes: Xilex
Notes: This style offers a spot for a very large image and loads of content. The small navigation and large title contrast each other. The "dropshadow" on the title makes the title stand out a little more.

Picture It v.2

<style>
#CSSbyiKiwipop {
}
#MadeforVibe {
}
body {
	background: #f6f3fd;
}
.sf {
	display: none;
}
table {
	background: transparent;
}
a:link, a:active, a:visited {
	font: 7.5pt verdana;
	color: #70a5c6;
	font-weight: normal;
	text-decoration: none;
}
a:hover {
	color: #a7f9ca;
}
a.nav:link, a.nav:visited, a.nav:active {
	font: 5pt small fonts;
	font-weight: normal;
	color: #ffffff;
	background-color: #73a2c7;
	text-decoration: none;
	display: block;
	text-align: center;
	padding: 3px;
	text-transform: uppercase;
}
a.nav:hover {
	color: #ffffff;
	background-color: #a8cbe7;
}
h1 {
	font-family: arial;
	font-size: 26;
	font-weight: normal;
	color: #827ad2;
	text-align: right;
	border-bottom: 2px solid #e9e9ef;
	margin-top: 10px;
	margin-bottom: 10px;
	text-transform: lowercase;
	letter-spacing: -2px;
	line-height: 16px;
	padding-left: 10px;
}
h2 {
	font-family: century gothic;
	font-size: 14;
	color: #09cd53;
	font-weight: normal;
	text-align: left;
	text-transform: uppercase;
	border-bottom: #e9e9ef solid 1px;
	margin-top: 10px;
	margin-bottom: 6px;
	line-height: 18px;
	padding-left: 10px;
}
tr, td, body, .text {
	font-family: verdana;
	font-size: 7.5pt;
	color: #bbbbbc;
}
textarea {
	font: 6pt verdana;
	color: #cfcdd2;
	background: #f7f4fe;
	border: 1px solid #cfcdd2;
	margin-bottom: 3px;
	height: 20px;
	width: 88px;
}
img.pic {
	border: 5px solid #dfdce7;
}
b {
	font: 7.5pt verdana;
	font-weight: bold;
	color: #1f5be4;
}
b.a {
	font: 40px impact;
	font-weight: normal;
	color: #11b15c;
	letter-spacing: 1px;
	text-transform: uppercase;
}
b.b {
	font: 60px arial;
	font-weight: normal;
	color: #e9e9ef;
	letter-spacing: 1px;
	text-transform: uppercase;
}
i {
	font: 7.5pt verdana;
	font-weight: normal;
	font-style: italic;
	color: #78c7ce;
}
.u {
	font: 7.5pt verdana;
	font-weight: normal;
	border-bottom: 1px dashed #7eeebb;
	color: #7eeebb;
}
</style>
<p>
</p>
<center>
<b class="b">{</b> <b class="a">Stars Shining Out</b> <b class="b">}</b>
</center>
<center><table cellspacing="5" cellpadding="0"><tr>
<td>
<a href="#one" class="nav">section one</a>
</td>
<td>
<a href="#two" class="nav">section two</a>
</td>
<td>
<a href="#three" class="nav">section three</a>
</td>
<td>
<a href="#four" class="nav">section four</a>
</td>
<td>
<a href="#five" class="nav">section five</a>
</td>
<td>
<a href="/~riyvern" class="nav">css</a>
</td>
</tr></table></center>
<center>
<table><td valign="top"><div style="width: 705px; height: 350px; overflow: hidden;">
<a name="one"></a>
<div style="width: 700px; height: 350px; overflow: auto; text-align: justify; padding-right: 5px;">
<h1>section 1 *</h1>
<center><table cellspacing="10" cellpadding="0">
<td><img src="http://i52.tinypic.com/2ptqtco.jpg" class="pic"></td>
<td valign="top">
<b>bold</b> <i>italic</i> <font class="u">underline</font> <a href="/">link</a>
<p>
kokoro ga samayou daremo inai heya hitori. kawaite yuku. nakushita mama no kokoro no kagi. mikazuki no yoru ni. sagashite iru.
</p>
<p>
I'm sinking now, sinking now, sinking now. mado wo akete miagereba .I'm screaming now, screaming now, screaming now. haruka kanata hoshi ga mau.
</p>
<p>
Stars shining Out. Stars shining Out. furisosogu hikari terashidasu michi. mou mayowanai matataki ga michibiku.


</p>
<h2>i'm screaming now, screaming now, screaming now</h2>
yamenai arasoi atama ga kokoro ga itsumo. shibaritsukeru. kokoro no koe wo kakikesu kono zatsuon wo tomete. sukuidashite.
<p>
I'm sinking now, sinking now, sinking now. mado wo akete miagereba
I'm screaming now, screaming now, screaming now. hoshi ga namida tokashite yuku 
</p>
</td>
</table></center>
Stars shining Out. Stars shining Out. kirameku kagayaki afuredasu ai. mou nakanai kokoro no uta hajimaru. I'm sinking now, sinking now, sinking now. mado wo akete miagereba. I'm screaming now, screaming now, screaming now. haruka kanata hoshi ga mau. Stars shining Out. Stars shining Out. Stars shining Out. Stars shining Out. furisosogu hikari terashidasu michi. mou mayowanai matataki ga michibiku.

<h1>I'm sinking now, sinking now, sinking now *</h1>
<center><table cellspacing="10" cellpadding="0">
<td valign="top">
<b>bold</b> <i>italic</i> <font class="u">underline</font> <a href="/">link</a>
<p>
kokoro ga samayou daremo inai heya hitori. kawaite yuku. nakushita mama no kokoro no kagi. mikazuki no yoru ni. sagashite iru.
</p>
<p>
I'm sinking now, sinking now, sinking now. mado wo akete miagereba .I'm screaming now, screaming now, screaming now. haruka kanata hoshi ga mau.
</p>
<p>
Stars shining Out. Stars shining Out. furisosogu hikari terashidasu michi. mou mayowanai matataki ga michibiku.
</p>
<p>
yamenai arasoi atama ga kokoro ga itsumo. shibaritsukeru. kokoro no koe wo kakikesu kono zatsuon wo tomete. sukuidashite.
</p>
<p>
I'm sinking now, sinking now, sinking now. mado wo akete miagereba
I'm screaming now, screaming now, screaming now. hoshi ga namida tokashite yuku 
</p>
</td>
<td><img src="http://i52.tinypic.com/2ptqtco.jpg" class="pic"></td>
</table></center>

<h2>i'm screaming now, screaming now, screaming now</h2>
Stars shining Out. Stars shining Out. kirameku kagayaki afuredasu ai. mou nakanai kokoro no uta hajimaru. I'm sinking now, sinking now, sinking now. mado wo akete miagereba. I'm screaming now, screaming now, screaming now. haruka kanata hoshi ga mau. Stars shining Out. Stars shining Out. Stars shining Out. Stars shining Out. furisosogu hikari terashidasu michi. mou mayowanai matataki ga michibiku.
</div>

<a name="two"></a>
<div style="width: 700px; height: 350px; overflow: auto; text-align: justify; padding-right: 5px;">
<h1>section 2 *</h1>
</div>

<a name="three"></a>
<div style="width: 700px; height: 350px; overflow: auto; text-align: justify; padding-right: 5px;">
<h1>section 3 *</h1>
</div>

<a name="four"></a>
<div style="width: 700px; height: 350px; overflow: auto; text-align: justify; padding-right: 5px;">
<h1>section 4 *</h1>
</div>

<a name="five"></a>
<div style="width: 700px; height: 350px; overflow: auto; text-align: justify; padding-right: 5px;">
<h1>section 5 *</h1>
</div>
</div></td></table>
</center>

Good For: Sites / Role Play Characters / About Me Pages / Blogs / Guild Webbies, ect.
IE Compatible: Yes
Featured Song: Stars Shining Out by Trapnest
Color Schemes: Boyish
Notes: Simple and streamline, this alternate version of the original Picture It is anchored to offer a more organized way to display tons of content. Images are easy to add and will be padded with a soft border to make them stand out.

Moving Boxes v.2

<style>
#CSSbyiKiwipop {
}
#MadeforVibe {
}
body {
	background: #f2d8ff url("http://i54.tinypic.com/288s22v.jpg") top left repeat-x fixed;
}
.sf {
	display: none;
}
table {
	background: transparent;
}
a:link, a:active, a:visited {
	font: 7.5pt verdana;
	color: #061dc8;
	font-weight: bold;
	text-decoration: none;
}
a:hover {
	color: #5868db;
}
a.nav:link, a.nav:visited, a.nav:active {
	font: 11px arial;
	font-weight: normal;
	color: #b467e1;
	text-decoration: none;
	display: block;
	background-color: transparent;
	border-bottom: 1px solid #cfa0ea;
	text-align: left;
	margin: 1px;
	letter-spacing: 1px;
	text-transform: uppercase;
	padding-left: 5px;
}
a.nav:hover {
	color: #ffffff;
	background-color: #cfa0ea;
}
#main {
	margin-top: 30px;
	margin-bottom: 15px;
	width: 700px;
	height: 390px;
	overflow: hidden;
	background: #a791b3;
	border: 5px solid #a791b3;
	text-align: center;
}
.content {
	width: 700px;
	height: 390px;
	overflow: auto;
	background: #e8bfef;
}
#footer {
	bottom: 0px;
	left: 0px;
	width: 99.9%;
	height: auto;
	background: #f0dbf3;
	text-align: center;
}
h1 {
	font-family: arial;
	font-size: 32;
	font-weight: normal;
	color: #e8bfef;
	background: #a791b3;
	text-align: left;
	margin-top: 0px;
	margin-bottom: 5px;
	letter-spacing: -4px;
	text-transform: uppercase;
	padding-top: 5px;
	padding-left: 5px;
	line-height: 20px;
}
h2 {
	font-family: arial;
	font-size: 18;
	color: #a791b3;
	background: #e8bfef;
	font-weight: normal;
	text-align: center;
	letter-spacing: -1px;
	border-bottom: 3px solid #a791b3;
	text-transform: lowercase;
	margin-top: 5px;
	margin-bottom: 6px;
}
h3 {
	font-family: arial;
	font-size: 12;
	color: #bb21e7;
	font-weight: normal;
	text-align: left;
	background: #f0dbf3;
	letter-spacing: 1px;
	padding-left: 2px;
	text-transform: uppercase;
	line-height: 13px;
	margin-bottom: 6px;
	margin-top: 5px;
}
tr, td, body, .text {
	font-family: verdana;
	font-size: 7.5pt;
	color: #746383;
}
textarea {
	font: 6pt verdana;
	color: #c19cd4;
	background: #f2d8ff;
	border: 1px solid #c19cd4;
	margin-bottom: 3px;
	height: 20px;
	width: 88px;
}
img.banner {
	border: 5px solid #e8bfef;
	background: #e8bfef;
}
b {
	font: 7.5pt verdana;
	font-weight: normal;
	color: #4e2c94;
	text-transform: uppercase;
}
i {
	font: 7.5pt verdana;
	font-weight: normal;
	font-style: italic;
	color: #5aa754;
}
.u {
	font: 7.5pt verdana;
	font-weight: normal;
	border-bottom: 1px solid #a85940;
	color: #a85940;
}
</style>
<p>
</p>
<center>
<div id="main">
<a name="1"></a>
<div class="content">
<h1>Header One</h1>
<b>bold</b> <i>italics</i> <font class="u">underline</font> <a href="/">link</a>
<p>
I feel so close to you right now. It's a force field. I wear my heart upon my sleeve, like a big deal. Your love pours down on me, surround me like a waterfall. And there's no stopping us right now. I feel so close to you right now.
</p>
<p>
I feel so close to you right now. It's a force field. I wear my heart upon my sleeve, like a big deal. Your love pours down on me, surround me like a waterfall. And there's no stopping us right now. I feel so close to you right now.
</p>
<p>
I feel so close to you right now. It's a force field. I wear my heart upon my sleeve, like a big deal. Your love pours down on me, surround me like a waterfall. And there's no stopping us right now. I feel so close to you right now.
</p>
<p>
I feel so close to you right now. It's a force field. I wear my heart upon my sleeve, like a big deal. Your love pours down on me, surround me like a waterfall. And there's no stopping us right now. I feel so close to you right now.
</p>
<p>
And there's no stopping us right now. And there's no stopping us right now. And there's no stopping us right now. I feel so close to you right now... 
</p>

<h2>I feel so close to you right now</h2>
I feel so close to you right now. It's a force field. I wear my heart upon my sleeve, like a big deal. Your love pours down on me, surround me like a waterfall. And there's no stopping us right now. I feel so close to you right now.

<p>
I feel so close to you right now. It's a force field. I wear my heart upon my sleeve, like a big deal. Your love pours down on me, surround me like a waterfall. And there's no stopping us right now. I feel so close to you right now.
</p>
<p>
And there's no stopping us right now. And there's no stopping us right now. And there's no stopping us right now. I feel so close to you right now... 
I feel so close to you right now. It's a force field. I wear my heart upon my sleeve, like a big deal. Your love pours down on me, surround me like a waterfall. And there's no stopping us right now. I feel so close to you right now.
</p>
<p>
I feel so close to you right now. It's a force field. I wear my heart upon my sleeve, like a big deal. Your love pours down on me, surround me like a waterfall. And there's no stopping us right now. I feel so close to you right now.
</p>
<p>
I feel so close to you right now. It's a force field. I wear my heart upon my sleeve, like a big deal. Your love pours down on me, surround me like a waterfall. And there's no stopping us right now. I feel so close to you right now.
</p>
<p>
I feel so close to you right now. It's a force field. I wear my heart upon my sleeve, like a big deal. Your love pours down on me, surround me like a waterfall. And there's no stopping us right now. I feel so close to you right now.
</p>
<p>
And there's no stopping us right now. And there's no stopping us right now. And there's no stopping us right now. I feel so close to you right now... 

</p>
<h3>header three</h3>
I feel so close to you right now. It's a force field. I wear my heart upon my sleeve, like a big deal. Your love pours down on me, surround me like a waterfall. And there's no stopping us right now. I feel so close to you right now.

<p>
I feel so close to you right now. It's a force field. I wear my heart upon my sleeve, like a big deal. Your love pours down on me, surround me like a waterfall. And there's no stopping us right now. I feel so close to you right now.
</p>
<p>
And there's no stopping us right now. And there's no stopping us right now. And there's no stopping us right now. I feel so close to you right now... 
</p>
</div>

<a name="2"></a>
<div class="content">
<h1>section 2</h1>
</div>


<a name="3"></a>
<div class="content">
<h1>section 3</h1>
</div>


<a name="4"></a>
<div class="content">
<h1>section 4</h1>
</div>


<a name="5"></a>
<div class="content">
<h1>section 5</h1>
</div>


<a name="6"></a>
<div class="content">
<h1>section 6</h1>
</div>


<a name="7"></a>
<div class="content">
<h1>section 7</h1>
</div>


<a name="8"></a>
<div class="content">
<h1>section 8</h1>
</div>


<a name="9"></a>
<div class="content">
<h1>section 9</h1>
</div>


<a name="10"></a>
<div class="content">
<h1>section 10</h1>
</div>


<a name="11"></a>
<div class="content">
<h1>section 11</h1>
</div>
</div>
<br><br><br><br><div id="footer" style="position: fixed;">
<center><table cellspacing="10" cellpadding="0"><tr>
<td valign="top">
<img src="http://i46.tinypic.com/2yto4rc.jpg" class="banner">
</td>
<td valign="top" width="500">
<div style="width: 500px; height: 100px; overflow: -blocked-; text-align: justify;">
I feel so close to you right now. It's a force field. I wear my heart upon my sleeve, like a big deal. Your love pours down on me, surround me like a waterfall. And there's no stopping us right now. I feel so close to you right now. I feel so close to you right now. It's a force field. I wear my heart upon my sleeve, like a big deal. Your love pours down on me, surround me like a waterfall. And there's no stopping us right now. I feel so close to you right now. And there's no stopping us right now. And there's no stopping us right now. And there's no stopping us right now. I feel so close to you right now... 
</div>
</td>
<td valign="top">
<table>
<td width="150">
<a href="#1" class="nav">Section 1</a>
<a href="#2" class="nav">Section 2</a>
<a href="#3" class="nav">Section 3</a>
<a href="#4" class="nav">Section 4</a>
<a href="#5" class="nav">Section 5</a>
<a href="#6" class="nav">Section 6</a>
</td>
<td width="150">
<a href="#7" class="nav">Section 7</a>
<a href="#8" class="nav">Section 8</a>
<a href="#9" class="nav">Section 9</a>
<a href="#10" class="nav">Section 10</a>
<a href="#11" class="nav">Section 11</a>
<a href="/~riyvern" class="nav">css</a>
</td>
</table>
</td>
</tr></table></center>
</div>
</center>

Good For: Role Play Characters / About Me Pages / Blogs / Sites / Guild Webbies, ect.
IE Compatible: Yes No
Featured Song: Feel So Close by Clavin Harris
Color Schemes: Royal Hues
Notes: Just like the original, this version of Moving Boxes is more compact and organized. The footer will stay at the bottom of the page where the navigation, introduction and banner are always visible. Add or remove sections to fit your needs. This layout does not work in Internet Explorer.