Layouts.

Before using any of my layouts, make sure you read the rules first! All my layouts look best in Mozilla Firefox.

[ Keys & Info ]

Drag and Drop
You'll have to drag and drop the preview images into your browser to see them at full view.

Compatibility:
Beside the name of each layout, you'll see the logo of the browser that specific style is compatible with.
Mozilla Firefox
Internet Explorer

Style Stats:
Beside the the coding of the first color scheme of every style is a list of stats. These stats will tell you what each layout is good for(although you can use any of them for whatever you want), what song I used in the layout, and the names of each color scheme.

Notes:
In the style stats you'll see some notes on each layout. These will usually be information on the spiffy features a layout might have.

Favorites:
Besides the name of each layout and the compatibility, you might see a little heart. Any layouts marked with a heart are ones that I love.
Favorite Layout

[ Getting a layout ]

001: Find the layout you want.
002: Click anywhere in the textarea.
003: Right click and select Select All.
004: Right click again and select Copy
005: Click here to choose a petpage to edit.
006: Once you chose a petpage to edit, delete all the coding that's already there and paste the copied coding from Vibe into the code box. To paste, right click in the box and select Paste.
007: Click the Preview Changes button.
008: On the preview, click the Save Changes button.

Voila! You now have a new petpage layout courtesy of Vibe! Enjoy! :3

[ save changes button ]

On some layouts, the Save Changes button is hidden underneath things. Don't panic though! You can still save your new layout! All you have to do is zoom out until you find it. Click it, then zoom back in. Use CTRL + - to zoom out and CTRL + + to zoom back in.

one column.

[ Headlines ]

<style>
#CSSbyiKiwipop {
}
#MadeforVibe {
}
body {
	background: #e0e0e0;
}
.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-right: 20px solid #e0e0e0;
	text-decoration: none;
	display: block;
	text-align: left;
	text-transform: uppercase;
	line-height: 20px;
	padding-left: 5px;
}
a.nav:hover {
	font: 14px century gothic;
	font-weight: normal;
	color: #ffffff;
	border-right: 20px solid #6d6d6d;
	padding-left: 5px;
	line-height: 20px;
}
#title {
	top: 0px;
	left: 0px;
	width: 100%;
	background-color: #808080;
	border-bottom: 5px solid #ffffff;
}
#main {
	top: 60px;
	left: 250px;
	width: 600px;
	height: auto;
	overflow: auto;
	background-color: #ffffff;
	font: 7.5pt verdana;
	color: #a4a4a4;
	text-align: justify;
	padding: 5px;
}
#navi {
	top: 70px;
	left: 865px;
	width: 200px;
	height: auto;
}
h1 {
	font-family: georgia;
	font-size: 32;
	font-weight: normal;
	color: #d697f3;
	text-align: left;
	border-left: 5px solid #ff88f8;
	border-right: 5px solid #84d2ff;
	margin-top: 0px;
	margin-bottom: 6px;
	letter-spacing: -3px;
	text-transform: lowercase;
	padding-left: 30px;
}
h2 {
	font-family: georgia;
	font-size: 20;
	color: #84d2ff;
	font-weight: normal;
	text-align: center;
	letter-spacing: 2px;
	text-transform: lowercase;
	border-top: #ff84e9 solid 2px;
	border-bottom: #d584ff solid 5px;
	margin-top: 3px;
	margin-bottom: 6px;
}
h3 {
	font-family: impact;
	font-size: 18;
	color: #ff84f8;
	font-weight: normal;
	text-align: left;
	letter-spacing: 1px;
	text-transform: lowercase;
	border-left: 50px double #84ccff;
	border-right: 25px solid #c984ff;
	line-height: 18px;
	padding-left: 10px;
	margin-bottom: 6px;
	margin-top: 3px;
}
h4 {
	font-family: leelawadee;
	font-size: 14;
	color: #b0b0b0;
	font-weight: normal;
	text-align: center;
	letter-spacing: 3px;
	text-transform: uppercase;
	border-top: #9ec0ff double 5px;
	border-bottom: #ff9ef9 solid 2px;
	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: #d7d7d7;
	border: 1px solid #b3b3b3;
	margin-bottom: 3px;
	height: 20px;
	width: 88px;
}
b {
	font: 7.5pt verdana;
	font-weight: bold;
	color: #d697f3;
	letter-spacing: 1px;
}
b.a {
	font: 52px Georgia;
	font-weight: normal;
	font-style: italic;
	color: #d697f3;
	padding-left: 30px;
	letter-spacing: 10px;
	text-transform: lowercase;
}
b.b {
	font: 52px Georgia;
	font-weight: normal;
	font-style: italic;
	color: #6cb1ff;
	letter-spacing: 10px;
	text-transform: lowercase;
}
b.c {
	font: 52px Georgia;
	font-weight: normal;
	font-style: italic;
	color: #ff97f9;
	letter-spacing: 10px;
	text-transform: lowercase;
}
i {
	font: 7.5pt verdana;
	font-weight: normal;
	font-style: italic;
	color: #9ec0ff;
}
.u {
	font: 7.5pt verdana;
	font-weight: normal;
	border-bottom: 1px solid #ff9efe;
	color: #ff9efe;
}
</style>
<div id="title" style="position: absolute;">
<b class="a">White</b> <b class="b">Flag</b> <b class="c">Warriors</b>
</div>
<div id="main" style="position: absolute;">
<h1>We'd rather make our children</h1>
<b>bold</b> <i>italic</i> <font class="u">underline</font> <a href="/~riyvern">link</a>
<p>
We request to negotiate. We come to you unarmed. We desire to communicate. You cannot do us harm
</p>
<p>
For one sacrifice, they have schemes and ask me to follow their path to the afterlife. I've got an appetite for nice things and the dreams that my enemies could be blasted by metaphors. Views that are better for you can't survive or find your competitor. Rise together. Fight separate wars I pray I'm never forced to be a predator.
</p>
<p>
Suspecting we won't last. They're glad to hate but gladiators breed their last. Scream or mash for their dreams do clash, like swords in the war let me bleed on that, put the heat on that. Cept we need strong backs, you call us weak and don't redeem contracts. Well this speech won't last. If the beast attacks. The sons and the fathers will be free at last.
</p>
<p>
This is love, and not treason. This is love, and not treason. This is love, and not treason. This is love, and not treason
</p>
<p>
They see sharks in the estuary. They claim the arch of Bartholomew's. They say war is necessary .But we say war is child abuse.
</p>
<p>
We'd rather make our children martyrs than murderers. We'd rather make our children White Flag Warriors.

</p>
<h2>martyrs than murders</h2>
We request to negotiate. We come to you unarmed. We desire to communicate. You cannot do us harm
<p>
For one sacrifice, they have schemes and ask me to follow their path to the afterlife. I've got an appetite for nice things and the dreams that my enemies could be blasted by metaphors. Views that are better for you can't survive or find your competitor. Rise together. Fight separate wars I pray I'm never forced to be a predator.
</p>
<p>
Suspecting we won't last. They're glad to hate but gladiators breed their last. Scream or mash for their dreams do clash, like swords in the war let me bleed on that, put the heat on that. Cept we need strong backs, you call us weak and don't redeem contracts. Well this speech won't last. If the beast attacks. The sons and the fathers will be free at last.
</p>
<p>
This is love, and not treason. This is love, and not treason. This is love, and not treason. This is love, and not treason
</p>
<p>
They see sharks in the estuary. They claim the arch of Bartholomew's. They say war is necessary .But we say war is child abuse.
</p>
<p>
We'd rather make our children martyrs than murderers. We'd rather make our children White Flag Warriors.

</p>
<h3>we'd rather make our children</h3>
We request to negotiate. We come to you unarmed. We desire to communicate. You cannot do us harm
<p>
For one sacrifice, they have schemes and ask me to follow their path to the afterlife. I've got an appetite for nice things and the dreams that my enemies could be blasted by metaphors. Views that are better for you can't survive or find your competitor. Rise together. Fight separate wars I pray I'm never forced to be a predator.
</p>
<p>
Suspecting we won't last. They're glad to hate but gladiators breed their last. Scream or mash for their dreams do clash, like swords in the war let me bleed on that, put the heat on that. Cept we need strong backs, you call us weak and don't redeem contracts. Well this speech won't last. If the beast attacks. The sons and the fathers will be free at last.
</p>
<p>
This is love, and not treason. This is love, and not treason. This is love, and not treason. This is love, and not treason
</p>
<p>
They see sharks in the estuary. They claim the arch of Bartholomew's. They say war is necessary .But we say war is child abuse.
</p>
<p>
We'd rather make our children martyrs than murderers. We'd rather make our children White Flag Warriors.

</p>
<h4>white flag warriors</h4>
We request to negotiate. We come to you unarmed. We desire to communicate. You cannot do us harm
<p>
For one sacrifice, they have schemes and ask me to follow their path to the afterlife. I've got an appetite for nice things and the dreams that my enemies could be blasted by metaphors. Views that are better for you can't survive or find your competitor. Rise together. Fight separate wars I pray I'm never forced to be a predator.
</p>
<p>
Suspecting we won't last. They're glad to hate but gladiators breed their last. Scream or mash for their dreams do clash, like swords in the war let me bleed on that, put the heat on that. Cept we need strong backs, you call us weak and don't redeem contracts. Well this speech won't last. If the beast attacks. The sons and the fathers will be free at last.
</p>
<p>
This is love, and not treason. This is love, and not treason. This is love, and not treason. This is love, and not treason
</p>
<p>
They see sharks in the estuary. They claim the arch of Bartholomew's. They say war is necessary .But we say war is child abuse.
</p>
<p>
We'd rather make our children martyrs than murderers. We'd rather make our children White Flag Warriors.

</p>
<h1>Credit</h1>
Layout by <a href="/~Riyvern">Vibe</a>.
</div>
<div id="navi" style="position: absolute;">
<a href="/~riyvern" class="nav">link</a>
<a href="/~riyvern" class="nav">link</a>
<a href="/~riyvern" class="nav">link</a>
<a href="/~riyvern" class="nav">link</a>
<a href="/~riyvern" class="nav">link</a>
<a href="/~riyvern" class="nav">link</a>
</div>
<div id="save" style="position: absolute;">
</div>

<style>
#CSSbyiKiwipop {
}
#MadeforVibe {
}
body {
	background: #fff99f;
}
.sf {
	display: none;
}
table {
	background: transparent;
}
#save {
	top: 50px;
	left: 0px;
}
a:link, a:active, a:visited {
	font: 7.5pt verdana;
	color: #ff6c38;
	font-weight: bold;
}
a:hover {
	color: #ffaf93;
}
a.nav:link, a.nav:visited, a.nav:active {
	font: 14px century gothic;
	font-weight: normal;
	color: #ffffff;
	background-color: #ffdc62;
	border-right: 20px solid #fff99f;
	text-decoration: none;
	display: block;
	text-align: left;
	text-transform: uppercase;
	line-height: 20px;
	padding-left: 5px;
}
a.nav:hover {
	font: 14px century gothic;
	font-weight: normal;
	color: #ffffff;
	border-right: 20px solid #ffdc62;
	padding-left: 5px;
	line-height: 20px;
}
#title {
	top: 0px;
	left: 0px;
	width: 100%;
	background-color: #ffdc62;
	border-bottom: 5px solid #ffffff;
}
#main {
	top: 60px;
	left: 250px;
	width: 600px;
	height: auto;
	overflow: auto;
	background-color: #ffffff;
	font: 7.5pt verdana;
	color: #a99c83;
	text-align: justify;
	padding: 5px;
}
#navi {
	top: 70px;
	left: 865px;
	width: 200px;
	height: auto;
}
h1 {
	font-family: georgia;
	font-size: 32;
	font-weight: normal;
	color: #a41b00;
	text-align: left;
	border-left: 5px solid #ff7200;
	border-right: 5px solid #fff888;
	margin-top: 0px;
	margin-bottom: 6px;
	letter-spacing: -3px;
	text-transform: lowercase;
	padding-left: 30px;
}
h2 {
	font-family: georgia;
	font-size: 20;
	color: #ff7200;
	font-weight: normal;
	text-align: center;
	letter-spacing: 2px;
	text-transform: lowercase;
	border-top: #fff888 solid 2px;
	border-bottom: #a41b00 solid 5px;
	margin-top: 3px;
	margin-bottom: 6px;
}
h3 {
	font-family: impact;
	font-size: 18;
	color: #fde24e;
	font-weight: normal;
	text-align: left;
	letter-spacing: 1px;
	text-transform: lowercase;
	border-left: 50px double #a41b00;
	border-right: 25px solid #ff7200;
	line-height: 18px;
	padding-left: 10px;
	margin-bottom: 6px;
	margin-top: 3px;
}
h4 {
	font-family: leelawadee;
	font-size: 14;
	color: #a41b00;
	font-weight: normal;
	text-align: center;
	letter-spacing: 3px;
	text-transform: uppercase;
	border-top: #fde24e double 5px;
	border-bottom: #ff7200 solid 2px;
	padding-left: 5px;
	margin-bottom: 6px;
	margin-top: 3px;
}
tr, td, body, .text {
	font-family: verdana;
	font-size: 7.5pt;
	color: #a99c83;
}
textarea {
	font: 6pt verdana;
	color: #FFFFFF;
	background: #fffaab;
	border: 1px solid #fff553;
	margin-bottom: 3px;
	height: 20px;
	width: 88px;
}
b {
	font: 7.5pt verdana;
	font-weight: bold;
	color: #a41b00;
	letter-spacing: 1px;
}
b.a {
	font: 52px Georgia;
	font-weight: normal;
	font-style: italic;
	color: #fff888;
	padding-left: 30px;
	letter-spacing: 10px;
	text-transform: lowercase;
}
b.b {
	font: 52px Georgia;
	font-weight: normal;
	font-style: italic;
	color: #ff7200;
	letter-spacing: 10px;
	text-transform: lowercase;
}
b.c {
	font: 52px Georgia;
	font-weight: normal;
	font-style: italic;
	color: #a41b00;
	letter-spacing: 10px;
	text-transform: lowercase;
}
i {
	font: 7.5pt verdana;
	font-weight: normal;
	font-style: italic;
	color: #fde24e;
}
.u {
	font: 7.5pt verdana;
	font-weight: normal;
	border-bottom: 1px solid #ff7200;
	color: #ff7200;
}
</style>
<div id="title" style="position: absolute;">
<b class="a">White</b> <b class="b">Flag</b> <b class="c">Warriors</b>
</div>
<div id="main" style="position: absolute;">
<h1>We'd rather make our children</h1>
<b>bold</b> <i>italic</i> <font class="u">underline</font> <a href="/~riyvern">link</a>
<p>
We request to negotiate. We come to you unarmed. We desire to communicate. You cannot do us harm
</p>
<p>
For one sacrifice, they have schemes and ask me to follow their path to the afterlife. I've got an appetite for nice things and the dreams that my enemies could be blasted by metaphors. Views that are better for you can't survive or find your competitor. Rise together. Fight separate wars I pray I'm never forced to be a predator.
</p>
<p>
Suspecting we won't last. They're glad to hate but gladiators breed their last. Scream or mash for their dreams do clash, like swords in the war let me bleed on that, put the heat on that. Cept we need strong backs, you call us weak and don't redeem contracts. Well this speech won't last. If the beast attacks. The sons and the fathers will be free at last.
</p>
<p>
This is love, and not treason. This is love, and not treason. This is love, and not treason. This is love, and not treason
</p>
<p>
They see sharks in the estuary. They claim the arch of Bartholomew's. They say war is necessary .But we say war is child abuse.
</p>
<p>
We'd rather make our children martyrs than murderers. We'd rather make our children White Flag Warriors.

</p>
<h2>martyrs than murders</h2>
We request to negotiate. We come to you unarmed. We desire to communicate. You cannot do us harm
<p>
For one sacrifice, they have schemes and ask me to follow their path to the afterlife. I've got an appetite for nice things and the dreams that my enemies could be blasted by metaphors. Views that are better for you can't survive or find your competitor. Rise together. Fight separate wars I pray I'm never forced to be a predator.
</p>
<p>
Suspecting we won't last. They're glad to hate but gladiators breed their last. Scream or mash for their dreams do clash, like swords in the war let me bleed on that, put the heat on that. Cept we need strong backs, you call us weak and don't redeem contracts. Well this speech won't last. If the beast attacks. The sons and the fathers will be free at last.
</p>
<p>
This is love, and not treason. This is love, and not treason. This is love, and not treason. This is love, and not treason
</p>
<p>
They see sharks in the estuary. They claim the arch of Bartholomew's. They say war is necessary .But we say war is child abuse.
</p>
<p>
We'd rather make our children martyrs than murderers. We'd rather make our children White Flag Warriors.

</p>
<h3>we'd rather make our children</h3>
We request to negotiate. We come to you unarmed. We desire to communicate. You cannot do us harm
<p>
For one sacrifice, they have schemes and ask me to follow their path to the afterlife. I've got an appetite for nice things and the dreams that my enemies could be blasted by metaphors. Views that are better for you can't survive or find your competitor. Rise together. Fight separate wars I pray I'm never forced to be a predator.
</p>
<p>
Suspecting we won't last. They're glad to hate but gladiators breed their last. Scream or mash for their dreams do clash, like swords in the war let me bleed on that, put the heat on that. Cept we need strong backs, you call us weak and don't redeem contracts. Well this speech won't last. If the beast attacks. The sons and the fathers will be free at last.
</p>
<p>
This is love, and not treason. This is love, and not treason. This is love, and not treason. This is love, and not treason
</p>
<p>
They see sharks in the estuary. They claim the arch of Bartholomew's. They say war is necessary .But we say war is child abuse.
</p>
<p>
We'd rather make our children martyrs than murderers. We'd rather make our children White Flag Warriors.

</p>
<h4>white flag warriors</h4>
We request to negotiate. We come to you unarmed. We desire to communicate. You cannot do us harm
<p>
For one sacrifice, they have schemes and ask me to follow their path to the afterlife. I've got an appetite for nice things and the dreams that my enemies could be blasted by metaphors. Views that are better for you can't survive or find your competitor. Rise together. Fight separate wars I pray I'm never forced to be a predator.
</p>
<p>
Suspecting we won't last. They're glad to hate but gladiators breed their last. Scream or mash for their dreams do clash, like swords in the war let me bleed on that, put the heat on that. Cept we need strong backs, you call us weak and don't redeem contracts. Well this speech won't last. If the beast attacks. The sons and the fathers will be free at last.
</p>
<p>
This is love, and not treason. This is love, and not treason. This is love, and not treason. This is love, and not treason
</p>
<p>
They see sharks in the estuary. They claim the arch of Bartholomew's. They say war is necessary .But we say war is child abuse.
</p>
<p>
We'd rather make our children martyrs than murderers. We'd rather make our children White Flag Warriors.

</p>
<h1>Credit</h1>
Layout by <a href="/~Riyvern">Vibe</a>.
</div>
<div id="navi" style="position: absolute;">
<a href="/~riyvern" class="nav">link</a>
<a href="/~riyvern" class="nav">link</a>
<a href="/~riyvern" class="nav">link</a>
<a href="/~riyvern" class="nav">link</a>
<a href="/~riyvern" class="nav">link</a>
<a href="/~riyvern" class="nav">link</a>
</div>
<div id="save" style="position: absolute;">
</div>

Good For:
Role Play Characters / About Me Pages / Guild Webbies, ect.
Featured Song:
White Flag Warriors by Flobots
Color Schemes:
Not So Dull After All / Sunset / Jhudora Was Here! / Oceanic
Notes:
Featuring a full title that goes all the way across the page, this style has simple headers and block navigation. The wide content area is perfect for large images and loads of content. The color schemes are bold and attractive.

[ Streamline ]

<style>
#CSSbyiKiwipop {
}
#MadeforVibe {
}
body {
	background: #ededed;
}
.sf {
	display: none;
}
table {
	background: transparent;
}
a:link, a:active, a:visited {
	font: 7.5pt verdana;
	color: #000000;
	text-decoration: none;
	font-weight: normal;
	text-transform: lowercase;
}
a:hover {
	color: #cdcdcd;
}
a.nav:link, a.nav:active, a.nav:visited {
	font: 12px century gothic;
	color: #000000;
	text-decoration: none;
	font-weight: normal;
	text-transform: lowercase;
}
a.nav:hover {
	color: #73defd;
}
h1 {
	font-family: georgia;
	font-size: 32;
	font-weight: normal;
	font-style: italic;
	color: #99def3;
	border-left: 120px solid #e1e1e1;
	border-right: 20px solid #e1e1e1;
	text-align: left;
	margin-top: 0px;
	margin-bottom: 6px;
	padding-left: 50px;
	letter-spacing: -3px;
	line-height: 32px;
	text-transform: lowercase;
}
h2 {
	font-family: century gothic;
	font-size: 20;
	color: #2192f2;
	font-weight: normal;
	text-align: left;
	letter-spacing: -1px;
	text-transform: lowercase;
	border-bottom: 2px solid #c8c8c8;
	margin-top: 3px;
	margin-bottom: 6px;
	padding-left: 30px;
}
tr, td, body, .text {
	font-family: verdana;
	font-size: 7.5pt;
	color: #9b9b9b;
}
textarea {
	font: 6pt verdana;
	color: #FFFFFF;
	background: #d1ece8;
	border: 1px solid #97d5cc;
	margin-bottom: 3px;
	height: 20px;
	width: 88px;
}
b {
	font: 7pt georgia;
	font-weight: bold;
	color: #3871b7;
	text-transform: uppercase;
}
i {
	font: 7pt georgia;
	font-weight: normal;
	font-style: italic;
	color: #ababab;
	letter-spacing: 1px;
}
.u {
	font: 7.5pt verdana;
	font-weight: normal;
	color: #ffffff;
	text-decoration: none;
	background-color: #81dbfc;
}
</style>
<p>
</p>
<center><table><td width="700" valign="top">
<div style="width: 700px; height: auto; background-color: #ffffff; border: 5px white solid; text-align: center;">
<img src="http://i30.tinypic.com/szk9zs.jpg"><p>
</p>
<center><div style="width: 680px; height: auto; overflow: hidden; text-align: right; padding-bottom: 10px;">
<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></center>
<h1>i got the magic in me</h1>
<b>bold</b> <i>italic</i> <font class="u">underline</font> <a href="/">link</a>
<p>
I got the magic in me. Everytime I touch that track it turns into gold. Everybody knows I've got the magic in me. When I hit the floor the girls come snapin' at me. Now everybody wants a burst of magic. 
</p>
<p>
Magic, magic, magic. Magic, magic, magic. Magic, magic, magic.(ahoo) I got the magic in me! 
</p>
<p>
These tricks that I'll attempt will blow your mind. Pick a verse, any verse, I'll hypnotise your every line. I'll need a volunteer, how about you, with the eyes? Come on down to the front, and stand right here and don't be shy. 
</p>
<p>
I'll have you time-travelin', have your mind bablin'. People tryna inherit the skill so they askin' me. Even David Blaine had to go and take some classes, and,
I see Mindfreak like, 'What's up man, what's happenin'?'. So come one, come all, and see the show tonight. Prepare to be astounded, no Ghost or Poltergeist. You know I'm no Pinocchio, I've never told a lie. So call me Mr. Magic Man, I float on Cloud 9.

</p>
<h2>every track i touch it turns into gold</h2>
I got the magic in me. Everytime I touch that track it turns into gold. Everybody knows I've got the magic in me. When I hit the floor the girls come snapin' at me. Now everybody wants a burst of magic. 
<p>
Magic, magic, magic. Magic, magic, magic. Magic, magic, magic.(ahoo) I got the magic in me! 
</p>
<p>
These tricks that I'll attempt will blow your mind. Pick a verse, any verse, I'll hypnotise your every line. I'll need a volunteer, how about you, with the eyes? Come on down to the front, and stand right here and don't be shy. 
</p>
<p>
I'll have you time-travelin', have your mind bablin'. People tryna inherit the skill so they askin' me. Even David Blaine had to go and take some classes, and,
I see Mindfreak like, 'What's up man, what's happenin'?'. So come one, come all, and see the show tonight. Prepare to be astounded, no Ghost or Poltergeist. You know I'm no Pinocchio, I've never told a lie. So call me Mr. Magic Man, I float on Cloud 9.
</p>
</div>
</td></table></center>

<style>
#CSSbyiKiwipop {
}
#MadeforVibe {
}
body {
	background: #e1f4fb;
}
.sf {
	display: none;
}
table {
	background: transparent;
}
a:link, a:active, a:visited {
	font: 7.5pt verdana;
	color: #3ab2d0;
	text-decoration: none;
	font-weight: normal;
	text-transform: lowercase;
}
a:hover {
	color: #fbb2cf;
}
a.nav:link, a.nav:active, a.nav:visited {
	font: 12px century gothic;
	color: #3ab2d0;
	text-decoration: none;
	font-weight: normal;
	text-transform: lowercase;
}
a.nav:hover {
	color: #fbb2cf;
}
h1 {
	font-family: georgia;
	font-size: 32;
	font-weight: normal;
	font-style: italic;
	color: #e1abc7;
	border-left: 120px solid #cae7f3;
	border-right: 20px solid #cae7f3;
	text-align: left;
	margin-top: 0px;
	margin-bottom: 6px;
	padding-left: 50px;
	letter-spacing: -3px;
	line-height: 32px;
	text-transform: lowercase;
}
h2 {
	font-family: century gothic;
	font-size: 20;
	color: #91d4e5;
	font-weight: normal;
	text-align: left;
	letter-spacing: -1px;
	text-transform: lowercase;
	border-bottom: 2px solid #eab6cc;
	margin-top: 3px;
	margin-bottom: 6px;
	padding-left: 30px;
}
tr, td, body, .text {
	font-family: verdana;
	font-size: 7.5pt;
	color: #9b9b9b;
}
textarea {
	font: 6pt verdana;
	color: #FFFFFF;
	background: #d4eaf6;
	border: 1px solid #b8d5e5;
	margin-bottom: 3px;
	height: 20px;
	width: 88px;
}
b {
	font: 7pt georgia;
	font-weight: bold;
	color: #d4457e;
	text-transform: uppercase;
}
i {
	font: 7pt georgia;
	font-weight: normal;
	font-style: italic;
	color: #86cdf6;
	letter-spacing: 1px;
}
.u {
	font: 7.5pt verdana;
	font-weight: normal;
	color: #ffffff;
	text-decoration: none;
	background-color: #ef8fb6;
}
</style>
<p>
</p>
<center><table><td width="700" valign="top">
<div style="width: 700px; height: auto; background-color: #ffffff; border: 5px white solid; text-align: center;">
<img src="http://i34.tinypic.com/w2ooix.jpg"><p>
</p>
<center><div style="width: 680px; height: auto; overflow: hidden; text-align: right; padding-bottom: 10px;">
<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></center>
<h1>i got the magic in me</h1>
<b>bold</b> <i>italic</i> <font class="u">underline</font> <a href="/">link</a>
<p>
I got the magic in me. Everytime I touch that track it turns into gold. Everybody knows I've got the magic in me. When I hit the floor the girls come snapin' at me. Now everybody wants a burst of magic. 
</p>
<p>
Magic, magic, magic. Magic, magic, magic. Magic, magic, magic.(ahoo) I got the magic in me! 
</p>
<p>
These tricks that I'll attempt will blow your mind. Pick a verse, any verse, I'll hypnotise your every line. I'll need a volunteer, how about you, with the eyes? Come on down to the front, and stand right here and don't be shy. 
</p>
<p>
I'll have you time-travelin', have your mind bablin'. People tryna inherit the skill so they askin' me. Even David Blaine had to go and take some classes, and,
I see Mindfreak like, 'What's up man, what's happenin'?'. So come one, come all, and see the show tonight. Prepare to be astounded, no Ghost or Poltergeist. You know I'm no Pinocchio, I've never told a lie. So call me Mr. Magic Man, I float on Cloud 9.

</p>
<h2>every track i touch it turns into gold</h2>
I got the magic in me. Everytime I touch that track it turns into gold. Everybody knows I've got the magic in me. When I hit the floor the girls come snapin' at me. Now everybody wants a burst of magic. 
<p>
Magic, magic, magic. Magic, magic, magic. Magic, magic, magic.(ahoo) I got the magic in me! 
</p>
<p>
These tricks that I'll attempt will blow your mind. Pick a verse, any verse, I'll hypnotise your every line. I'll need a volunteer, how about you, with the eyes? Come on down to the front, and stand right here and don't be shy. 
</p>
<p>
I'll have you time-travelin', have your mind bablin'. People tryna inherit the skill so they askin' me. Even David Blaine had to go and take some classes, and,
I see Mindfreak like, 'What's up man, what's happenin'?'. So come one, come all, and see the show tonight. Prepare to be astounded, no Ghost or Poltergeist. You know I'm no Pinocchio, I've never told a lie. So call me Mr. Magic Man, I float on Cloud 9.
</p>
</div>
</td></table></center>

Good For:
Sites / Role Play Characters / About Me Pages / Guild Webbies, ect.
Featured Song:
Magic by B.o.B
Color Schemes:
Professional Blues / Berry Lovely / Monochromatic / Sweet Poison
Notes:
Simple and professional, this style is perfect to pulling together a sophisticated pages. The content are is very large and there's room for a banner to help draw attention to your page. Simple headers and navigation are paired with unique b/i/u to finish the style.

[ Harsh Lines ]

<style>
#CSSbyiKiwipop {
}
#MadeforVibe {
}
body {
	background: #46515b;
}
.sf {
	display: none;
}
table {
	background: transparent;
}
#save {
	top: 50px;
	left: 900px;
}
a:link, a:active, a:visited {
	font: 10.5px calibri;
	color: #d39077;
	font-weight: normal;
	text-decoration: none;
}
a:hover {
	color: #ffffff;
	background-color: #d39077;
}
a.nav:link, a.nav:visited, a.nav:active {
	font: 12px tahoma;
	font-weight: normal;
	color: #ffffff;
	background-color: #717d88;
	text-decoration: none;
	display: block;
	text-align: left;
	padding-left: 5px;
	margin-bottom: 2px;
	text-transform: lowercase;
}
a.nav:hover {
	font: 12px tahoma;
	font-weight: normal;
	color: #ffffff;
	background-color: #d39077;
}
#title {
	top: 45px;
	left: 70px;
	height: auto;
	width: auto;
}
#main {
	top: 100px;
	left: 100px;
	width: 600px;
	height: auto;
	overflow: hidden;
	background-color: #ffffff;
	font: 10.5px calibri;
	padding: 5px;
	color: #9f949d;
	text-align: justify;
}
#navi {
	top: 120px;
	left: 715px;
	width: 100px;
	height: auto;
	overflow: auto;
	font: 10.5px calibri;
	color: #5f5c61;
	text-align: justify;
}
h1 {
	font-family: century gothic;
	font-size: 32;
	font-weight: normal;
	color: #8fd8db;
	text-align: left;
	border-bottom: 2px solid #f9e8c9;
	margin-top: 10px;
	margin-bottom: 10px;
	letter-spacing: -3px;
	text-transform: uppercase;
	line-height: 16px;
	padding-left: 80px;
}
h2 {
	font-family: century gothic;
	font-size: 18;
	color: #d39077;
	font-weight: normal;
	text-align: left;
	text-transform: lowercase;
	border-bottom: #8fd8db 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: #f9e8c9;
	border: 1px solid #d39077;
	margin-bottom: 3px;
	height: 20px;
	width: 88px;
}
b {
	font: 10.5px calibri;
	font-weight: bold;
	color: #1d1f20;
}
b.a {
	font: 40px georgia;
	font-weight: normal;
	color: #ffffff;
	letter-spacing: 1px;
	text-transform: lowercase;
	border-bottom: 5px solid #717d88;
}
b.b {
	font: 40px georgia;
	font-weight: normal;
	font-style: italic;
	color: #77b2c6;
	letter-spacing: 2px;
	padding-left: 15px;
	text-transform: lowercase;
	border-bottom: 5px solid #717d88;
}
i {
	font: 10.5px calibri;
	font-weight: normal;
	font-style: italic;
	color: #4fbcc1;
}
.u {
	font: 10.5px calibri;
	font-weight: normal;
	border-bottom: 1px solid #47446f;
	color: #47446f;
}
</style>
<div id="title" style="position: absolute;">
<b class="a">We gon light it up,</b><b class="b">like it's dynamite</b>
</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="/~riyvern" class="nav">css</a>
</div>
<div id="main" style="position: absolute;">
<h1>[ I put my hands up in the air tonight ]</h1>
<b>blold</b> <i>italic</i> <font class="u">underline</font> <a href="/">link</a>
<p>
I throw my hands up in the air sometimes. Saying AYO! Gotta let go! I wanna celebrate and live my life. Saying AYO! Baby, let's go!
</p>
<p>
I came to dance, dance, dance, dance. I hit the floor, 'cause that's my, plans, plans, plans, plans. I'm wearing all my favorite brands, brands, brands, brands. Give me space for both my hands, hands, hands, hands. Ye, ye. Cause it goes on and on and on.And it goes on and on and on.
</p>
<p>
Yeah!
</p>
<p>
I throw my hands up in the air sometimes. Saying AYO! Gotta let go! I wanna celebrate and live my life. Saying AYO! Baby, let's go!
</p>
<p>Cause we gon' rock this club. We gon' go all night. We gon' light it up like it's dynamite! 'Cause I told you once. Now I told you twice. We gon' light it up like it's dynamite!

</p>
<h2>saying ayo, gotta let go</h2>
I throw my hands up in the air sometimes. Saying AYO! Gotta let go! I wanna celebrate and live my life. Saying AYO! Baby, let's go!
<p>
I came to dance, dance, dance, dance. I hit the floor, 'cause that's my, plans, plans, plans, plans. I'm wearing all my favorite brands, brands, brands, brands. Give me space for both my hands, hands, hands, hands. Ye, ye. Cause it goes on and on and on.And it goes on and on and on.
</p>
<p>
Yeah!
</p>
<p>
I throw my hands up in the air sometimes. Saying AYO! Gotta let go! I wanna celebrate and live my life. Saying AYO! Baby, let's go!
</p>
<p>Cause we gon' rock this club. We gon' go all night. We gon' light it up like it's dynamite! 'Cause I told you once. Now I told you twice. We gon' light it up like it's dynamite!
</p>
</div>
<div id="save" style="position: absolute;">	
</div>

<style>
#CSSbyiKiwipop {
}
#MadeforVibe {
}
body {
	background: #2c2c2c;
}
.sf {
	display: none;
}
table {
	background: transparent;
}
#save {
	top: 50px;
	left: 900px;
}
a:link, a:active, a:visited {
	font: 10.5px calibri;
	color: #7e7e7e;
	font-weight: bold;
	text-decoration: none;
}
a:hover {
	color: #ffffff;
	background-color: #7e7e7e;
}
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: left;
	padding-left: 10px;
	margin-bottom: 2px;
	text-transform: lowercase;
}
a.nav:hover {
	font: 12px tahoma;
	font-weight: normal;
	color: #ffffff;
	background-color: #6a1f13;
}
#title {
	top: 45px;
	left: 70px;
	height: auto;
	width: auto;
}
#main {
	top: 100px;
	left: 100px;
	width: 600px;
	height: auto;
	overflow: auto;
	background-color: #161616;
	border: 5px solid #161616;
	font: 10.5px calibri;
	color: #ffffff;
	text-align: justify;
}
#navi {
	top: 120px;
	left: 720px;
	width: 150px;
	height: auto;
	overflow: auto;
	font: 10.5px calibri;
	color: #5f5c61;
	text-align: justify;
}
h1 {
	font-family: georgia;
	font-size: 32;
	font-weight: normal;
	color: #b84f3d;
	border-bottom: 4px solid #000000;
	text-align: left;
	margin-top: 15px;
	margin-bottom: 10px;
	letter-spacing: -3px;
	text-transform: lowercase;
	line-height: 15px;
	padding-left: 10px;
}
h2 {
	font-family: century gothic;
	font-size: 18;
	color: #7e7e7e;
	font-weight: normal;
	text-align: left;
	text-transform: lowercase;
	border-bottom: #b84f3d solid 1px;
	margin-top: 10px;
	margin-bottom: 6px;
	line-height: 18px;
	padding-left: 10px;
}
h3 {
	font-family: century gothic;
	font-size: 16;
	color: #eb8cb4;
	font-weight: normal;
	text-align: center;
	letter-spacing: 1px;
	text-transform: uppercase;
	border-left: 20px double #fca3a8;
	border-right: 20px double #fca3a8;
	line-height: 18px;
	margin-bottom: 6px;
	margin-top: 3px;
}
h4 {
	font-family: century gothic;
	font-size: 14;
	color: #9e6792;
	font-weight: normal;
	text-align: center;
	letter-spacing: 3px;
	text-transform: uppercase;
	border-top: dashed 1px #c4727a;
	padding-left: 5px;
	margin-bottom: 6px;
	margin-top: 3px;
}
tr, td, body, .text {
	font-family: calibri;
	font-size: 10.5px;
	color: #ffffff;
}
textarea {
	font: 6pt verdana;
	color: #FFFFFF;
	background: #000000;
	border: 1px solid #5e5e5e;
	margin-bottom: 3px;
	height: 20px;
	width: 88px;
}
b {
	font: 10.5px calibri;
	font-weight: bold;
	color: #7e7e7e;
	text-transform: uppercase;
}
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: #000000;
	letter-spacing: 2px;
	padding-left: 15px;
	text-transform: lowercase;
}
i {
	font: 10.5px calibri;
	font-weight: normal;
	font-style: italic;
	color: #b84f3d;
}
.u {
	font: 10.5px calibri;
	font-weight: normal;
	border-bottom: 1px solid #6a1f13;
	color: #6a1f13;
}
</style>
<div id="title" style="position: absolute;">
<b class="a">We gon light it up,</b><b class="b">like it's dynamite</b>
</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="/~riyvern" class="nav">css</a>
</div>
<div id="main" style="position: absolute;">
<h1>[ I put my hands up in the air tonight ]</h1>
<b>blold</b> <i>italic</i> <font class="u">underline</font> <a href="/">link</a>
<p>
I throw my hands up in the air sometimes. Saying AYO! Gotta let go! I wanna celebrate and live my life. Saying AYO! Baby, let's go!
</p>
<p>
I came to dance, dance, dance, dance. I hit the floor, 'cause that's my, plans, plans, plans, plans. I'm wearing all my favorite brands, brands, brands, brands. Give me space for both my hands, hands, hands, hands. Ye, ye. Cause it goes on and on and on.And it goes on and on and on.
</p>
<p>
Yeah!
</p>
<p>
I throw my hands up in the air sometimes. Saying AYO! Gotta let go! I wanna celebrate and live my life. Saying AYO! Baby, let's go!
</p>
<p>Cause we gon' rock this club. We gon' go all night. We gon' light it up like it's dynamite! 'Cause I told you once. Now I told you twice. We gon' light it up like it's dynamite!

</p>
<h2>saying ayo, gotta let go</h2>
I throw my hands up in the air sometimes. Saying AYO! Gotta let go! I wanna celebrate and live my life. Saying AYO! Baby, let's go!
<p>
I came to dance, dance, dance, dance. I hit the floor, 'cause that's my, plans, plans, plans, plans. I'm wearing all my favorite brands, brands, brands, brands. Give me space for both my hands, hands, hands, hands. Ye, ye. Cause it goes on and on and on.And it goes on and on and on.
</p>
<p>
Yeah!
</p>
<p>
I throw my hands up in the air sometimes. Saying AYO! Gotta let go! I wanna celebrate and live my life. Saying AYO! Baby, let's go!
</p>
<p>Cause we gon' rock this club. We gon' go all night. We gon' light it up like it's dynamite! 'Cause I told you once. Now I told you twice. We gon' light it up like it's dynamite!
</p>
</div>
<div id="save" style="position: absolute;">	
</div>

Good For:
Sites/ Blogs / Role Play Characters / About Me Pages / Guild Webbies, ect.
Featured Song:
Dynamite by Taio Cruz
Color Schemes:
Aiden Vox / Sinvari / Mint Chocolate / Inversion
Notes:
A bold title goes across the top of this left-aligned style while block navigation is to the right side. The large content area that gets longer as you add more content is prefect for many different types of pages.

[ Cornered ]

<style>
#CSSbyTina {
}
#NoStealing {
}
body {
	background: #121212;
}
.sf {
	display: none;
}
table {
	background: none;
}
a:link, a:active, a:visited {
	font: 10.5px tahoma;
	font-weight: normal;
	color: #ededed;
	text-decoration: none;
}
a:hover {
	color: #000000;
	background-color: ededed;
	text-decoration: none;
}
a.nav:link, a.nav:active, a.nav:visited {
	font: 12px arial;
	font-weight: normal;
	display: block;
	color: #ffffff;
	text-decoration: none;
	text-align: left;
	padding-left: 10px;
}
a.nav:hover {
	color: #ffffff;
	background-color: transparent;
	text-decoration: none;
	padding-left: 20px;
}
#save {
	top: 0px;
	left: 600px;
}
#title {
	top: 0px;
	left: 0px;
	width: 97%;
	background-color: #000000;
	padding-left: 30px;
	padding-bottom: 5px;
}
#main {
	top: 85px;
	left: 10px;
	width: 500px;
	height: auto;
	overflow: auto;
	padding: 5px;
	border-right: 1px solid #3f0000;
	font: 10.5px tahoma;
	color: #666666;
	text-align: justify;
}
#navi {
	top: 85px;
	left: 515px;
	width: 200px;
	height: auto;
	overflow: auto;
	padding: 5px;
}
h1 {
	font-family: century gothic;
	font-weight: normal;
	font-size: 18px;
	color: #dc1010;
	text-align: left;
	border-bottom: 1px dashed #575757;
	text-transform: uppercase;
	margin-top: 0px;
	padding-left: 20px;
}
h2 {
	font-family: century gothic;
	font-weight: normal;
	font-size: 14px;
	line-height: 10px;
	color: #b1b1b1;
	border-right: 60px solid #980000;
	text-transform: lowercase;
	text-align: right;
	padding-right: 20px;
}
textarea {
	font: 6pt verdana;
	color: #FFFFFF;
	background: #000000;
	border: 1px solid #ffffff;
	margin-bottom: 3px;
	height: 20px;
	width: 88px;
}
b {
	font: 10.5px tahoma;
	font-weight: bold;
	color: #9b1025;
}
b.a {
	font: 50px georgia;
	font-style: italic;
	color: #ffffff;
}
b.b {
	font: 50px georgia;
	font-style: italic;
	color: #cf0000;
}
i {
	font: 10.5px tahoma;
	font-weight: normal;
	font-style: italic;
	color: #c4c4c4;
	letter-spacing: 1px;
}
i.a {
	font: 14px arial;
	font-weight: normal;
	color: #b3b3b3;
	padding-left: 20px;
}
.u {
	font: 10.5px tahoma;
	font-weight: normal;
	border-bottom: 1px solid #bd0000;
	color: #db0000;
}
</style>
<div id="title" style="position: absolute;">
<b class="a">Somebody</b> <b class="b">Call</b> <b class="a">911</b>
<br><i class="a">Shawty fire burning on the dance floor, whoa</i>
</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="/~riyvern" class="nav">css</a>
</div>
<div id="main" style="position: absolute;">
<h1>Fire burning, fire burning</h1>
<b>bold</b> <i>italic</i> <font class="u">underline</font> <a href="/">link</a>
<p>
Somebody call 911! Shawty fire burning on the dance floor, whoa. I gotta cool her down. She wan' bring the roof to ground. On the dance floor, whoa.
</p>
<p>
She's fire burning, fire burning on the dance floor. That little shawty's fire burning on the dance floor. She's fire burning, fire burning on the dance floor. That little shawty's fire burning on the dance floor. (Fire burning, fire burning)
</p>
<p>
Somebody call 911! Shawty fire burning on the dance floor, whoa. I gotta cool her down. She wan' bring the roof to ground. On the dance floor, whoa.
</p>
<p>
She's fire burning, fire burning on the dance floor. That little shawty's fire burning on the dance floor. She's fire burning, fire burning on the dance floor. That little shawty's fire burning on the dance floor. (Fire burning, fire burning)

</p>
<h2>She got that fire in the dance</h2>
She got that fire in the dance. That'll make them fellas run around. (Madem, get out my way, everybody, sing it now, hey!). No exit from the dance floor. So them boys wan' more. (What a gwaan? Let's go! Madem, let's go, hey!)
<p>
She got that fire in the dance. That'll make them fellas run around. (Madem, get out my way, everybody, sing it now, hey!). No exit from the dance floor. So them boys wan' more. (What a gwaan? Let's go! Madem, let's go, hey!)
</p>
<p>
She got that fire in the dance. That'll make them fellas run around. (Madem, get out my way, everybody, sing it now, hey!). No exit from the dance floor. So them boys wan' more. (What a gwaan? Let's go! Madem, let's go, hey!)
</p>
<p>
She got that fire in the dance. That'll make them fellas run around. (Madem, get out my way, everybody, sing it now, hey!). No exit from the dance floor. So them boys wan' more. (What a gwaan? Let's go! Madem, let's go, hey!)
</p>
</div>
<div id="save" style="position: absolute;">
</div>

<style>
#CSSbyTina {
}
#NoStealing {
}
body {
	background: #c6a188;
}
.sf {
	display: none;
}
table {
	background: none;
}
a:link, a:active, a:visited {
	font: 10.5px tahoma;
	font-weight: normal;
	color: #ffffff;
	text-decoration: none;
}
a:hover {
	color: #ffffff;
	background-color: -blocked-;
	text-decoration: none;
}
a.nav:link, a.nav:active, a.nav:visited {
	font: 12px arial;
	font-weight: normal;
	display: block;
	color: #ffffff;
	text-decoration: none;
	text-align: left;
	padding-left: 10px;
}
a.nav:hover {
	color: #ffffff;
	background-color: transparent;
	text-decoration: none;
	padding-left: 20px;
}
#save {
	top: 0px;
	left: 600px;
}
#title {
	top: 0px;
	left: 0px;
	width: 97%;
	background-color: #6f5443;
	padding-left: 30px;
	padding-bottom: 5px;
}
#main {
	top: 85px;
	left: 10px;
	width: 500px;
	height: auto;
	overflow: auto;
	padding: 5px;
	border-right: 1px solid #6a3d1e;
	font: 10.5px tahoma;
	color: #6f4e37;
	text-align: justify;
}
#navi {
	top: 85px;
	left: 515px;
	width: 200px;
	height: auto;
	overflow: auto;
	padding: 5px;
}
h1 {
	font-family: century gothic;
	font-weight: normal;
	font-size: 18px;
	color: #834318;
	text-align: left;
	border-bottom: 1px dashed #9c53ae;
	text-transform: uppercase;
	margin-top: 0px;
	padding-left: 20px;
}
h2 {
	font-family: century gothic;
	font-weight: normal;
	font-size: 14px;
	line-height: 10px;
	color: #9c53ae;
	border-right: 60px solid #6b4329;
	text-transform: lowercase;
	text-align: right;
	padding-right: 20px;
}
textarea {
	font: 6pt verdana;
	color: #FFFFFF;
	background: #e5c2ab;
	border: 1px solid #b1896e;
	margin-bottom: 3px;
	height: 20px;
	width: 88px;
}
b {
	font: 10.5px tahoma;
	font-weight: bold;
	color: #985ab5;
}
b.a {
	font: 50px georgia;
	font-style: italic;
	color: #ffffff;
}
b.b {
	font: 50px georgia;
	font-style: italic;
	color: #986fc1;
}
i {
	font: 10.5px tahoma;
	font-weight: normal;
	font-style: italic;
	color: #f3e1fb;
	letter-spacing: 1px;
}
i.a {
	font: 14px arial;
	font-weight: normal;
	color: #dfd7e8;
	padding-left: 20px;
}
.u {
	font: 10.5px tahoma;
	font-weight: normal;
	border-bottom: 1px solid #ac6739;
	color: #ac6739;
}
</style>
<div id="title" style="position: absolute;">
<b class="a">Somebody</b> <b class="b">Call</b> <b class="a">911</b>
<br><i class="a">Shawty fire burning on the dance floor, whoa</i>
</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="/~riyvern" class="nav">css</a>
</div>
<div id="main" style="position: absolute;">
<h1>Fire burning, fire burning</h1>
<b>bold</b> <i>italic</i> <font class="u">underline</font> <a href="/">link</a>
<p>
Somebody call 911! Shawty fire burning on the dance floor, whoa. I gotta cool her down. She wan' bring the roof to ground. On the dance floor, whoa.
</p>
<p>
She's fire burning, fire burning on the dance floor. That little shawty's fire burning on the dance floor. She's fire burning, fire burning on the dance floor. That little shawty's fire burning on the dance floor. (Fire burning, fire burning)
</p>
<p>
Somebody call 911! Shawty fire burning on the dance floor, whoa. I gotta cool her down. She wan' bring the roof to ground. On the dance floor, whoa.
</p>
<p>
She's fire burning, fire burning on the dance floor. That little shawty's fire burning on the dance floor. She's fire burning, fire burning on the dance floor. That little shawty's fire burning on the dance floor. (Fire burning, fire burning)

</p>
<h2>She got that fire in the dance</h2>
She got that fire in the dance. That'll make them fellas run around. (Madem, get out my way, everybody, sing it now, hey!). No exit from the dance floor. So them boys wan' more. (What a gwaan? Let's go! Madem, let's go, hey!)
<p>
She got that fire in the dance. That'll make them fellas run around. (Madem, get out my way, everybody, sing it now, hey!). No exit from the dance floor. So them boys wan' more. (What a gwaan? Let's go! Madem, let's go, hey!)
</p>
<p>
She got that fire in the dance. That'll make them fellas run around. (Madem, get out my way, everybody, sing it now, hey!). No exit from the dance floor. So them boys wan' more. (What a gwaan? Let's go! Madem, let's go, hey!)
</p>
<p>
She got that fire in the dance. That'll make them fellas run around. (Madem, get out my way, everybody, sing it now, hey!). No exit from the dance floor. So them boys wan' more. (What a gwaan? Let's go! Madem, let's go, hey!)
</p>
</div>
<div id="save" style="position: absolute;">
</div>

Good For:
Role Play Characters / About Me Pages /Blogs /Guild Webbies, ect.
Featured Song:
Fire Burning by Sean Kingston
Color Schemes:
Embers and Ashes / Violets and Chocolates / Vivacious
Notes:
This style is indeed cornered as it is aligned to the left with a sidebar off to the right. The bold header across the top has room for a title and a subtitle.

[ Candy Bar ]

<style>
#CSSbyiKiwipop {
}
#MadeforVibe {
}
body {
	background: #dedede;
}
.sf {
	display: none;
}
table {
	background: transparent;
}
#save {
	top: 50px;
	left: 900px;
}
a:link, a:active, a:visited {
	font: 10.5px calibri;
	color: #7e7e7e;
	font-weight: bold;
	text-decoration: none;
}
a:hover {
	color: #ffffff;
	background-color: #c1c1c1;
}
a.nav:link, a.nav:visited, a.nav:active {
	font: 12px tahoma;
	font-weight: normal;
	color: #ffffff;
	background-color: #c1c1c1;
	text-decoration: none;
	text-align: center;
	padding-left: 20px;
	padding-right: 20px;
	margin-bottom: 2px;
	text-transform: lowercase;
}
a.nav:hover {
	font: 12px tahoma;
	font-weight: normal;
	color: #ffffff;
	background-color: #b7b7b7;
}
#title {
	height: auto;
	width: 630px;
	padding-bottom: 5px;
	padding-top: 10px;
}
#main {
	width: 600px;
	height: auto;
	overflow: auto;
	background-color: #ffffff;
	border-left: 10px solid #ff66cb;
	border-right: 10px solid #ad32fb;
	font: 10.5px calibri;
	color: #a9a9a9;
	text-align: justify;
	padding: 5px;
}
#navi {
	width: 630px;
	height: auto;
	overflow: auto;
	padding-bottom: 5px;
}
h1 {
	font-family: calibri;
	font-size: 32;
	font-weight: normal;
	color: #ec83c8;
	border-bottom: 4px solid #e7e7e7;
	text-align: left;
	margin-top: 15px;
	margin-bottom: 10px;
	letter-spacing: -2px;
	text-transform: lowercase;
	line-height: 15px;
	padding-left: 10px;
}
h2 {
	font-family: century gothic;
	font-size: 18;
	color: #ad32fb;
	font-weight: normal;
	text-align: left;
	text-transform: lowercase;
	border-bottom: #e7e7e7 solid 1px;
	margin-top: 15px;
	margin-bottom: 6px;
	line-height: 18px;
	padding-left: 10px;
}
h3 {
	font-family: century gothic;
	font-size: 1;
	color: #dedede;
	font-weight: normal;
	border-bottom: 2px solid #ffffff;
	margin-top: -8px;
	margin-bottom: 5px;
}
tr, td, body, .text {
	font-family: calibri;
	font-size: 10.5px;
	color: #a9a9a9;
}
textarea {
	font: 6pt verdana;
	color: #d4a2f3;
	background: #ededed;
	border: 1px solid #d2d2d2;
	margin-bottom: 3px;
	height: 20px;
	width: 88px;
}
b {
	font: 10.5px calibri;
	font-weight: bold;
	color: #b782d9;
	text-transform: uppercase;
}
b.a {
	font: 40px georgia;
	font-weight: normal;
	color: #c783f3;
	letter-spacing: 1px;
	text-transform: lowercase;
}
b.aa {
	font: 40px georgia;
	font-weight: normal;
	color: #ec90cd;
	letter-spacing: 1px;
	text-transform: lowercase;
}
b.b {
	font: 12px tahoma;
	font-weight: normal;
	color: #8e8e8e;
	letter-spacing: 2px;
	padding-left: 15px;
	text-transform: lowercase;
}
i {
	font: 10.5px calibri;
	font-weight: normal;
	font-style: italic;
	color: #ec83c8;
}
.u {
	font: 10.5px calibri;
	font-weight: normal;
	border-bottom: 1px solid #ff66cb;
	color: #9f9f9f;
}
</style>
<center>
<div id="title">

<b class="a">hig</b><b class="aa">her</b>
<h3>.</h3>
<b class="b">It's taking me higher, higher off the ground</b>
</div>

<div id="navi">
<a class="nav" href="/">link</a>
<a class="nav" href="/">link</a>
<a class="nav" href="/">link</a>
<a class="nav" href="/">link</a>
<a class="nav" href="/">link</a>
<a class="nav" href="/">link</a>
<a class="nav" href="/">link</a>
<a class="nav" href="/">link</a>
<a class="nav" href="/">link</a>
<a class="nav" href="/~Riyvern">css</a>
</div>

<div id="main">
<h1>[ Now I know how to get down on the floor ]</h1>
<b>bold</b> <i>italic</i> <font class="u">underline</font> <a href="/">link</a>
<p>
Now I know how to get down on the floor. Experience the moves you can't ignore. But something 'bout this beat that's got me hooked. Come over here and take a closer look. 'Cause I can't get enough, I can't get enough
I can't stay on the ground. Whoa, I can't get enough, I can't get enough. This is taking me now.
</p>
<p>
It's taking me higher, higher. Higher off the ground. It's taking me higher, higher. Higher off the ground.

</p>
<h2>Experience the moves you can't ignore</h2>
I do this just for kicks, just for the thrill. I got this high without taking a pill. This move has got me way over the sun. I'm dancing like I am the only one. 
<p>Cause I can't get enough, I can't get enough. I can't stay on the ground. Whoa, I can't get enough, I can't get enough. This is taking me now.
</p>
<p>
It's taking me higher, higher. Higher off the ground. It's taking me higher, higher. Higher off the ground.
</p>
<p>
The music's got me going higher. I feel like I can touch the sky.
</p>
<p>
It's taking me higher, higher. Higher off the ground. It's taking me higher, higher. Higher off the ground. 
</p>
<p>
It's taking me higher, higher. Higher off the ground. It's taking me higher, higher. Higher off the ground.

</p>
<h1>[ Now I know how to get down on the floor ]</h1>
<b>bold</b> <i>italic</i> <font class="u">underline</font> <a href="/">link</a>
<p>
Now I know how to get down on the floor. Experience the moves you can't ignore. But something 'bout this beat that's got me hooked. Come over here and take a closer look. 'Cause I can't get enough, I can't get enough
I can't stay on the ground. Whoa, I can't get enough, I can't get enough. This is taking me now.
</p>
<p>
It's taking me higher, higher. Higher off the ground. It's taking me higher, higher. Higher off the ground.

</p>
<h2>Experience the moves you can't ignore</h2>
I do this just for kicks, just for the thrill. I got this high without taking a pill. This move has got me way over the sun. I'm dancing like I am the only one. 
<p>Cause I can't get enough, I can't get enough. I can't stay on the ground. Whoa, I can't get enough, I can't get enough. This is taking me now.
</p>
<p>
It's taking me higher, higher. Higher off the ground. It's taking me higher, higher. Higher off the ground.
</p>
<p>
The music's got me going higher. I feel like I can touch the sky.
</p>
<p>
It's taking me higher, higher. Higher off the ground. It's taking me higher, higher. Higher off the ground. 
</p>
<p>
It's taking me higher, higher. Higher off the ground. It's taking me higher, higher. Higher off the ground.
</p>
</div>
</center>

Good For:
Role Play Characters / About Me Pages / Blogs / Sites / Guild Webbies, ect.
Featured Song:
Higher by Taio Cruz
Color Schemes:
Bellachima
Notes:
A wide content area with a title and subtitle. Block navigation goes across the top of the content area, which is lined by two different colored borders on either side. Simple headers and b/i/u give the style a very clean look.

[ Boxed In ]

<style>
#CSSbyTina {
}
#NoStealing {
}
body {
	background: #5fa5a6;
}
.sf {
	display: none;
}
table {
	background: none;
}
a:link, a:active, a:visited {
	font: 10.5px tahoma;
	font-weight: normal;
	color: #ffffff;
	text-decoration: none;
}
a:hover {
	color: #d2eaea;
	text-decoration: none;
}
a.nav:link, a.nav:active, a.nav:visited {
	font: 12px arial;
	font-weight: normal;
	display: block;
	color: #ffffff;
	text-decoration: none;
	text-align: left;
	text-transform: lowercase;
}
a.nav:hover {
	color: #ffffff;
	background-color: transparent;
	text-decoration: none;
	letter-spacing: 1px;
}
#save {
	top: 0px;
	left: 800px;
}
#title {
	top: 20px;
	left: 0px;
	width: auto;
	padding-left: 30px;
	padding-bottom: 5px;
}
#main {
	top: 105px;
	left: 80px;
	width: 600px;
	height: auto;
	overflow: auto;
	background-color: #b6e2e3;
	border: 1px solid #92cacb;
	padding: 5px;
	font: 7.5pt verdana;
	color: #549a9b;
	text-align: justify;
}
.box {
	width: 590px;
	height: auto;
	overflow: auto;
	background-color: #cff1f1;
	border: 1px solid #92cacb;
	padding: 5px;
	font: 7.5pt verdana;
	color: #549a9b;
	text-align: justify;
}
#navi {
	top: 105px;
	left: 690px;
	width: auto;
	height: auto;
	overflow: auto;
	padding: 5px;
}
h1 {
	font-family: century gothic;
	font-weight: normal;
	font-size: 18px;
	color: #264848;
	text-align: right;
	border-bottom: 1px solid #ffffff;
	text-transform: uppercase;
	margin-top: 0px;
	margin-bottom: 4px;
	padding-right: 100px;
}
h2 {
	font-family: impact;
	font-weight: normal;
	font-size: 16px;
	line-height: 12px;
	color: #ffffff;
	border-right: 60px solid #d2eaea;
	border-left: 300px solid #d2eaea;
	text-transform: lowercase;
	letter-spacing: 1px;
	text-align: center;
}
textarea {
	font: 6pt verdana;
	color: #FFFFFF;
	background: #d2eaea;
	border: 1px solid #b5d0d0;
	margin-bottom: 3px;
	height: 20px;
	width: 88px;
}
tr, td, body, .text {
	font-family: verdana;
	font-size: 7.5pt;
	color: #549a9b;
}
b {
	font: 7.5pt;
	font-weight: bold;
	color: #4b4b4b;
}
b.a {
	font: 50px impact;
	font-weight: normal;
	color: #ffffff;
	text-transform: uppercase;
	border-bottom: 5px solid #d2eaea;
}
b.b {
	font: 50px impact;
	font-weight: normal;
	color: #264848;
	text-transform: uppercase;
	border-bottom: 5px solid #d2eaea;
}
i {
	font: 7.5pt verdana;
	font-weight: normal;
	font-style: italic;
	color: #264848;
}
i.a {
	font: 14px arial;
	font-weight: normal;
	color: #264848;
	background-color: #d2eaea;
	padding-left: 50px;
	text-transform: uppercase;
}
.u {
	font: 7.5pt verdana;
	font-weight: normal;
	border-bottom: 1px solid #128687;
	color: #128687;
}
</style>
<div id="title" style="position: absolute;">
<b class="a">There's No </b> <b class="b">Light, </b> <b class="a">There's No Sound</b>
<br><i class="a">Hard to breathe, when you're underground.</i>
</div>
<div id="navi" style="position: absolute;">
<a href="http://www.neopets.com/" class="nav">link</a>
<a href="http://www.neopets.com/" class="nav">link</a>
<a href="http://www.neopets.com/" class="nav">link</a>
<a href="http://www.neopets.com/" class="nav">link</a>
<a href="/~riyvern" class="nav">css</a>
</div>
<div id="main" style="position: absolute;">
<h1>Can you hear me now?</h1>
<div class="box">
<b>bold</b> <i>italc</i> <font class="u">underline</font> <a href="/">link</a>
<p>
As I walk through the valley of the shadow of death, I wear my crown of thorns and pull the knife out my chest. I keep searching for something that I never seem to find. But maybe I won't, because I left it all behind. Now I'm stuck with this, and that'll never change. Always a part of me, until the very last day.
</p>
<p>
Where to go from here? What road to travel on? I spent my whole life choosing, and I always chose wrong. Will I try to have the will to be alive? Will I try because I've never seen the light? Blow it to the ground and it's now you see, You spent your whole life taking the best of me
</p>
<p>
Where'd you go? Where's your home? How'd you end up all alone? Can you hear me now? There's no light, there's no sound. Hard to breathe, when you're underground. Can you hear me now? Hear me now
</p>
<p>
How low can I keep pretending to be? That all the stars in the sky could mean something to me. Heaven will open up if I live on my knees. A man of many words, but of few deeds. Walking these streets, so absent of hope.
</p>
<p>
A pillow of concrete, a man with no home. Lend him a hand, then we're walking the way. Leave the virtue of pity, but we live with the shame. So scared to dream in a world with no sunlight. When you wake up, you know it's darker than last night. Quickly we forget, sacrifice gone by.
Born to walk away, been walking my whole life.
</p>
<p>
Where'd you go? Where's your home? How'd you end up all alone? Can you hear me now? There's no light, there's no sound. Hard to breathe, when you're underground. Can you hear me now? Hear me now
</p>
<p>
Look into my eyes and I see. What do I see? Nothing at all Take another look around me. What do I see? Nothing at all
</p>
<p>
Where'd you go? Where's your home? How'd you end up all alone? Can you hear me now? There's no light, there's no sound. Hard to breathe, when you're underground. Can you hear me now? Hear me now
</p>
<p>
Can you hear me? Hear me now
</p>
</div>

<h2>Can you hear me now?</h2>
<div class="box">
<b>bold</b> <i>italc</i> <font class="u">underline</font> <a href="/">link</a>
<p>
As I walk through the valley of the shadow of death, I wear my crown of thorns and pull the knife out my chest. I keep searching for something that I never seem to find. But maybe I won't, because I left it all behind. Now I'm stuck with this, and that'll never change. Always a part of me, until the very last day.
</p>
<p>
Where to go from here? What road to travel on? I spent my whole life choosing, and I always chose wrong. Will I try to have the will to be alive? Will I try because I've never seen the light? Blow it to the ground and it's now you see, You spent your whole life taking the best of me
</p>
<p>
Where'd you go? Where's your home? How'd you end up all alone? Can you hear me now? There's no light, there's no sound. Hard to breathe, when you're underground. Can you hear me now? Hear me now
</p>
<p>
How low can I keep pretending to be? That all the stars in the sky could mean something to me. Heaven will open up if I live on my knees. A man of many words, but of few deeds. Walking these streets, so absent of hope.
</p>
<p>
A pillow of concrete, a man with no home. Lend him a hand, then we're walking the way. Leave the virtue of pity, but we live with the shame. So scared to dream in a world with no sunlight. When you wake up, you know it's darker than last night. Quickly we forget, sacrifice gone by.
Born to walk away, been walking my whole life.
</p>
<p>
Where'd you go? Where's your home? How'd you end up all alone? Can you hear me now? There's no light, there's no sound. Hard to breathe, when you're underground. Can you hear me now? Hear me now
</p>
<p>
Look into my eyes and I see. What do I see? Nothing at all Take another look around me. What do I see? Nothing at all
</p>
<p>
Where'd you go? Where's your home? How'd you end up all alone? Can you hear me now? There's no light, there's no sound. Hard to breathe, when you're underground. Can you hear me now? Hear me now
</p>
<p>
Can you hear me? Hear me now
</p>
</div>
</div>
<div id="save" style="position: absolute;"></div>

Good For:
Role Play Characters / About Me Pages / Blogs / Sites / Guild Webbies, ect.
Featured Song:
Hear Me Now by Hollywood Undead
Color Schemes:
Xirett
Notes:
The bold title and the underlining title crown the top of this style. The lighter colored content boxes stand out against the darker background and the simple headers divide the content up nicely.

[ Crossed Out ]

<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 {
	width: 600px;
	height: auto;
	background-color: #202020;
	border-top: 1px solid #000000;
	padding: 5px;
	font: 40px calibri;
	color: #9f949d;
	text-transform: uppercase;
	text-align: center;
	line-height: 40px;
	overflow: hidden;
}
#main {
	width: 550px;
	height: auto;
	overflow: auto;
	background-color: #4d4d4d;
	padding: 5px;
	font: 7.5pt verdana;
	color: #9f949d;
	text-align: justify;
	border-bottom: 10px solid #000000;
}
#navi {
	width: 610px;
	height: auto;
	overflow: hidden;
	background-color: #000000;
}
#bg {
	left: 50px;
	top: 0px;
	width: auto;
	height: auto;
	font: 200px georgia;
	color: #222222;
	line-height: 200px;
}
h1 {
	font-family: arial;
	font-size: 26;
	font-weight: normal;
	color: #2c2c2c;
	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: #000000;
	font-weight: normal;
	text-align: left;
	text-transform: lowercase;
	border-bottom: #ffffff dashed 1px;
	margin-top: 3px;
	margin-bottom: 6px;
	line-height: 18px;
	padding-left: 10px;
}
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="bg" style="position: fixed;">
✖<br>✖<br>✖
</div>
<p>
</p>
<center>
<div id="title">
Determinate
</div>
<div id="navi">
<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="main">
<h1>gotta turn the world into your dance floor</h1>
<b>bold</b> <i>italic</i> <font class="u">underline</font> <a href="/">link</a>
<p>
Trying hard to fight these tears. I'm crazy worried. Messing with my head this fear. I'm so sorry. You know you gotta get it out. I can't take it. That's what being friends is about.
</p>
<p>
I, I want to cry. I can't deny. Tonight I wanna up and hide. And get inside. It isn't right. I gotta live in my life. I know I, I know I. I know I gotta do it. I know I, I know I. I know I gotta do it
</p>
<p>
Gotta turn the world into your dance floor. Determinate, determinate. Push until you can't and then demand more. Determinate, determinate. You and me together, we can make it better. Gotta turn the world into your dance floor
Determinate, determinate.


</p>
<h2>push until you can't and then demand more</h2>
Hate to feel this way. And waste a day. I gotta get myself on stage. I shouldn't wait or be afraidThe chips will fall where they may. I know I, I know I. I know I gotta do it. I know I, I know I. I know I gotta do it.
<p>
Gotta turn the world into your dance floor. Determinate, determinate. Push until you can't and then demand more. Determinate, determinate. You and me together, we can make it better. Gotta turn the world into your dance floor
Determinate, determinate.
</p>
<p>
It's Wen and I'm heaven-sent. Use it like a veteran
renegade, lemonade, music is my medicine. Go ahead and try to name a band we ain't better than. Reason why the whole world's picking us instead of them. People need a breather cause they're feeling that adrenaline. Stop! Now hurry up and let us in. Knock!. Cause we're coming to your house (and) people keep on smiling with the lemons in their mouths. I'm the real deal, you know how I feel. Why they in it for the bill I'm just in it for the thrill. Get down now I ain't playin' around put your feet up from the ground. And just make that sound right.
</p>
<p>
Gotta turn the world into your dance floor. Determinate, determinate. Push until you can't and then demand more. Determinate, determinate. You and me together, we can make it better. Gotta turn the world into your dance floor
Determinate, determinate.
</p>
<p>
Come on and, come on and. Come on and get it going. Come on and, come on and. Come on and get it going. On the dance floor. On the dance floor. Dance floor. Determinate.
</p>
</div>
</center>

Good For:
Role Play Characters / About Me Pages / Blogs / Guild Webbies, ect.
Featured Song:
Determinate by Lemonade Mouth
Color Schemes:
Black Ashes
Notes:
This spiffy style features three X's off to the left that float there when the page scrolls. The content area gets longer with the more content you add. Since the decorations on the left float, this style will not work in Internet Explorer. But you can make them work by changing their positioning from fixed to absolute. That will make them stay put while you scroll and make the layout work in IE.

[ Picture It ]

<style>
#CSSbyiKiwipop {
}
#MadeforVibe {
}
body {
	background: #f7f7ff;
}
.sf {
	display: none;
}
table {
	background: transparent;
}
#save {
	top: 50px;
	left: 900px;
}
a:link, a:active, a:visited {
	font: 7.5pt verdana;
	color: #f927d4;
	font-weight: normal;
	text-decoration: none;
}
a:hover {
	color: #90aaf8;
}
a.nav:link, a.nav:visited, a.nav:active {
	font: 5pt small fonts;
	font-weight: normal;
	color: #aeaeb3;
	background-color: #e9e9ef;
	text-decoration: none;
	display: block;
	text-align: center;
	padding: 3px;
	text-transform: uppercase;
}
a.nav:hover {
	color: #ffffff;
	background-color: #aeaeb3;
}
h1 {
	font-family: arial;
	font-size: 26;
	font-weight: normal;
	color: #ff54ff;
	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: #8694f6;
	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: #aeaeb3;
}
textarea {
	font: 6pt verdana;
	color: #d6d6e0;
	background: #e7e7f1;
	border: 1px solid #d6d6e0;
	margin-bottom: 3px;
	height: 20px;
	width: 88px;
}
img.pic {
	border: 5px solid #e9e9ef;
}
b {
	font: 7.5pt verdana;
	font-weight: bold;
	color: #1f5be4;
}
b.a {
	font: 40px impact;
	font-weight: normal;
	color: #a591f9;
	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: #fa85fe;
}
.u {
	font: 7.5pt verdana;
	font-weight: normal;
	border-bottom: 1px dashed #ce8eef;
	color: #ce8eef;
}
</style>
<center>
<table><td valign="top"><div style="width: 700px; height: auto; text-align: justify;">
<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="/" class="nav">link</a>
</td>
<td>
<a href="/" class="nav">link</a>
</td>
<td>
<a href="/" class="nav">link</a>
</td>
<td>
<a href="/" class="nav">link</a>
</td>
<td>
<a href="/" class="nav">link</a>
</td>
<td>
<a href="/" class="nav">link</a>
</td>
<td>
<a href="/" class="nav">link</a>
</td>
<td>
<a href="/" class="nav">link</a>
</td>
<td>
<a href="/" class="nav">link</a>
</td>
<td>
<a href="/" class="nav">link</a>
</td>
<td>
<a href="/" class="nav">link</a>
</td>

<td>
<a href="/~riyvern" class="nav">css</a>
</td>
</tr></table></center>

<h1>I'm sinking now, sinking now, sinking now *</h1>
<center><table cellspacing="10" cellpadding="0">
<td><img src="http://i52.tinypic.com/2usbf5u.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/2usbf5u.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></td></table>
</center>

Good For:
Role Play Characters / About Me Pages / Blogs / Sites / Guild Webbies, ect.
Featured Song:
Stars Shining Out by Trapnest
Color Schemes:
Dreamy
Notes:
This style has lots of room for content and images. The height is determined buy how much content you add and the width can be easily changed to whatevr you want.