Forbidden Forest

<style>
table {
	display: none;
}
.page table {
	display: table;
}
body {
	background-image: url("http://i.imgur.com/fcn7y97.png");
}
#layout {
	width: 1000px;
	height: 700px;
	margin: 0 auto;
	background-image: url("http://i.imgur.com/Lbr5lNV.png");
}
#main {
	font: 9pt tahoma;
	color: #000000;
	top: 250px;
	left: 30px;
	width: 940px;
	height: 425px;
	overflow: hidden;
}
.page {
	height: 425px;
	overflow: auto;
}
.table {
	display: inline;
	text-align: left;
}
h1 {
	font-weight: normal;
	font: 13pt tahoma;
	text-align: center;
	color: #9a99ad;
	padding-left: 5px;
	line-height: 20px;
	letter-spacing: 4px;
	border-bottom: 4px double #9dcfd4;
}
h2 {
	font-weight: normal;
	font: 11pt tahoma;
	text-align: left;
	color: #9dcfd4;
	padding-left: 5px;
	line-height: 20px;
	letter-spacing: 2px;
	border-bottom: 1px solid #9a99ad;
}
b {
	color: #aaabd2;
	font: 10pt tahoma;
	font-weight: bold;
	line-height: 14px;
}
i {
	color: #9dcfd4;
	font: 9pt tahoma;
	font-style: italic;
	line-height: 14px;
}
a:link, a:visited, a:active {
	color: #5ba4ad;
	font: 9pt tahoma;
	text-decoration: none;
}
a:hover {
	color: #9dcfd4;
	font: 9pt tahoma;
	text-decoration: none;
}
</style><br><br><br><div id="layout" style="position: relative;">


<div id="main" style="position: absolute;">
<div class="page">
<h1>The Slugg Club Layouts</h1>
<h2>Rules & Information</h2>
These layouts are available for anyone in <a href="/~slugclubministry">The Slugg Club</a> guild to use for their classes, activities, homework, or other guild use. You are welcome to edit them as you'd like. <br>If you need any help or have any questions, <a href="/neomessages.phtml?type=send&recipient=painted_dreams87">neomail Heather</a>.<br><br>

To use a layout, first copy and paste the coding in the box under the layout you like. It will have your image, background, and styling. Then, copy and paste the coding in the box under <b>Rest of Coding</b>. It will have the coding that is the same for every layout. That needs to go directly under the code you already pasted in. Save, and your layout is ready to use!


<h2>The Layouts</h2>
<table width="100%"><tr align="center"><td width="33%">
<img src="http://i.imgur.com/nLNROUC.png"><br><b>Antique:</b><br><textarea><style>
table {
	display: none;
}
.page table {
	display: table;
}
body {
	background-image: url("http://i.imgur.com/soGDlIG.png");
}
#layout {
	width: 800px;
	height: 600px;
	margin: 0 auto;
	background-image: url("http://i.imgur.com/hknTkCh.png");
}
#main {
	font: 10pt tahoma;
	color: #000000;
	top: 180px;
	left: 230px;
	width: 570px;
	height: 390px;
	overflow: hidden;
}
.page {
	height: 390px;
	overflow: auto;
}
#nav {
	top: 180px;
	left: 0px;
	width: 190px;
	height: 390px;
	overflow: hidden;
	text-align: center;
}
.table {
	display: inline;
	text-align: left;
}
td {
	padding: 10px;
}
textarea#button {
	font: 9pt tahoma;
	color: #9d7c53;
	overflow: hidden;
	width: 90px;
	height: 30px;
	border: 1px solid #cdb8c8;
}
h1 {
	font: 13pt tahoma;
	color: #d37e50;
	text-align: center;
	border-width: 2px;
	border-bottom-style: solid;
	border-top-style: solid;
	border-color: #917260;
	letter-spacing: 4px;
	line-height: 25px;
}
h2 {
	font: 11pt tahoma;
	color: #fff9ec;
	text-align: center;
	background-color: #917260;
	letter-spacing: 2px;
	line-height: 25px;
}
h2:hover {
	font: 11pt tahoma;
	color: #917260;
	text-align: center;
	background-color: #fff9ec;
	letter-spacing: 2px;
	line-height: 25px;
}
h3 {
	font: 12pt tahoma;
	color: #c0bfaa;
	border-width: 1px;
	border-bottom-style: solid;
	border-top-style: solid;
	border-color: #cdb8c8;
	letter-spacing: 2px;
	line-height: 25px;
}
b {
	color: #917260;
	font: 10pt tahoma;
	font-weight: bold;
	line-height: 14px;
}
i {
	color: #c0bfaa;
	font: 10pt tahoma;
	font-style: italic;
	line-height: 14px;
}
a:link, a:visited, a:active {
	color: #d37e50;
	font: 10pt tahoma;
	text-decoration: none;
}
a:hover {
	color: #917260;
	font: 10pt tahoma;
	text-decoration: none;
}
</style></textarea></td>

<td width="33%">
<img src="http://i.imgur.com/PRJpaJn.png"><br><b>Snowy Owl:</b><br><textarea><style>
table {
	display: none;
}
.page table {
	display: table;
}
body {
	background-image: url("http://i.imgur.com/wa0VACQ.png");
}
#layout {
	width: 800px;
	height: 600px;
	margin: 0 auto;
	background-image: url("http://i.imgur.com/O49Gad1.png");
}
#main {
	font: 10pt tahoma;
	color: #000000;
	top: 180px;
	left: 230px;
	width: 570px;
	height: 390px;
	overflow: hidden;
}
.page {
	height: 390px;
	overflow: auto;
}
#nav {
	top: 180px;
	left: 0px;
	width: 190px;
	height: 390px;
	overflow: hidden;
	text-align: center;
}
.table {
	display: inline;
	text-align: left;
}
td {
	padding: 10px;
}
textarea#button {
	font: 9pt tahoma;
	color: #9d7c53;
	overflow: hidden;
	width: 90px;
	height: 30px;
	border: 1px solid #cdb8c8;
}
h1 {
	font: 13pt tahoma;
	color: #888dad;
	text-align: center;
	border-width: 2px;
	border-bottom-style: solid;
	border-top-style: solid;
	border-color: #bbced2;
	letter-spacing: 4px;
	line-height: 25px;
}
h2 {
	font: 11pt tahoma;
	color: #bbced2;
	text-align: center;
	background-color: #5c5c90;
	letter-spacing: 2px;
	line-height: 25px;
}
h2:hover {
	font: 11pt tahoma;
	color: #5c5c90;
	text-align: center;
	background-color: #bbced2;
	letter-spacing: 2px;
	line-height: 25px;
}
h3 {
	font: 12pt tahoma;
	color: #bbced2;
	border-width: 1px;
	border-bottom-style: solid;
	border-top-style: solid;
	border-color: #888dad;
	letter-spacing: 2px;
	line-height: 25px;
}
b {
	color: #888dad;
	font: 10pt tahoma;
	font-weight: bold;
	line-height: 14px;
}
i {
	color: #5c5c90;
	font: 10pt tahoma;
	font-style: italic;
	line-height: 14px;
}
a:link, a:visited, a:active {
	color: #bbced2;
	font: 10pt tahoma;
	text-decoration: none;
}
a:hover {
	color: #888dad;
	font: 10pt tahoma;
	text-decoration: none;
}
</style></textarea></td>

<td width="33%">
<img src="http://i.imgur.com/p9C1zAz.png"><br><b>House of Black:</b><br><textarea><style>
table {
	display: none;
}
.page table {
	display: table;
}
body {
	background-image: url("http://i.imgur.com/PsOmtvh.png");
}
#layout {
	width: 800px;
	height: 600px;
	margin: 0 auto;
	background-image: url("http://i.imgur.com/saN8U42.png");
}
#main {
	font: 10pt tahoma;
	color: #000000;
	top: 180px;
	left: 230px;
	width: 570px;
	height: 390px;
	overflow: hidden;
}
.page {
	height: 390px;
	overflow: auto;
}
#nav {
	top: 180px;
	left: 0px;
	width: 190px;
	height: 390px;
	overflow: hidden;
	text-align: center;
}
.table {
	display: inline;
	text-align: left;
}
td {
	padding: 10px;
}
textarea#button {
	font: 9pt tahoma;
	color: #9d7c53;
	overflow: hidden;
	width: 90px;
	height: 30px;
	border: 1px solid #cdb8c8;
}
h1 {
	font: 13pt tahoma;
	color: #ad8e8f;
	text-align: center;
	border-width: 2px;
	border-bottom-style: solid;
	border-top-style: solid;
	border-color: #d5c9c5;
	letter-spacing: 4px;
	line-height: 25px;
}
h2 {
	font: 11pt tahoma;
	color: #d5c9c5;
	text-align: center;
	background-color: #424849;
	letter-spacing: 2px;
	line-height: 25px;
}
h2:hover {
	font: 11pt tahoma;
	color: #424849;
	text-align: center;
	background-color: #d5c9c5;
	letter-spacing: 2px;
	line-height: 25px;
}
h3 {
	font: 12pt tahoma;
	color: #d5c9c5;
	border-width: 1px;
	border-bottom-style: solid;
	border-top-style: solid;
	border-color: #ad8e8f;
	letter-spacing: 2px;
	line-height: 25px;
}
b {
	color: #ad8e8f;
	font: 10pt tahoma;
	font-weight: bold;
	line-height: 14px;
}
i {
	color: #424849;
	font: 10pt tahoma;
	font-style: italic;
	line-height: 14px;
}
a:link, a:visited, a:active {
	color: #9b8570;
	font: 10pt tahoma;
	text-decoration: none;
}
a:hover {
	color: #ad8e8f;
	font: 10pt tahoma;
	text-decoration: none;
}
</style></textarea></td>
</tr><tr align="center"><td width="33%">
<img src="http://i.imgur.com/cmkFhA2.png"><br><b>Floral Library:</b><br><textarea><style>
table {
	display: none;
}
.page table {
	display: table;
}
body {
	background-image: url("http://i.imgur.com/72erWDl.png");
}
#layout {
	width: 800px;
	height: 600px;
	margin: 0 auto;
	background-image: url("http://i.imgur.com/Fxpiz1s.png");
}
#main {
	font: 10pt tahoma;
	color: #000000;
	top: 180px;
	left: 230px;
	width: 570px;
	height: 390px;
	overflow: hidden;
}
.page {
	height: 390px;
	overflow: auto;
}
#nav {
	top: 180px;
	left: 0px;
	width: 190px;
	height: 390px;
	overflow: hidden;
	text-align: center;
}
.table {
	display: inline;
	text-align: left;
}
td {
	padding: 10px;
}
textarea#button {
	font: 9pt tahoma;
	color: #9d7c53;
	overflow: hidden;
	width: 90px;
	height: 30px;
	border: 1px solid #cdb8c8;
}
h1 {
	font: 13pt tahoma;
	color: #3e6a94;
	text-align: center;
	border-width: 2px;
	border-bottom-style: solid;
	border-top-style: solid;
	border-color: #82bb9e;
	letter-spacing: 4px;
	line-height: 25px;
}
h2 {
	font: 11pt tahoma;
	color: #dce5d3;
	text-align: center;
	background-color: #8c8a71;
	letter-spacing: 2px;
	line-height: 25px;
}
h2:hover {
	font: 11pt tahoma;
	color: #8c8a71;
	text-align: center;
	background-color: #dce5d3;
	letter-spacing: 2px;
	line-height: 25px;
}
h3 {
	font: 12pt tahoma;
	color: #82bb9e;
	border-width: 1px;
	border-bottom-style: solid;
	border-top-style: solid;
	border-color: #3e6a94;
	letter-spacing: 2px;
	line-height: 25px;
}
b {
	color: #82bb9e;
	font: 10pt tahoma;
	font-weight: bold;
	line-height: 14px;
}
i {
	color: #8c8a71;
	font: 10pt tahoma;
	font-style: italic;
	line-height: 14px;
}
a:link, a:visited, a:active {
	color: #3e6a94;
	font: 10pt tahoma;
	text-decoration: none;
}
a:hover {
	color: #8c8a71;
	font: 10pt tahoma;
	text-decoration: none;
}
</style></textarea></td>

<td width="33%">
<img src="http://i.imgur.com/2GVfq5I.png"><br><b>Pastel Castle:</b><br><textarea><style>
table {
	display: none;
}
.page table {
	display: table;
}
body {
	background-image: url("http://i.imgur.com/6nUAJdK.png");
}
#layout {
	width: 800px;
	height: 600px;
	margin: 0 auto;
	background-image: url("http://i.imgur.com/DNLuBAf.png");
}
#main {
	font: 10pt tahoma;
	color: #000000;
	top: 180px;
	left: 230px;
	width: 570px;
	height: 390px;
	overflow: hidden;
}
.page {
	height: 390px;
	overflow: auto;
}
#nav {
	top: 180px;
	left: 0px;
	width: 190px;
	height: 390px;
	overflow: hidden;
	text-align: center;
}
.table {
	display: inline;
	text-align: left;
}
td {
	padding: 10px;
}
textarea#button {
	font: 9pt tahoma;
	color: #9d7c53;
	overflow: hidden;
	width: 90px;
	height: 30px;
	border: 1px solid #cdb8c8;
}
h1 {
	font: 13pt tahoma;
	color: #abb4c3;
	text-align: center;
	border-width: 2px;
	border-bottom-style: solid;
	border-top-style: solid;
	border-color: #dac6b6;
	letter-spacing: 4px;
	line-height: 25px;
}
h2 {
	font: 11pt tahoma;
	color: #fefeee;
	text-align: center;
	background-color: #bcb5bd;
	letter-spacing: 2px;
	line-height: 25px;
}
h2:hover {
	font: 11pt tahoma;
	color: #bcb5bd;
	text-align: center;
	background-color: #fefeee;
	letter-spacing: 2px;
	line-height: 25px;
}
h3 {
	font: 12pt tahoma;
	color: #dac6b6;
	border-width: 1px;
	border-bottom-style: solid;
	border-top-style: solid;
	border-color: #abb4c3;
	letter-spacing: 2px;
	line-height: 25px;
}
b {
	color: #abb4c3;
	font: 10pt tahoma;
	font-weight: bold;
	line-height: 14px;
}
i {
	color: #dac6b6;
	font: 10pt tahoma;
	font-style: italic;
	line-height: 14px;
}
a:link, a:visited, a:active {
	color: #bcb5bd;
	font: 10pt tahoma;
	text-decoration: none;
}
a:hover {
	color: #abb4c3;
	font: 10pt tahoma;
	text-decoration: none;
}
</style></textarea></td>

<td width="33%">
<img src="http://i.imgur.com/Zb96sfn.png"><br><b>Plants and Potions:</b><br><textarea><style>
table {
	display: none;
}
.page table {
	display: table;
}
body {
	background-image: url("http://i.imgur.com/ZNN2Nth.png");
}
#layout {
	width: 800px;
	height: 600px;
	margin: 0 auto;
	background-image: url("http://i.imgur.com/VoXmp86.png");
}
#main {
	font: 10pt tahoma;
	color: #000000;
	top: 180px;
	left: 230px;
	width: 570px;
	height: 390px;
	overflow: hidden;
}
.page {
	height: 390px;
	overflow: auto;
}
#nav {
	top: 180px;
	left: 0px;
	width: 190px;
	height: 390px;
	overflow: hidden;
	text-align: center;
}
.table {
	display: inline;
	text-align: left;
}
td {
	padding: 10px;
}
textarea#button {
	font: 9pt tahoma;
	color: #9d7c53;
	overflow: hidden;
	width: 90px;
	height: 30px;
	border: 1px solid #cdb8c8;
}
h1 {
	font: 13pt tahoma;
	color: #745a48;
	text-align: center;
	border-width: 2px;
	border-bottom-style: solid;
	border-top-style: solid;
	border-color: #9fbe9b;
	letter-spacing: 4px;
	line-height: 25px;
}
h2 {
	font: 11pt tahoma;
	color: #fefee4;
	text-align: center;
	background-color: #8f7f4f;
	letter-spacing: 2px;
	line-height: 25px;
}
h2:hover {
	font: 11pt tahoma;
	color: #8f7f4f;
	text-align: center;
	background-color: #fefee4;
	letter-spacing: 2px;
	line-height: 25px;
}
h3 {
	font: 12pt tahoma;
	color: #9fbe9b;
	border-width: 1px;
	border-bottom-style: solid;
	border-top-style: solid;
	border-color: #745a48;
	letter-spacing: 2px;
	line-height: 25px;
}
b {
	color: #745a48;
	font: 10pt tahoma;
	font-weight: bold;
	line-height: 14px;
}
i {
	color: #8f7f4f;
	font: 10pt tahoma;
	font-style: italic;
	line-height: 14px;
}
a:link, a:visited, a:active {
	color: #9fbe9b;
	font: 10pt tahoma;
	text-decoration: none;
}
a:hover {
	color: #745a48;
	font: 10pt tahoma;
	text-decoration: none;
}
</style></textarea></td>
</tr><tr align="center"><td width="33%">
<img src="http://i.imgur.com/kjXcTDy.png"><br><b>Trio Drawing:</b><br><textarea><style>
table {
	display: none;
}
.page table {
	display: table;
}
body {
	background-image: url("http://i.imgur.com/6X2Xkaq.png");
}
#layout {
	width: 800px;
	height: 600px;
	margin: 0 auto;
	background-image: url("http://i.imgur.com/iNtNSLE.png");
}
#main {
	font: 10pt tahoma;
	color: #000000;
	top: 180px;
	left: 230px;
	width: 570px;
	height: 390px;
	overflow: hidden;
}
.page {
	height: 390px;
	overflow: auto;
}
#nav {
	top: 180px;
	left: 0px;
	width: 190px;
	height: 390px;
	overflow: hidden;
	text-align: center;
}
.table {
	display: inline;
	text-align: left;
}
td {
	padding: 10px;
}
textarea#button {
	font: 9pt tahoma;
	color: #9d7c53;
	overflow: hidden;
	width: 90px;
	height: 30px;
	border: 1px solid #cdb8c8;
}
h1 {
	font: 13pt tahoma;
	color: #a27976;
	text-align: center;
	border-width: 2px;
	border-bottom-style: solid;
	border-top-style: solid;
	border-color: #d4bba6;
	letter-spacing: 4px;
	line-height: 25px;
}
h2 {
	font: 11pt tahoma;
	color: #fefee4;
	text-align: center;
	background-color: #755f51;
	letter-spacing: 2px;
	line-height: 25px;
}
h2:hover {
	font: 11pt tahoma;
	color: #755f51;
	text-align: center;
	background-color: #f3dcc1;
	letter-spacing: 2px;
	line-height: 25px;
}
h3 {
	font: 12pt tahoma;
	color: #d4bba6;
	border-width: 1px;
	border-bottom-style: solid;
	border-top-style: solid;
	border-color: #a27976;
	letter-spacing: 2px;
	line-height: 25px;
}
b {
	color: #a27976;
	font: 10pt tahoma;
	font-weight: bold;
	line-height: 14px;
}
i {
	color: #d4bba6;
	font: 10pt tahoma;
	font-style: italic;
	line-height: 14px;
}
a:link, a:visited, a:active {
	color: #f5a474;
	font: 10pt tahoma;
	text-decoration: none;
}
a:hover {
	color: #a27976;
	font: 10pt tahoma;
	text-decoration: none;
}
</style></textarea></td>

<td width="33%">
<img src="http://i.imgur.com/VdcHBG1.png"><br><b>Cartoon:</b><br><textarea><style>
table {
	display: none;
}
.page table {
	display: table;
}
body {
	background-image: url("http://i.imgur.com/jGxX5Qo.png");
}
#layout {
	width: 800px;
	height: 600px;
	margin: 0 auto;
	background-image: url("http://i.imgur.com/7dy3ZQO.png");
}
#main {
	font: 10pt tahoma;
	color: #000000;
	top: 180px;
	left: 230px;
	width: 570px;
	height: 390px;
	overflow: hidden;
}
.page {
	height: 390px;
	overflow: auto;
}
#nav {
	top: 180px;
	left: 0px;
	width: 190px;
	height: 390px;
	overflow: hidden;
	text-align: center;
}
.table {
	display: inline;
	text-align: left;
}
td {
	padding: 10px;
}
textarea#button {
	font: 9pt tahoma;
	color: #9d7c53;
	overflow: hidden;
	width: 90px;
	height: 30px;
	border: 1px solid #cdb8c8;
}
h1 {
	font: 13pt tahoma;
	color: #c54d86;
	text-align: center;
	border-width: 2px;
	border-bottom-style: solid;
	border-top-style: solid;
	border-color: #000000;
	letter-spacing: 4px;
	line-height: 25px;
}
h2 {
	font: 11pt tahoma;
	color: #dbf4f5;
	text-align: center;
	background-color: #8b7096;
	letter-spacing: 2px;
	line-height: 25px;
}
h2:hover {
	font: 11pt tahoma;
	color: #8b7096;
	text-align: center;
	background-color: #dbf4f5;
	letter-spacing: 2px;
	line-height: 25px;
}
h3 {
	font: 12pt tahoma;
	color: #000000;
	border-width: 1px;
	border-bottom-style: solid;
	border-top-style: solid;
	border-color: #c54d86;
	letter-spacing: 2px;
	line-height: 25px;
}
b {
	color: #cdb8c8;
	font: 10pt tahoma;
	font-weight: bold;
	line-height: 14px;
}
i {
	color: #b19ac8;
	font: 10pt tahoma;
	font-style: italic;
	line-height: 14px;
}
a:link, a:visited, a:active {
	color: #c54d86;
	font: 10pt tahoma;
	text-decoration: none;
}
a:hover {
	color: #8b7096;
	font: 10pt tahoma;
	text-decoration: none;
}
</style></textarea></td>

<td width="33%">
<img src="http://i.imgur.com/Hj6oQRp.png"><br><b>Dementor:</b><br><textarea><style>
table {
	display: none;
}
.page table {
	display: table;
}
body {
	background-image: url("http://i.imgur.com/ezaMz68.png");
}
#layout {
	width: 800px;
	height: 600px;
	margin: 0 auto;
	background-image: url("http://i.imgur.com/6oVgmIi.png");
}
#main {
	font: 10pt tahoma;
	color: #000000;
	top: 180px;
	left: 230px;
	width: 570px;
	height: 390px;
	overflow: hidden;
}
.page {
	height: 390px;
	overflow: auto;
}
#nav {
	top: 180px;
	left: 0px;
	width: 190px;
	height: 390px;
	overflow: hidden;
	text-align: center;
}
.table {
	display: inline;
	text-align: left;
}
td {
	padding: 10px;
}
textarea#button {
	font: 9pt tahoma;
	color: #9d7c53;
	overflow: hidden;
	width: 90px;
	height: 30px;
	border: 1px solid #cdb8c8;
}
h1 {
	font: 13pt tahoma;
	color: #a44d42;
	text-align: center;
	border-width: 2px;
	border-bottom-style: solid;
	border-top-style: solid;
	border-color: #e19f7d;
	letter-spacing: 4px;
	line-height: 25px;
}
h2 {
	font: 11pt tahoma;
	color: #cdcdcd;
	text-align: center;
	background-color: #946c72;
	letter-spacing: 2px;
	line-height: 25px;
}
h2:hover {
	font: 11pt tahoma;
	color: #946c72;
	text-align: center;
	background-color: #cdcdcd;
	letter-spacing: 2px;
	line-height: 25px;
}
h3 {
	font: 12pt tahoma;
	color: #e19f7d;
	border-width: 1px;
	border-bottom-style: solid;
	border-top-style: solid;
	border-color: #a44d42;
	letter-spacing: 2px;
	line-height: 25px;
}
b {
	color: #e19f7d;
	font: 10pt tahoma;
	font-weight: bold;
	line-height: 14px;
}
i {
	color: #a44d42;
	font: 10pt tahoma;
	font-style: italic;
	line-height: 14px;
}
a:link, a:visited, a:active {
	color: #952d37;
	font: 10pt tahoma;
	text-decoration: none;
}
a:hover {
	color: #e19f7d;
	font: 10pt tahoma;
	text-decoration: none;
}
</style></textarea></td>

</tr><tr align="center"><td width="33%">
<img src="http://i.imgur.com/n8pTbaP.png"><br><b>Patronus:</b><br><textarea><style>
table {
	display: none;
}
.page table {
	display: table;
}
body {
	background-image: url("http://i.imgur.com/kbkLHsD.png");
}
#layout {
	width: 800px;
	height: 600px;
	margin: 0 auto;
	background-image: url("http://i.imgur.com/HsBYPjp.png");
}
#main {
	font: 10pt tahoma;
	color: #000000;
	top: 180px;
	left: 230px;
	width: 570px;
	height: 390px;
	overflow: hidden;
}
.page {
	height: 390px;
	overflow: auto;
}
#nav {
	top: 180px;
	left: 0px;
	width: 190px;
	height: 390px;
	overflow: hidden;
	text-align: center;
}
.table {
	display: inline;
	text-align: left;
}
td {
	padding: 10px;
}
textarea#button {
	font: 9pt tahoma;
	color: #9d7c53;
	overflow: hidden;
	width: 90px;
	height: 30px;
	border: 1px solid #cdb8c8;
}
h1 {
	font: 13pt tahoma;
	color: #79b0c1;
	text-align: center;
	border-width: 2px;
	border-bottom-style: solid;
	border-top-style: solid;
	border-color: #bad3db;
	letter-spacing: 4px;
	line-height: 25px;
}
h2 {
	font: 11pt tahoma;
	color: #bde1ec;
	text-align: center;
	background-color: #2b6184;
	letter-spacing: 2px;
	line-height: 25px;
}
h2:hover {
	font: 11pt tahoma;
	color: #2b6184;
	text-align: center;
	background-color: #bde1ec;
	letter-spacing: 2px;
	line-height: 25px;
}
h3 {
	font: 12pt tahoma;
	color: #bad3db;
	border-width: 1px;
	border-bottom-style: solid;
	border-top-style: solid;
	border-color: #79b0c1;
	letter-spacing: 2px;
	line-height: 25px;
}
b {
	color: #79b0c1;
	font: 10pt tahoma;
	font-weight: bold;
	line-height: 14px;
}
i {
	color: #2b6184;
	font: 10pt tahoma;
	font-style: italic;
	line-height: 14px;
}
a:link, a:visited, a:active {
	color: #20b1cb;
	font: 10pt tahoma;
	text-decoration: none;
}
a:hover {
	color: #bad3db;
	font: 10pt tahoma;
	text-decoration: none;
}
</style></textarea></td>

<td width="33%">
<img src="http://i.imgur.com/hZucqmq.png"><br><b>Green Cartoon:</b><br><textarea><style>
table {
	display: none;
}
.page table {
	display: table;
}
body {
	background-image: url("http://i.imgur.com/ZGkz0li.png");
}
#layout {
	width: 800px;
	height: 600px;
	margin: 0 auto;
	background-image: url("http://i.imgur.com/60SSX27.png");
}
#main {
	font: 10pt tahoma;
	color: #000000;
	top: 180px;
	left: 230px;
	width: 570px;
	height: 390px;
	overflow: hidden;
}
.page {
	height: 390px;
	overflow: auto;
}
#nav {
	top: 180px;
	left: 0px;
	width: 190px;
	height: 390px;
	overflow: hidden;
	text-align: center;
}
.table {
	display: inline;
	text-align: left;
}
td {
	padding: 10px;
}
textarea#button {
	font: 9pt tahoma;
	color: #9d7c53;
	overflow: hidden;
	width: 90px;
	height: 30px;
	border: 1px solid #cdb8c8;
}
h1 {
	font: 13pt tahoma;
	color: #2f4044;
	text-align: center;
	border-width: 2px;
	border-bottom-style: solid;
	border-top-style: solid;
	border-color: #cdd9cd;
	letter-spacing: 4px;
	line-height: 25px;
}
h2 {
	font: 11pt tahoma;
	color: #cdd9cd;
	text-align: center;
	background-color: #2f4044;
	letter-spacing: 2px;
	line-height: 25px;
}
h2:hover {
	font: 11pt tahoma;
	color: #2f4044;
	text-align: center;
	background-color: #cdd9cd;
	letter-spacing: 2px;
	line-height: 25px;
}
h3 {
	font: 12pt tahoma;
	color: #cdd9cd;
	border-width: 1px;
	border-bottom-style: solid;
	border-top-style: solid;
	border-color: #2f4044;
	letter-spacing: 2px;
	line-height: 25px;
}
b {
	color: #627173;
	font: 10pt tahoma;
	font-weight: bold;
	line-height: 14px;
}
i {
	color: #2f4044;
	font: 10pt tahoma;
	font-style: italic;
	line-height: 14px;
}
a:link, a:visited, a:active {
	color: #cdd9cd;
	font: 10pt tahoma;
	text-decoration: none;
}
a:hover {
	color: #2f4044;
	font: 10pt tahoma;
	text-decoration: none;
}
</style></textarea></td>

<td width="33%">
<img src="http://i.imgur.com/AXGp5DN.png"><br><b>Red Cartoon:</b><br><textarea><style>
table {
	display: none;
}
.page table {
	display: table;
}
body {
	background-image: url("http://i.imgur.com/hUBp4QB.png");
}
#layout {
	width: 800px;
	height: 600px;
	margin: 0 auto;
	background-image: url("http://i.imgur.com/tgdtFkm.png");
}
#main {
	font: 10pt tahoma;
	color: #000000;
	top: 180px;
	left: 230px;
	width: 570px;
	height: 390px;
	overflow: hidden;
}
.page {
	height: 390px;
	overflow: auto;
}
#nav {
	top: 180px;
	left: 0px;
	width: 190px;
	height: 390px;
	overflow: hidden;
	text-align: center;
}
.table {
	display: inline;
	text-align: left;
}
td {
	padding: 10px;
}
textarea#button {
	font: 9pt tahoma;
	color: #9d7c53;
	overflow: hidden;
	width: 90px;
	height: 30px;
	border: 1px solid #cdb8c8;
}
h1 {
	font: 13pt tahoma;
	color: #a41143;
	text-align: center;
	border-width: 2px;
	border-bottom-style: solid;
	border-top-style: solid;
	border-color: #e6d1b4;
	letter-spacing: 4px;
	line-height: 25px;
}
h2 {
	font: 11pt tahoma;
	color: #e6d1b4;
	text-align: center;
	background-color: #a41143;
	letter-spacing: 2px;
	line-height: 25px;
}
h2:hover {
	font: 11pt tahoma;
	color: #a41143;
	text-align: center;
	background-color: #e6d1b4;
	letter-spacing: 2px;
	line-height: 25px;
}
h3 {
	font: 12pt tahoma;
	color: #e6d1b4;
	border-width: 1px;
	border-bottom-style: solid;
	border-top-style: solid;
	border-color: #a41143;
	letter-spacing: 2px;
	line-height: 25px;
}
b {
	color: #6d555f;
	font: 10pt tahoma;
	font-weight: bold;
	line-height: 14px;
}
i {
	color: #a41143;
	font: 10pt tahoma;
	font-style: italic;
	line-height: 14px;
}
a:link, a:visited, a:active {
	color: #e6d1b4;
	font: 10pt tahoma;
	text-decoration: none;
}
a:hover {
	color: #a41143;
	font: 10pt tahoma;
	text-decoration: none;
}
</style></textarea></td>
</tr><tr align="center"><td width="33%">
<img src="http://i.imgur.com/HZUTGtO.png"><br><b>Books:</b><br><textarea><style>
table {
	display: none;
}
.page table {
	display: table;
}
body {
	background-image: url("http://i.imgur.com/UVQ6jrK.png");
}
#layout {
	width: 800px;
	height: 600px;
	margin: 0 auto;
	background-image: url("http://i.imgur.com/ssunBqN.png");
}
#main {
	font: 10pt tahoma;
	color: #000000;
	top: 180px;
	left: 230px;
	width: 570px;
	height: 390px;
	overflow: hidden;
}
.page {
	height: 390px;
	overflow: auto;
}
#nav {
	top: 180px;
	left: 0px;
	width: 190px;
	height: 390px;
	overflow: hidden;
	text-align: center;
}
.table {
	display: inline;
	text-align: left;
}
td {
	padding: 10px;
}
h1 {
	font: 13pt tahoma;
	color: #9d8593;
	text-align: center;
	border-width: 2px;
	border-bottom-style: solid;
	border-top-style: solid;
	border-color: #6c6077;
	letter-spacing: 4px;
	line-height: 25px;
}
h2 {
	font: 11pt tahoma;
	color: #e8d7d0;
	text-align: center;
	background-color: #756b77;
	letter-spacing: 2px;
	line-height: 25px;
}
h2:hover {
	font: 11pt tahoma;
	color: #756b77;
	text-align: center;
	background-color: #e8d7d0;
	letter-spacing: 2px;
	line-height: 25px;
}
h3 {
	font: 12pt tahoma;
	color: #6c6077;
	border-width: 1px;
	border-bottom-style: solid;
	border-top-style: solid;
	border-color: #9d8593;
	letter-spacing: 2px;
	line-height: 25px;
}
b {
	color: #9d8593;
	font: 10pt tahoma;
	font-weight: bold;
	line-height: 14px;
}
i {
	color: #6c6077;
	font: 10pt tahoma;
	font-style: italic;
	line-height: 14px;
}
a:link, a:visited, a:active {
	color: #e8d7d0;
	font: 10pt tahoma;
	text-decoration: none;
}
a:hover {
	color: #756b77;
	font: 10pt tahoma;
	text-decoration: none;
}
</style></textarea></td>


<td width="33%">
<img src="http://i.imgur.com/0BodbaD.png"><br><b>Hogwarts Express:</b><br><textarea><style>
table {
	display: none;
}
.page table {
	display: table;
}
body {
	background-image: url("http://i.imgur.com/adHfTGi.png");
}
#layout {
	width: 800px;
	height: 600px;
	margin: 0 auto;
	background-image: url("http://i.imgur.com/qNdD6oq.png");
}
#main {
	font: 10pt tahoma;
	color: #000000;
	top: 180px;
	left: 230px;
	width: 570px;
	height: 390px;
	overflow: hidden;
}
.page {
	height: 390px;
	overflow: auto;
}
#nav {
	top: 180px;
	left: 0px;
	width: 190px;
	height: 390px;
	overflow: hidden;
	text-align: center;
}
.table {
	display: inline;
	text-align: left;
}
td {
	padding: 10px;
}
h1 {
	font: 13pt tahoma;
	color: #8aa5a8;
	text-align: center;
	border-width: 2px;
	border-bottom-style: solid;
	border-top-style: solid;
	border-color: #6c6077;
	letter-spacing: 4px;
	line-height: 25px;
}
h2 {
	font: 11pt tahoma;
	color: #c0d3df;
	text-align: center;
	background-color: #4e5c6e;
	letter-spacing: 2px;
	line-height: 25px;
}
h2:hover {
	font: 11pt tahoma;
	color: #4e5c6e;
	text-align: center;
	background-color: #c0d3df;
	letter-spacing: 2px;
	line-height: 25px;
}
h3 {
	font: 12pt tahoma;
	color: #6c6077;
	border-width: 1px;
	border-bottom-style: solid;
	border-top-style: solid;
	border-color: #8aa5a8;
	letter-spacing: 2px;
	line-height: 25px;
}
b {
	color: #4e5c6e;
	font: 10pt tahoma;
	font-weight: bold;
	line-height: 14px;
}
i {
	color: #527580;
	font: 10pt tahoma;
	font-style: italic;
	line-height: 14px;
}
a:link, a:visited, a:active {
	color: #c0d3df;
	font: 10pt tahoma;
	text-decoration: none;
}
a:hover {
	color: #756b77;
	font: 10pt tahoma;
	text-decoration: none;
}
</style></textarea></td>
<td width="33%">
<img src="http://i.imgur.com/l2EZDXM.png"><br><b>Watercolor Castle:</b><br><textarea><style>
table {
	display: none;
}
.page table {
	display: table;
}
body {
	background-image: url("http://i.imgur.com/M0CkxQU.png");
}
#layout {
	width: 800px;
	height: 600px;
	margin: 0 auto;
	background-image: url("http://i.imgur.com/dRQt2OG.png");
}
#main {
	font: 10pt tahoma;
	color: #000000;
	top: 180px;
	left: 230px;
	width: 570px;
	height: 390px;
	overflow: hidden;
}
.page {
	height: 390px;
	overflow: auto;
}
#nav {
	top: 180px;
	left: 0px;
	width: 190px;
	height: 390px;
	overflow: hidden;
	text-align: center;
}
.table {
	display: inline;
	text-align: left;
}
td {
	padding: 10px;
}
h1 {
	font: 13pt tahoma;
	color: #d3baf3;
	text-align: center;
	border-width: 2px;
	border-bottom-style: solid;
	border-top-style: solid;
	border-color: #6c6077;
	letter-spacing: 4px;
	line-height: 25px;
}
h2 {
	font: 11pt tahoma;
	color: #ddd3f3;
	text-align: center;
	background-color: #556293;
	letter-spacing: 2px;
	line-height: 25px;
}
h2:hover {
	font: 11pt tahoma;
	color: #556293;
	text-align: center;
	background-color: #ddd3f3;
	letter-spacing: 2px;
	line-height: 25px;
}
h3 {
	font: 12pt tahoma;
	color: #6c6077;
	border-width: 1px;
	border-bottom-style: solid;
	border-top-style: solid;
	border-color: #d3baf3;
	letter-spacing: 2px;
	line-height: 25px;
}
b {
	color: #556293;
	font: 10pt tahoma;
	font-weight: bold;
	line-height: 14px;
}
i {
	color: #d3baf3;
	font: 10pt tahoma;
	font-style: italic;
	line-height: 14px;
}
a:link, a:visited, a:active {
	color: #91c7ef;
	font: 10pt tahoma;
	text-decoration: none;
}
a:hover {
	color: #ddd3f3;
	font: 10pt tahoma;
	text-decoration: none;
}
</style></textarea></td>
</tr><tr align="center"><td width="33%">
<img src="http://i.imgur.com/dcFaHeJ.png"><br><b>Spooky:</b><br><textarea><style>
table {
	display: none;
}
.page table {
	display: table;
}
body {
	background-image: url("http://i.imgur.com/UKpNMGj.png");
}
#layout {
	width: 800px;
	height: 600px;
	margin: 0 auto;
	background-image: url("http://i.imgur.com/CBHKIsG.png");
}
#main {
	font: 10pt tahoma;
	color: #000000;
	top: 180px;
	left: 230px;
	width: 570px;
	height: 390px;
	overflow: hidden;
}
.page {
	height: 390px;
	overflow: auto;
}
#nav {
	top: 180px;
	left: 0px;
	width: 190px;
	height: 390px;
	overflow: hidden;
	text-align: center;
}
.table {
	display: inline;
	text-align: left;
}
td {
	padding: 10px;
}
h1 {
	font: 13pt tahoma;
	color: #6a5a56;
	text-align: center;
	border-width: 2px;
	border-bottom-style: solid;
	border-top-style: solid;
	border-color: #dd9151;
	letter-spacing: 4px;
	line-height: 25px;
}
h2 {
	font: 11pt tahoma;
	color: #ead0c2;
	text-align: center;
	background-color: #ac5f37;
	letter-spacing: 2px;
	line-height: 25px;
}
h2:hover {
	font: 11pt tahoma;
	color: #ac5f37;
	text-align: center;
	background-color: #ead0c2;
	letter-spacing: 2px;
	line-height: 25px;
}
h3 {
	font: 12pt tahoma;
	color: #dd9151;
	border-width: 1px;
	border-bottom-style: solid;
	border-top-style: solid;
	border-color: #6a5a56;
	letter-spacing: 2px;
	line-height: 25px;
}
b {
	color: #ac5f37;
	font: 10pt tahoma;
	font-weight: bold;
	line-height: 14px;
}
i {
	color: #917260;
	font: 10pt tahoma;
	font-style: italic;
	line-height: 14px;
}
a:link, a:visited, a:active {
	color: #c37a56;
	font: 10pt tahoma;
	text-decoration: none;
}
a:hover {
	color: #e5ae88;
	font: 10pt tahoma;
	text-decoration: none;
}
</style></textarea></td>
<td width="33%">
<img src="http://i.imgur.com/zYIovqh.png"><br><b>Sketch:</b><br><textarea><style>
table {
	display: none;
}
.page table {
	display: table;
}
body {
	background-image: url("http://i.imgur.com/DKLJc0k.png");
}
#layout {
	width: 800px;
	height: 600px;
	margin: 0 auto;
	background-image: url("http://i.imgur.com/N3yzYrr.png");
}
#main {
	font: 10pt tahoma;
	color: #000000;
	top: 180px;
	left: 230px;
	width: 570px;
	height: 390px;
	overflow: hidden;
}
.page {
	height: 390px;
	overflow: auto;
}
#nav {
	top: 180px;
	left: 0px;
	width: 190px;
	height: 390px;
	overflow: hidden;
	text-align: center;
}
.table {
	display: inline;
	text-align: left;
}
td {
	padding: 10px;
}
h1 {
	font: 13pt tahoma;
	color: #b0a48d;
	text-align: center;
	border-width: 2px;
	border-bottom-style: solid;
	border-top-style: solid;
	border-color: #c1c6bd;
	letter-spacing: 4px;
	line-height: 25px;
}
h2 {
	font: 11pt tahoma;
	color: #f2e4d7;
	text-align: center;
	background-color: #89aaab;
	letter-spacing: 2px;
	line-height: 25px;
}
h2:hover {
	font: 11pt tahoma;
	color: #89aaab;
	text-align: center;
	background-color: #f2e4d7;
	letter-spacing: 2px;
	line-height: 25px;
}
h3 {
	font: 12pt tahoma;
	color: #c1c6bd;
	border-width: 1px;
	border-bottom-style: solid;
	border-top-style: solid;
	border-color: #b0a48d;
	letter-spacing: 2px;
	line-height: 25px;
}
b {
	color: #92afa8;
	font: 10pt tahoma;
	font-weight: bold;
	line-height: 14px;
}
i {
	color: #b0a48d;
	font: 10pt tahoma;
	font-style: italic;
	line-height: 14px;
}
a:link, a:visited, a:active {
	color: #c1c6bd;
	font: 10pt tahoma;
	text-decoration: none;
}
a:hover {
	color: #92afa8;
	font: 10pt tahoma;
	text-decoration: none;
}
</style></textarea></td>
<td width="33%">
<img src="http://i.imgur.com/qfVMTch.png"><br><b>Office:</b><br><textarea><style>
table {
	display: none;
}
.page table {
	display: table;
}
body {
	background-image: url("http://i.imgur.com/cuV5nbv.png");
}
#layout {
	width: 800px;
	height: 600px;
	margin: 0 auto;
	background-image: url("http://i.imgur.com/4r9hzQu.png");
}
#main {
	font: 10pt tahoma;
	color: #000000;
	top: 180px;
	left: 230px;
	width: 570px;
	height: 390px;
	overflow: hidden;
}
.page {
	height: 390px;
	overflow: auto;
}
#nav {
	top: 180px;
	left: 0px;
	width: 190px;
	height: 390px;
	overflow: hidden;
	text-align: center;
}
.table {
	display: inline;
	text-align: left;
}
td {
	padding: 10px;
}
h1 {
	font: 13pt tahoma;
	color: #8e7e6b;
	text-align: center;
	border-width: 2px;
	border-bottom-style: solid;
	border-top-style: solid;
	border-color: #c6736b;
	letter-spacing: 4px;
	line-height: 25px;
}
h2 {
	font: 11pt tahoma;
	color: #fae5cc;
	text-align: center;
	background-color: #9e846f;
	letter-spacing: 2px;
	line-height: 25px;
}
h2:hover {
	font: 11pt tahoma;
	color: #9e846f;
	text-align: center;
	background-color: #fae5cc;
	letter-spacing: 2px;
	line-height: 25px;
}
h3 {
	font: 12pt tahoma;
	color: #c6736b;
	border-width: 1px;
	border-bottom-style: solid;
	border-top-style: solid;
	border-color: #8e7e6b;
	letter-spacing: 2px;
	line-height: 25px;
}
b {
	color: #9e846f;
	font: 10pt tahoma;
	font-weight: bold;
	line-height: 14px;
}
i {
	color: #8e7e6b;
	font: 10pt tahoma;
	font-style: italic;
	line-height: 14px;
}
a:link, a:visited, a:active {
	color: #c6736b;
	font: 10pt tahoma;
	text-decoration: none;
}
a:hover {
	color: #9e846f;
	font: 10pt tahoma;
	text-decoration: none;
}
</style></textarea></td>
</tr><tr align="center"><td width="33%">
<img src="http://i.imgur.com/mDk3lJV.png"><br><b>Pixies:</b><br><textarea><style>
table {
	display: none;
}
.page table {
	display: table;
}
body {
	background-image: url("http://imgur.com/O4rGNSw.png");
}
#layout {
	width: 800px;
	height: 600px;
	margin: 0 auto;
	background-image: url("http://imgur.com/nU2BhI9.png");
}
#main {
	font: 10pt tahoma;
	color: #000000;
	top: 180px;
	left: 230px;
	width: 570px;
	height: 380px;
	overflow: hidden;
}
.page {
	height: 390px;
	overflow: auto;
}
#nav {
	top: 180px;
	left: 0px;
	width: 190px;
	height: 390px;
	overflow: hidden;
	text-align: center;
}
.table {
	display: inline;
	text-align: left;
}
td {
	padding: 10px;
}
textarea#button {
	font: 9pt tahoma;
	color: #f38551;
	overflow: hidden;
	width: 90px;
	height: 30px;
	border: 1px solid #cdb8c8;
}
h1 {
	font: 13pt tahoma;
	color: #797675;
	text-align: center;
	border-width: 2px;
	border-bottom-style: solid;
	border-top-style: none;
	border-color: #fcd9d7;
	letter-spacing: 4px;
	line-height: 25px;
}
h2 {
	font: 13pt tahoma;
	color: #797675;
	text-align: center;
	background-color: #f2d0c1;
	letter-spacing: 2px;
	line-height: 25px;
}
h2:hover {
	font: 11pt tahoma;
	color: #797675;
	text-align: center;
	background-color: #f9b99a;
	letter-spacing: 2px;
	line-height: 25px;
}
h3 {
	font: 13pt tahoma;
	color: #797675;
	border-width: 2px;
	border-bottom-style: solid;
	border-top-style: none;
	border-color: #fcd9d7;
	letter-spacing: 2px;
	line-height: 25px;
}
b {
	color: #d45316;
	font: 10pt tahoma;
	font-weight: bold;
	line-height: 14px;
}
i {
	color: #f38551;
	font: 10pt tahoma;
	font-style: italic;
	line-height: 14px;
}
a:link, a:visited, a:active {
	color: #928b8b;
	font: 10pt tahoma;
	text-decoration: none;
}
a:hover {
	color: #745a48;
	font: 10pt tahoma;
	text-decoration: none;
}
</style></textarea></td>


<td width="33%">
<img src="http://i.imgur.com/tXrhMuK.png"><br><b>Fred & George:</b><br><textarea><style>
table {
	display: none;
}
.page table {
	display: table;
}
body {
	background-image: url("http://imgur.com/YxewHuV.png");
}
#layout {
	width: 800px;
	height: 600px;
	margin: 0 auto;
	background-image: url("http://imgur.com/UCjrWde.png");
}
#main {
	font: 10pt tahoma;
	color: #000000;
	top: 180px;
	left: 230px;
	width: 570px;
	height: 380px;
	overflow: hidden;
}
.page {
	height: 390px;
	overflow: auto;
}
#nav {
	top: 180px;
	left: 0px;
	width: 190px;
	height: 390px;
	overflow: hidden;
	text-align: center;
}
.table {
	display: inline;
	text-align: left;
}
td {
	padding: 10px;
}
textarea#button {
	font: 9pt tahoma;
	color: #9d7c53;
	overflow: hidden;
	width: 90px;
	height: 30px;
	border: 1px solid #cdb8c8;
}
h1 {
	font: 13pt tahoma;
	color: #4e5d6d;
	text-align: center;
	border-width: 2px;
	border-bottom-style: solid;
	border-top-style: none;
	border-color: #7ab6f6;
	letter-spacing: 4px;
	line-height: 25px;
}
h2 {
	font: 13pt tahoma;
	color: #ffffff;
	text-align: center;
	background-color: #4e5d6d;
	letter-spacing: 2px;
	line-height: 25px;
}
h2:hover {
	font: 11pt tahoma;
	color: #4e5d6d;
	text-align: center;
	background-color: #ffffff;
	letter-spacing: 2px;
	line-height: 25px;
}
h3 {
	font: 13pt tahoma;
	color: #4e5d6d;
	border-width: 2px;
	border-bottom-style: solid;
	border-top-style: none;
	border-color: #7ab6f6;
	letter-spacing: 2px;
	line-height: 25px;
}
b {
	color: #1a3653;
	font: 10pt tahoma;
	font-weight: bold;
	line-height: 14px;
}
i {
	color: #7ab6f6;
	font: 10pt tahoma;
	font-style: italic;
	line-height: 14px;
}
a:link, a:visited, a:active {
	color: #928b8b;
	font: 10pt tahoma;
	text-decoration: none;
}
a:hover {
	color: #081238;
	font: 10pt tahoma;
	text-decoration: none;
}
</style></textarea></td>


<td width="33%">
<img src="http://i.imgur.com/ywp6bWY.png"><br><b>Books:</b><br><textarea><style>
table {
	display: none;
}
.page table {
	display: table;
}
body {
	background-image: url("http://imgur.com/aAKd6bZ.png");
}
#layout {
	width: 800px;
	height: 600px;
	margin: 0 auto;
	background-image: url("http://imgur.com/03YgyXx.png");
}
#main {
	font: 10pt tahoma;
	color: #000000;
	top: 180px;
	left: 230px;
	width: 570px;
	height: 380px;
	overflow: hidden;
}
.page {
	height: 390px;
	overflow: auto;
}
#nav {
	top: 180px;
	left: 0px;
	width: 190px;
	height: 390px;
	overflow: hidden;
	text-align: center;
}
.table {
	display: inline;
	text-align: left;
}
td {
	padding: 10px;
}
textarea#button {
	font: 9pt tahoma;
	color: #9d7c53;
	overflow: hidden;
	width: 90px;
	height: 30px;
	border: 1px solid #cdb8c8;
}
h1 {
	font: 13pt tahoma;
	color: #caadab;
	text-align: center;
	border-width: 2px;
	border-bottom-style: solid;
	border-top-style: none;
	border-color: #fcd9d7;
	letter-spacing: 4px;
	line-height: 25px;
}
h2 {
	font: 13pt tahoma;
	color: #ffffff;
	text-align: center;
	background-color: #feb3ae;
	letter-spacing: 2px;
	line-height: 25px;
}
h2:hover {
	font: 11pt tahoma;
	color: #ffffff;
	text-align: center;
	background-color: #fcd9d7;
	letter-spacing: 2px;
	line-height: 25px;
}
h3 {
	font: 13pt tahoma;
	color: #caadab;
	border-width: 2px;
	border-bottom-style: solid;
	border-top-style: none;
	border-color: #fcd9d7;
	letter-spacing: 2px;
	line-height: 25px;
}
b {
	color: #4f3736;
	font: 10pt tahoma;
	font-weight: bold;
	line-height: 14px;
}
i {
	color: #f2aeaa;
	font: 10pt tahoma;
	font-style: italic;
	line-height: 14px;
}
a:link, a:visited, a:active {
	color: #928b8b;
	font: 10pt tahoma;
	text-decoration: none;
}
a:hover {
	color: #745a48;
	font: 10pt tahoma;
	text-decoration: none;
}
</style></textarea></td>
</tr></table><h2>Rest of Coding</h2>
<center>
<textarea><br><br><br><div id="layout" style="position: relative;">


<div id="nav" style="position: absolute;">
<h1>Navigation</h1>
<a href="#home" class="nav"><h2>Home</h2></a>
<a href="#link1" class="nav"><h2>Link 1</h2></a>
<a href="#link2" class="nav"><h2>Link 2</h2></a>
<a href="#link3" class="nav"><h2>Link 3</h2></a>
<a href="#link4" class="nav"><h2>Link 4</h2></a>
<a href="#link5" class="nav"><h2>Link 5</h2></a>


</div>


<div id="main" style="position: absolute;">
<a name="home"></a>
<div class="page">
<h1>Header One</h1>
To swap out your image, edit the image URL under #layout, which is close to the top of the layout coding. If you have any questions or need help using this layout, <a href="/neomessages.phtml?type=send&recipient=painted_dreams87">neomail Heather</a> any time.<br><br><b>This is bold.</b> <i>This is italics.</i> <a href="/~ezulla">This is a link</a>

<h3>Header Three</h3>


</div>

<a name="link1"></a>
<div class="page">
<h1>Link 1</h1>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

</div>

<a name="link2"></a>
<div class="page">
<h1>Link 2</h1>

<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

</div>

<a name="link3"></a>
<div class="page">
<h1>Link 3</h1>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

</div>

<a name="link4"></a>
<div class="page">
<h1>Link 4</h1>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

</div>

<a name="link5"></a>
<div class="page">
<h1>Link 5</h1>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

</div>
</div></div>
</textarea><h2>Old Layouts</h2>
This is the old style of layouts we used for classes and activities. If you would like to use one of these, take the coding for the layout as you would for any of the others above. Once that's done, right click on an image below to grab the image URL. Paste it into the (#layout) part of the style coding. Then, customize it however you would like.<br><br><center>
<img src="http://i.imgur.com/TmMV5Lj.png" width="200"><img src="http://i.imgur.com/xB3XQ3X.png" width="200"><img src="http://i.imgur.com/Vevqx5Z.png" width="200"><img src="http://i.imgur.com/dfLCuOY.png" width="200"><img src="http://i.imgur.com/9Iv2noN.png" width="200"><img src="http://i.imgur.com/9egsmLR.png" width="200"><img src="http://i.imgur.com/Hl90VaQ.png" width="200"></center>


<h2>Common Room Layouts</h2>
These layouts are for Prefects to use for their Common Room each term.<br><br><center>
<table width="100%"><tr align="center"><td width="50%">
<img src="http://i.imgur.com/xwH4yHP.png"><br><textarea><style>
table {
	display: none;
}
.page table {
	display: table;
}
body {
	background-image: url("http://i.imgur.com/H5lclDU.png");
}
#layout {
	width: 800px;
	height: 600px;
	margin: 0 auto;
	background-image: url("http://i.imgur.com/24tCCej.png");
}
#main {
	font: 10pt tahoma;
	color: #000000;
	top: 180px;
	left: 230px;
	width: 570px;
	height: 390px;
	overflow: hidden;
}
.page {
	height: 390px;
	overflow: auto;
}
#nav {
	top: 180px;
	left: 0px;
	width: 190px;
	height: 390px;
	overflow: hidden;
	text-align: center;
}
.table {
	display: inline;
	text-align: left;
}
td {
	padding: 10px;
}
h1 {
	font: 13pt tahoma;
	color: #8f735d;
	text-align: center;
	border-width: 2px;
	border-bottom-style: solid;
	border-top-style: solid;
	border-color: #d29d7d;
	letter-spacing: 4px;
	line-height: 25px;
}
h2 {
	font: 11pt tahoma;
	color: #e2ceb7;
	text-align: center;
	background-color: #a7524b;
	letter-spacing: 2px;
	line-height: 25px;
}
h2:hover {
	font: 11pt tahoma;
	color: #a7524b;
	text-align: center;
	background-color: #e2ceb7;
	letter-spacing: 2px;
	line-height: 25px;
}
h3 {
	font: 12pt tahoma;
	color: #d29d7d;
	border-width: 1px;
	border-bottom-style: solid;
	border-top-style: solid;
	border-color: #8f735d;
	letter-spacing: 2px;
	line-height: 25px;
}
b {
	color: #a7524b;
	font: 10pt tahoma;
	font-weight: bold;
	line-height: 14px;
}
i {
	color: #e2ceb7;
	font: 10pt tahoma;
	font-style: italic;
	line-height: 14px;
}
a:link, a:visited, a:active {
	color: #d29d7d;
	font: 10pt tahoma;
	text-decoration: none;
}
a:hover {
	color: #a7524b;
	font: 10pt tahoma;
	text-decoration: none;
}
</style><br><br><br><div id="layout" style="position: relative;">


<div id="nav" style="position: absolute;">
<h1>Navigation</h1>
<a href="#home" class="nav"><h2>Home</h2></a>
<a href="#link1" class="nav"><h2>Link 1</h2></a>
<a href="#link2" class="nav"><h2>Link 2</h2></a>
<a href="#link3" class="nav"><h2>Link 3</h2></a>
<a href="#link4" class="nav"><h2>Link 4</h2></a>
<a href="#link5" class="nav"><h2>Link 5</h2></a>


</div>


<div id="main" style="position: absolute;">
<a name="home"></a>
<div class="page">
<h1>Header One</h1>
To swap out your image, edit the image URL under #layout, which is close to the top of the layout coding. If you have any questions or need help using this layout, <a href="/neomessages.phtml?type=send&recipient=painted_dreams87">neomail Heather</a> any time.<br><br><b>This is bold.</b> <i>This is italics.</i> <a href="/~ezulla">This is a link</a>

<h3>Header Three</h3>


</div>

<a name="link1"></a>
<div class="page">
<h1>Link 1</h1>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

</div>

<a name="link2"></a>
<div class="page">
<h1>Link 2</h1>

<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

</div>

<a name="link3"></a>
<div class="page">
<h1>Link 3</h1>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

</div>

<a name="link4"></a>
<div class="page">
<h1>Link 4</h1>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

</div>

<a name="link5"></a>
<div class="page">
<h1>Link 5</h1>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

</div>
</div></div>
</textarea></td>
<td width="50%">
<img src="http://i.imgur.com/4ceESFx.png"><br><textarea><style>
table {
	display: none;
}
.page table {
	display: table;
}
body {
	background-image: url("http://i.imgur.com/pCHJfla.png");
}
#layout {
	width: 800px;
	height: 600px;
	margin: 0 auto;
	background-image: url("http://i.imgur.com/qvzO1au.png");
}
#main {
	font: 10pt tahoma;
	color: #000000;
	top: 180px;
	left: 230px;
	width: 570px;
	height: 390px;
	overflow: hidden;
}
.page {
	height: 390px;
	overflow: auto;
}
#nav {
	top: 180px;
	left: 0px;
	width: 190px;
	height: 390px;
	overflow: hidden;
	text-align: center;
}
.table {
	display: inline;
	text-align: left;
}
td {
	padding: 10px;
}
h1 {
	font: 13pt tahoma;
	color: #a0846f;
	text-align: center;
	border-width: 2px;
	border-bottom-style: solid;
	border-top-style: solid;
	border-color: #ccae77;
	letter-spacing: 4px;
	line-height: 25px;
}
h2 {
	font: 11pt tahoma;
	color: #ecdbcd;
	text-align: center;
	background-color: #a0701a;
	letter-spacing: 2px;
	line-height: 25px;
}
h2:hover {
	font: 11pt tahoma;
	color: #a0701a;
	text-align: center;
	background-color: #ecdbcd;
	letter-spacing: 2px;
	line-height: 25px;
}
h3 {
	font: 12pt tahoma;
	color: #ccae77;
	border-width: 1px;
	border-bottom-style: solid;
	border-top-style: solid;
	border-color: #a0846f;
	letter-spacing: 2px;
	line-height: 25px;
}
b {
	color: #a0701a;
	font: 10pt tahoma;
	font-weight: bold;
	line-height: 14px;
}
i {
	color: #ccae77;
	font: 10pt tahoma;
	font-style: italic;
	line-height: 14px;
}
a:link, a:visited, a:active {
	color: #bd9134;
	font: 10pt tahoma;
	text-decoration: none;
}
a:hover {
	color: #a0701a;
	font: 10pt tahoma;
	text-decoration: none;
}
</style><br><br><br><div id="layout" style="position: relative;">


<div id="nav" style="position: absolute;">
<h1>Navigation</h1>
<a href="#home" class="nav"><h2>Home</h2></a>
<a href="#link1" class="nav"><h2>Link 1</h2></a>
<a href="#link2" class="nav"><h2>Link 2</h2></a>
<a href="#link3" class="nav"><h2>Link 3</h2></a>
<a href="#link4" class="nav"><h2>Link 4</h2></a>
<a href="#link5" class="nav"><h2>Link 5</h2></a>


</div>


<div id="main" style="position: absolute;">
<a name="home"></a>
<div class="page">
<h1>Header One</h1>
To swap out your image, edit the image URL under #layout, which is close to the top of the layout coding. If you have any questions or need help using this layout, <a href="/neomessages.phtml?type=send&recipient=painted_dreams87">neomail Heather</a> any time.<br><br><b>This is bold.</b> <i>This is italics.</i> <a href="/~ezulla">This is a link</a>

<h3>Header Three</h3>


</div>

<a name="link1"></a>
<div class="page">
<h1>Link 1</h1>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

</div>

<a name="link2"></a>
<div class="page">
<h1>Link 2</h1>

<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

</div>

<a name="link3"></a>
<div class="page">
<h1>Link 3</h1>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

</div>

<a name="link4"></a>
<div class="page">
<h1>Link 4</h1>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

</div>

<a name="link5"></a>
<div class="page">
<h1>Link 5</h1>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

</div>
</div></div>
</textarea></td>
</tr><tr align="center"><td width="50%">
<img src="http://i.imgur.com/X2embS8.png"><br><textarea><style>
table {
	display: none;
}
.page table {
	display: table;
}
body {
	background-image: url("http://i.imgur.com/YeTCnEJ.png");
}
#layout {
	width: 800px;
	height: 600px;
	margin: 0 auto;
	background-image: url("http://i.imgur.com/DCKgNXc.png");
}
#main {
	font: 10pt tahoma;
	color: #000000;
	top: 180px;
	left: 230px;
	width: 570px;
	height: 390px;
	overflow: hidden;
}
.page {
	height: 390px;
	overflow: auto;
}
#nav {
	top: 180px;
	left: 0px;
	width: 190px;
	height: 390px;
	overflow: hidden;
	text-align: center;
}
.table {
	display: inline;
	text-align: left;
}
td {
	padding: 10px;
}
h1 {
	font: 13pt tahoma;
	color: #3957c0;
	text-align: center;
	border-width: 2px;
	border-bottom-style: solid;
	border-top-style: solid;
	border-color: #abd6f8;
	letter-spacing: 4px;
	line-height: 25px;
}
h2 {
	font: 11pt tahoma;
	color: #ebf3f3;
	text-align: center;
	background-color: #435398;
	letter-spacing: 2px;
	line-height: 25px;
}
h2:hover {
	font: 11pt tahoma;
	color: #435398;
	text-align: center;
	background-color: #ebf3f3;
	letter-spacing: 2px;
	line-height: 25px;
}
h3 {
	font: 12pt tahoma;
	color: #abd6f8;
	border-width: 1px;
	border-bottom-style: solid;
	border-top-style: solid;
	border-color: #3957c0;
	letter-spacing: 2px;
	line-height: 25px;
}
b {
	color: #435398;
	font: 10pt tahoma;
	font-weight: bold;
	line-height: 14px;
}
i {
	color: #3957c0;
	font: 10pt tahoma;
	font-style: italic;
	line-height: 14px;
}
a:link, a:visited, a:active {
	color: #abd6f8;
	font: 10pt tahoma;
	text-decoration: none;
}
a:hover {
	color: #435398;
	font: 10pt tahoma;
	text-decoration: none;
}
</style><br><br><br><div id="layout" style="position: relative;">


<div id="nav" style="position: absolute;">
<h1>Navigation</h1>
<a href="#home" class="nav"><h2>Home</h2></a>
<a href="#link1" class="nav"><h2>Link 1</h2></a>
<a href="#link2" class="nav"><h2>Link 2</h2></a>
<a href="#link3" class="nav"><h2>Link 3</h2></a>
<a href="#link4" class="nav"><h2>Link 4</h2></a>
<a href="#link5" class="nav"><h2>Link 5</h2></a>


</div>


<div id="main" style="position: absolute;">
<a name="home"></a>
<div class="page">
<h1>Header One</h1>
To swap out your image, edit the image URL under #layout, which is close to the top of the layout coding. If you have any questions or need help using this layout, <a href="/neomessages.phtml?type=send&recipient=painted_dreams87">neomail Heather</a> any time.<br><br><b>This is bold.</b> <i>This is italics.</i> <a href="/~ezulla">This is a link</a>

<h3>Header Three</h3>


</div>

<a name="link1"></a>
<div class="page">
<h1>Link 1</h1>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

</div>

<a name="link2"></a>
<div class="page">
<h1>Link 2</h1>

<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

</div>

<a name="link3"></a>
<div class="page">
<h1>Link 3</h1>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

</div>

<a name="link4"></a>
<div class="page">
<h1>Link 4</h1>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

</div>

<a name="link5"></a>
<div class="page">
<h1>Link 5</h1>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

</div>
</div></div>
</textarea></td>
<td width="50%">
<img src="http://i.imgur.com/17MvUNs.png"><br><textarea><style>
table {
	display: none;
}
.page table {
	display: table;
}
body {
	background-image: url("http://i.imgur.com/QQo0XCL.png");
}
#layout {
	width: 800px;
	height: 600px;
	margin: 0 auto;
	background-image: url("http://i.imgur.com/BTS8d0C.png");
}
#main {
	font: 10pt tahoma;
	color: #000000;
	top: 180px;
	left: 230px;
	width: 570px;
	height: 390px;
	overflow: hidden;
}
.page {
	height: 390px;
	overflow: auto;
}
#nav {
	top: 180px;
	left: 0px;
	width: 190px;
	height: 390px;
	overflow: hidden;
	text-align: center;
}
.table {
	display: inline;
	text-align: left;
}
td {
	padding: 10px;
}
h1 {
	font: 13pt tahoma;
	color: #888e6c;
	text-align: center;
	border-width: 2px;
	border-bottom-style: solid;
	border-top-style: solid;
	border-color: #a6a6a1;
	letter-spacing: 4px;
	line-height: 25px;
}
h2 {
	font: 11pt tahoma;
	color: #cfd8c7;
	text-align: center;
	background-color: #3a3a31;
	letter-spacing: 2px;
	line-height: 25px;
}
h2:hover {
	font: 11pt tahoma;
	color: #3a3a31;
	text-align: center;
	background-color: #cfd8c7;
	letter-spacing: 2px;
	line-height: 25px;
}
h3 {
	font: 12pt tahoma;
	color: #a6a6a1;
	border-width: 1px;
	border-bottom-style: solid;
	border-top-style: solid;
	border-color: #888e6c;
	letter-spacing: 2px;
	line-height: 25px;
}
b {
	color: #3a3a31;
	font: 10pt tahoma;
	font-weight: bold;
	line-height: 14px;
}
i {
	color: #a6a6a1;
	font: 10pt tahoma;
	font-style: italic;
	line-height: 14px;
}
a:link, a:visited, a:active {
	color: #888e6c;
	font: 10pt tahoma;
	text-decoration: none;
}
a:hover {
	color: #3a3a31;
	font: 10pt tahoma;
	text-decoration: none;
}
</style><br><br><br><div id="layout" style="position: relative;">


<div id="nav" style="position: absolute;">
<h1>Navigation</h1>
<a href="#home" class="nav"><h2>Home</h2></a>
<a href="#link1" class="nav"><h2>Link 1</h2></a>
<a href="#link2" class="nav"><h2>Link 2</h2></a>
<a href="#link3" class="nav"><h2>Link 3</h2></a>
<a href="#link4" class="nav"><h2>Link 4</h2></a>
<a href="#link5" class="nav"><h2>Link 5</h2></a>


</div>


<div id="main" style="position: absolute;">
<a name="home"></a>
<div class="page">
<h1>Header One</h1>
To swap out your image, edit the image URL under #layout, which is close to the top of the layout coding. If you have any questions or need help using this layout, <a href="/neomessages.phtml?type=send&recipient=painted_dreams87">neomail Heather</a> any time.<br><br><b>This is bold.</b> <i>This is italics.</i> <a href="/~ezulla">This is a link</a>

<h3>Header Three</h3>


</div>

<a name="link1"></a>
<div class="page">
<h1>Link 1</h1>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

</div>

<a name="link2"></a>
<div class="page">
<h1>Link 2</h1>

<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

</div>

<a name="link3"></a>
<div class="page">
<h1>Link 3</h1>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

</div>

<a name="link4"></a>
<div class="page">
<h1>Link 4</h1>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

</div>

<a name="link5"></a>
<div class="page">
<h1>Link 5</h1>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</p>

</div>
</div></div>
</textarea></td>
</tr></table></center>



</center></div>

</div></div>