Figmint designs

goodly designs for the average tasteful chap

Website Layouts

Set: Round Rects and Box Shadows

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<head>
<title>Your Title Here</title>

<style type="text/css">
body{
	padding: 0px;margin:0px;height: 100%;width: 100%;
	font-family:helvetica;font-size: 14px;
}
#bar{
top: 0px;
left: 0px;
height: 100px;
background:-webkit-gradient(linear,left bottom,left top,color-stop(0.37, rgb(43,113,127)),color-stop(0.91, rgb(55,144,160)));
background:-moz-linear-gradient(center bottom,rgb(43,113,127) 37%,rgb(55,144,160) 91%);
box-shadow:0px 5px 50px #aaa;-webkit-box-shadow:0px 5px 50px #aaa;-moz-box-shadow: 0px 5px 50px #aaa;
margin-bottom: 20px;
}
div.bar{
	font-size: 30px;
	font-weight: bold;
	text-transform: uppercase;	
	color: rgba(256,256,256,.5);
	padding: 20px;
}

div.bar sub{
	font-style: italic;
	font-size: 15px;
	text-transform:lowercase;
	vertical-align:middle;
}

.bar a, h2, h1{
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	color: rgba(256,256,256,.5);
	text-decoration: none;
	text-transform: lowercase;
}

.bar a{
	font-size: 15px;
	padding: 3px;
	font-style:normal;
}
.bar a:hover{
	color: rgb(43,113,127);
	background: rgba(256,256,256,.5);

}
h1{
	padding: 5px;
}
h2{
	padding: 4px;
}
h1,h2{
background:-webkit-gradient(linear,left bottom,left top,color-stop(0.37, rgb(43,113,127)),color-stop(0.91, rgb(55,144,160)));
background:-moz-linear-gradient(center bottom,rgb(43,113,127) 37%,rgb(55,144,160) 91%);
box-shadow:0px 5px 0px #aaa;-webkit-box-shadow:0px 5px 10px #aaa;-moz-box-shadow: 0px 5px 0px #aaa;
}


#main{
	position:relative;
	float: left;
	width: 70%;
	padding: 10px;

}
	
#side{
	color: #49494A;
	position:relative;
	float: right;
	width: 23%;
	height: auto;
	padding: 10px;
	margin-right: 10px;	
}

.clearer{clear:both;width:100%;height:0;}
#cbottom{
	text-align:center;
	clear: both;
	margin: 50px 5px 5px 5px;
	font-size: 12px;
}

a, #cbottom{
	color: rgb(43,113,127);
	font-style:italic;
	text-decoration: none;
}
a:hover{
	color: #49494A;
}

</style>


</head>
<body>
<div id="bar">
<div class="bar">
Elsewhere <sub>We've got Oatmeal.</sub>
<br>
<a href="x">home</a>
<a href="x">forum</a>
<a href="x">art</a>
<a href="x">writing</a>
</div></div>
<div id="main">

<h1>Who We are</h1>
<p>Lorem <a href="x">ipsum</a> dolor sit amet, consectetur adipiscing elit. In ac mi eu nulla tempus accumsan. Nulla facilisi. In hac habitasse platea dictumst. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Morbi pretium nisi vel elit tristique quis feugiat nisi rhoncus. In hac habitasse platea dictumst. Nulla euismod consectetur dolor, id gravida elit ornare non. Donec at lectus orci. Nam non pellentesque diam. Fusce posuere, risus quis gravida euismod, odio arcu suscipit tortor, sed hendrerit urna nibh id elit. Suspendisse accumsan, diam in pretium rutrum, leo lorem pharetra mi, ac vehicula leo dui in arcu. Sed a augue quam. Nulla et elit neque, sit amet luctus odio. Fusce tincidunt, nulla nec laoreet sollicitudin, tellus augue laoreet sem, non pellentesque ipsum turpis a nibh. Pellentesque dui enim, accumsan sit amet vestibulum sit amet, cursus et elit. Vivamus nec felis massa, vitae ultricies arcu. Vestibulum congue fringilla tortor sed molestie. Nunc ultrices ante at enim tempus dignissim. Morbi a tortor tortor.</p>

<p>Vestibulum sed quam lectus, eget facilisis ligula. Ut blandit nibh arcu. Quisque iaculis, tellus vel mollis tempor, urna massa volutpat leo, eu vehicula nisl tellus a augue. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Aliquam erat volutpat. Cras at dolor felis, ac commodo nibh. Vivamus facilisis purus quis ante feugiat eu sodales diam tincidunt. In hac habitasse platea dictumst. In auctor dictum justo et dictum. Mauris hendrerit tincidunt tellus, vel imperdiet nibh dignissim id. Mauris eget dui eget sapien varius fringilla eget et ante. Duis volutpat commodo eleifend. Morbi auctor blandit elit, non feugiat velit varius scelerisque. Cras at blandit est. Cras sit amet sem lectus. Quisque sodales gravida nisl, sit amet ultricies dui tempus in. Quisque malesuada mattis metus, et dictum erat condimentum eget. Quisque feugiat ipsum sed nibh dictum ultricies.</p>

<h2>Activites</h2>
<p>Sed quis nisi a lorem lacinia mollis. Sed posuere, lorem iaculis feugiat facilisis, arcu lacus laoreet tellus, vel molestie dolor tortor nec ipsum. Morbi aliquet, urna tempus bibendum egestas, libero sem malesuada felis, eget mollis ligula urna ut turpis. Donec suscipit, nunc eget dictum fringilla, tortor diam cursus sapien, vel interdum ligula orci vel leo. Pellentesque id dictum magna. Vivamus sit amet massa at tortor placerat vehicula a quis libero. Nullam quis neque quis nisi viverra sodales. In ornare pretium orci, at iaculis libero dignissim vel. Donec non urna ipsum. Aenean ligula arcu, malesuada hendrerit ultrices ut, rutrum sit amet mi. Nulla vel ullamcorper velit. Donec sit amet libero ut erat aliquam mollis eget nec leo. Nullam non consectetur tellus. Phasellus sagittis erat vitae enim convallis venenatis placerat risus luctus.</p>
</div>


<div id="side">
<h1>info</h1>

This layout incorporates round rectangles, gradients, shadows, and opacity effects that are not supported in internet explorer.  Please upgrade to a better browser like Chrome or Safari.

<h2>Credit</h2>
Please leave Figmint's credit at the bottom.
</div>
<div class="clearer"></div>



<div id="cbottom">Layout Design © Frisby at <a href="http://figmint.uuuq.com/">Figmint</a>.  Site content © us.</div>

</body>
</HTML>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<head>
<title>Your Title Here</title>

<style type="text/css">
body{
	padding: 0px;margin:0px;height: 100%;width: 100%;
	font-family:helvetica;font-size: 14px;
}
#bar{
top: 0px;
left: 0px;
height: 100px;
background:-webkit-gradient(linear,left bottom,left top,color-stop(0.37, rgb(92,103,74)),color-stop(0.91, rgb(120,134,104)));
background:-moz-linear-gradient(center bottom,rgb(92,103,74) 37%,rgb(120,134,104) 91%);
box-shadow:0px 5px 50px #aaa;-webkit-box-shadow:0px 5px 50px #aaa;-moz-box-shadow: 0px 5px 50px #aaa;
margin-bottom: 20px;
}
div.bar{
	font-size: 30px;
	font-weight: bold;
	text-transform: uppercase;	
	color: rgba(256,256,256,.5);
	padding: 20px;
}

div.bar sub{
	font-style: italic;
	font-size: 15px;
	text-transform:lowercase;
	vertical-align:middle;
}

.bar a, h2, h1{
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	color: rgba(256,256,256,.5);
	text-decoration: none;
	text-transform: lowercase;
}

.bar a{
	font-size: 15px;
	padding: 3px;
	font-style:normal;
}
.bar a:hover{
	color: #626D50;
	background: rgba(256,256,256,.5);

}
h1{
	padding: 5px;
}
h2{
	padding: 4px;
}
h1,h2{
background:-webkit-gradient(linear,left bottom,left top,color-stop(0.37, rgb(92,103,74)),color-stop(0.91, rgb(120,134,104)));
background:-moz-linear-gradient(center bottom,rgb(92,103,74) 37%,rgb(120,134,104) 91%);
box-shadow:0px 5px 0px #aaa;-webkit-box-shadow:0px 5px 10px #aaa;-moz-box-shadow: 0px 5px 0px #aaa;
}


#main{
	position:relative;
	float: left;
	width: 70%;
	padding: 10px;

}
	
#side{
	color: #49494A;
	position:relative;
	float: right;
	width: 23%;
	height: auto;
	padding: 10px;
	margin-right: 10px;	
}

.clearer{clear:both;width:100%;height:0;}
#cbottom{
	text-align:center;
	clear: both;
	margin: 50px 5px 5px 5px;
	font-size: 12px;
}

a, #cbottom{
	color: #626D50;
	font-style:italic;
	text-decoration: none;
}
a:hover{
	color: #49494A;
}

</style>


</head>
<body>
<div id="bar">
<div class="bar">
Elsewhere <sub>We've got Oatmeal.</sub>
<br>
<a href="x">home</a>
<a href="x">forum</a>
<a href="x">art</a>
<a href="x">writing</a>
</div></div>
<div id="main">

<h1>Who We are</h1>
<p>Lorem <a href="x">ipsum</a> dolor sit amet, consectetur adipiscing elit. In ac mi eu nulla tempus accumsan. Nulla facilisi. In hac habitasse platea dictumst. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Morbi pretium nisi vel elit tristique quis feugiat nisi rhoncus. In hac habitasse platea dictumst. Nulla euismod consectetur dolor, id gravida elit ornare non. Donec at lectus orci. Nam non pellentesque diam. Fusce posuere, risus quis gravida euismod, odio arcu suscipit tortor, sed hendrerit urna nibh id elit. Suspendisse accumsan, diam in pretium rutrum, leo lorem pharetra mi, ac vehicula leo dui in arcu. Sed a augue quam. Nulla et elit neque, sit amet luctus odio. Fusce tincidunt, nulla nec laoreet sollicitudin, tellus augue laoreet sem, non pellentesque ipsum turpis a nibh. Pellentesque dui enim, accumsan sit amet vestibulum sit amet, cursus et elit. Vivamus nec felis massa, vitae ultricies arcu. Vestibulum congue fringilla tortor sed molestie. Nunc ultrices ante at enim tempus dignissim. Morbi a tortor tortor.</p>

<p>Vestibulum sed quam lectus, eget facilisis ligula. Ut blandit nibh arcu. Quisque iaculis, tellus vel mollis tempor, urna massa volutpat leo, eu vehicula nisl tellus a augue. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Aliquam erat volutpat. Cras at dolor felis, ac commodo nibh. Vivamus facilisis purus quis ante feugiat eu sodales diam tincidunt. In hac habitasse platea dictumst. In auctor dictum justo et dictum. Mauris hendrerit tincidunt tellus, vel imperdiet nibh dignissim id. Mauris eget dui eget sapien varius fringilla eget et ante. Duis volutpat commodo eleifend. Morbi auctor blandit elit, non feugiat velit varius scelerisque. Cras at blandit est. Cras sit amet sem lectus. Quisque sodales gravida nisl, sit amet ultricies dui tempus in. Quisque malesuada mattis metus, et dictum erat condimentum eget. Quisque feugiat ipsum sed nibh dictum ultricies.</p>

<h2>Activites</h2>
<p>Sed quis nisi a lorem lacinia mollis. Sed posuere, lorem iaculis feugiat facilisis, arcu lacus laoreet tellus, vel molestie dolor tortor nec ipsum. Morbi aliquet, urna tempus bibendum egestas, libero sem malesuada felis, eget mollis ligula urna ut turpis. Donec suscipit, nunc eget dictum fringilla, tortor diam cursus sapien, vel interdum ligula orci vel leo. Pellentesque id dictum magna. Vivamus sit amet massa at tortor placerat vehicula a quis libero. Nullam quis neque quis nisi viverra sodales. In ornare pretium orci, at iaculis libero dignissim vel. Donec non urna ipsum. Aenean ligula arcu, malesuada hendrerit ultrices ut, rutrum sit amet mi. Nulla vel ullamcorper velit. Donec sit amet libero ut erat aliquam mollis eget nec leo. Nullam non consectetur tellus. Phasellus sagittis erat vitae enim convallis venenatis placerat risus luctus.</p>
</div>


<div id="side">
<h1>info</h1>

This layout incorporates round rectangles, gradients, shadows, and opacity effects that are not supported in internet explorer.  Please upgrade to a better browser like Chrome or Safari.

<h2>Credit</h2>
Please leave Figmint's credit at the bottom.
</div>
<div class="clearer"></div>



<div id="cbottom">Layout Design © Frisby at <a href="http://figmint.uuuq.com/">Figmint</a>.  Site content © us.</div>

</body>
</HTML>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<head>
<title>Your Title Here</title>

<style type="text/css">
body{
	padding: 0px;margin:0px;height: 100%;width: 100%;
	font-family:helvetica;font-size: 14px;
}
#bar{
top: 0px;
left: 0px;
height: 100px;
background:-webkit-gradient(linear,left bottom,left top,color-stop(0.37, rgb(107,1,3)),color-stop(0.91, rgb(163,0,6)));
background:-moz-linear-gradient(center bottom,rgb(107,1,3) 37%,rgb(163,0,6) 91%);
box-shadow:0px 5px 50px #aaa;-webkit-box-shadow:0px 5px 50px #aaa;-moz-box-shadow: 0px 5px 50px #aaa;
margin-bottom: 20px;
}
div.bar{
	font-size: 30px;
	font-weight: bold;
	text-transform: uppercase;	
	color: rgba(256,256,256,.5);
	padding: 20px;
}

div.bar sub{
	font-style: italic;
	font-size: 15px;
	text-transform:lowercase;
	vertical-align:middle;
}

.bar a, h2, h1{
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	color: rgba(256,256,256,.5);
	text-decoration: none;
	text-transform: lowercase;
}

.bar a{
	font-size: 15px;
	padding: 3px;
	font-style:normal;
}
.bar a:hover{
	color: rgb(107,1,3);
	background: rgba(256,256,256,.5);

}
h1{
	padding: 5px;
}
h2{
	padding: 4px;
}
h1,h2{
background:-webkit-gradient(linear,left bottom,left top,color-stop(0.37, rgb(107,1,3)),color-stop(0.91, rgb(163,0,6)));
background:-moz-linear-gradient(center bottom,rgb(107,1,3) 37%,rgb(163,0,6) 91%);
box-shadow:0px 5px 0px #aaa;-webkit-box-shadow:0px 5px 10px #aaa;-moz-box-shadow: 0px 5px 0px #aaa;
}


#main{
	position:relative;
	float: left;
	width: 70%;
	padding: 10px;

}
	
#side{
	color: #49494A;
	position:relative;
	float: right;
	width: 23%;
	height: auto;
	padding: 10px;
	margin-right: 10px;	
}

.clearer{clear:both;width:100%;height:0;}
#cbottom{
	text-align:center;
	clear: both;
	margin: 50px 5px 5px 5px;
	font-size: 12px;
}

a, #cbottom{
	color: rgb(107,1,3);
	font-style:italic;
	text-decoration: none;
}
a:hover{
	color: #49494A;
}

</style>


</head>
<body>
<div id="bar">
<div class="bar">
Elsewhere <sub>We've got Oatmeal.</sub>
<br>
<a href="x">home</a>
<a href="x">forum</a>
<a href="x">art</a>
<a href="x">writing</a>
</div></div>
<div id="main">

<h1>Who We are</h1>
<p>Lorem <a href="x">ipsum</a> dolor sit amet, consectetur adipiscing elit. In ac mi eu nulla tempus accumsan. Nulla facilisi. In hac habitasse platea dictumst. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Morbi pretium nisi vel elit tristique quis feugiat nisi rhoncus. In hac habitasse platea dictumst. Nulla euismod consectetur dolor, id gravida elit ornare non. Donec at lectus orci. Nam non pellentesque diam. Fusce posuere, risus quis gravida euismod, odio arcu suscipit tortor, sed hendrerit urna nibh id elit. Suspendisse accumsan, diam in pretium rutrum, leo lorem pharetra mi, ac vehicula leo dui in arcu. Sed a augue quam. Nulla et elit neque, sit amet luctus odio. Fusce tincidunt, nulla nec laoreet sollicitudin, tellus augue laoreet sem, non pellentesque ipsum turpis a nibh. Pellentesque dui enim, accumsan sit amet vestibulum sit amet, cursus et elit. Vivamus nec felis massa, vitae ultricies arcu. Vestibulum congue fringilla tortor sed molestie. Nunc ultrices ante at enim tempus dignissim. Morbi a tortor tortor.</p>

<p>Vestibulum sed quam lectus, eget facilisis ligula. Ut blandit nibh arcu. Quisque iaculis, tellus vel mollis tempor, urna massa volutpat leo, eu vehicula nisl tellus a augue. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Aliquam erat volutpat. Cras at dolor felis, ac commodo nibh. Vivamus facilisis purus quis ante feugiat eu sodales diam tincidunt. In hac habitasse platea dictumst. In auctor dictum justo et dictum. Mauris hendrerit tincidunt tellus, vel imperdiet nibh dignissim id. Mauris eget dui eget sapien varius fringilla eget et ante. Duis volutpat commodo eleifend. Morbi auctor blandit elit, non feugiat velit varius scelerisque. Cras at blandit est. Cras sit amet sem lectus. Quisque sodales gravida nisl, sit amet ultricies dui tempus in. Quisque malesuada mattis metus, et dictum erat condimentum eget. Quisque feugiat ipsum sed nibh dictum ultricies.</p>

<h2>Activites</h2>
<p>Sed quis nisi a lorem lacinia mollis. Sed posuere, lorem iaculis feugiat facilisis, arcu lacus laoreet tellus, vel molestie dolor tortor nec ipsum. Morbi aliquet, urna tempus bibendum egestas, libero sem malesuada felis, eget mollis ligula urna ut turpis. Donec suscipit, nunc eget dictum fringilla, tortor diam cursus sapien, vel interdum ligula orci vel leo. Pellentesque id dictum magna. Vivamus sit amet massa at tortor placerat vehicula a quis libero. Nullam quis neque quis nisi viverra sodales. In ornare pretium orci, at iaculis libero dignissim vel. Donec non urna ipsum. Aenean ligula arcu, malesuada hendrerit ultrices ut, rutrum sit amet mi. Nulla vel ullamcorper velit. Donec sit amet libero ut erat aliquam mollis eget nec leo. Nullam non consectetur tellus. Phasellus sagittis erat vitae enim convallis venenatis placerat risus luctus.</p>
</div>


<div id="side">
<h1>info</h1>

This layout incorporates round rectangles, gradients, shadows, and opacity effects that are not supported in internet explorer.  Please upgrade to a better browser like Chrome or Safari.

<h2>Credit</h2>
Please leave Figmint's credit at the bottom.
</div>
<div class="clearer"></div>



<div id="cbottom">Layout Design © Frisby at <a href="http://figmint.uuuq.com/">Figmint</a>.  Site content © us.</div>

</body>
</HTML>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<head>
<title>Your Title Here</title>

<style type="text/css">
body{
	padding: 0px;margin:0px;height: 100%;width: 100%;
	font-family:helvetica;font-size: 14px;
}
#bar{
top: 0px;
left: 0px;
height: 100px;
background:-webkit-gradient(linear,left bottom,left top,color-stop(0.37, rgb(0,0,0)),color-stop(0.91, rgb(83,83,83)));
background:-moz-linear-gradient(center bottom,rgb(0,0,0) 37%,rgb(83,83,83) 91%);
box-shadow:0px 5px 50px #aaa;-webkit-box-shadow:0px 5px 50px #aaa;-moz-box-shadow: 0px 5px 50px #aaa;
margin-bottom: 20px;
}
div.bar{
	font-size: 30px;
	font-weight: bold;
	text-transform: uppercase;	
	color: rgba(256,256,256,.5);
	padding: 20px;
}

div.bar sub{
	font-style: italic;
	font-size: 15px;
	text-transform:lowercase;
	vertical-align:middle;
}

.bar a, h2, h1{
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	color: rgba(256,256,256,.5);
	text-decoration: none;
	text-transform: lowercase;
}

.bar a{
	font-size: 15px;
	padding: 3px;
	font-style:normal;
}
.bar a:hover{
	color: rgb(0,0,0);
	background: rgba(256,256,256,.5);

}
h1{
	padding: 5px;
}
h2{
	padding: 4px;
}
h1,h2{
background:-webkit-gradient(linear,left bottom,left top,color-stop(0.37, rgb(0,0,0)),color-stop(0.91, rgb(83,83,83)));
background:-moz-linear-gradient(center bottom,rgb(0,0,0) 37%,rgb(83,83,83) 91%);
box-shadow:0px 5px 0px #aaa;-webkit-box-shadow:0px 5px 10px #aaa;-moz-box-shadow: 0px 5px 0px #aaa;
}


#main{
	position:relative;
	float: left;
	width: 70%;
	padding: 10px;

}
	
#side{
	color: #49494A;
	position:relative;
	float: right;
	width: 23%;
	height: auto;
	padding: 10px;
	margin-right: 10px;	
}

.clearer{clear:both;width:100%;height:0;}
#cbottom{
	text-align:center;
	clear: both;
	margin: 50px 5px 5px 5px;
	font-size: 12px;
}

a, #cbottom{
	color: #AAAAAA;
	font-style:italic;
	text-decoration: none;
}
a:hover{
	color: #49494A;
}

</style>


</head>
<body>
<div id="bar">
<div class="bar">
Elsewhere <sub>We've got Oatmeal.</sub>
<br>
<a href="x">home</a>
<a href="x">forum</a>
<a href="x">art</a>
<a href="x">writing</a>
</div></div>
<div id="main">

<h1>Who We are</h1>
<p>Lorem <a href="x">ipsum</a> dolor sit amet, consectetur adipiscing elit. In ac mi eu nulla tempus accumsan. Nulla facilisi. In hac habitasse platea dictumst. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Morbi pretium nisi vel elit tristique quis feugiat nisi rhoncus. In hac habitasse platea dictumst. Nulla euismod consectetur dolor, id gravida elit ornare non. Donec at lectus orci. Nam non pellentesque diam. Fusce posuere, risus quis gravida euismod, odio arcu suscipit tortor, sed hendrerit urna nibh id elit. Suspendisse accumsan, diam in pretium rutrum, leo lorem pharetra mi, ac vehicula leo dui in arcu. Sed a augue quam. Nulla et elit neque, sit amet luctus odio. Fusce tincidunt, nulla nec laoreet sollicitudin, tellus augue laoreet sem, non pellentesque ipsum turpis a nibh. Pellentesque dui enim, accumsan sit amet vestibulum sit amet, cursus et elit. Vivamus nec felis massa, vitae ultricies arcu. Vestibulum congue fringilla tortor sed molestie. Nunc ultrices ante at enim tempus dignissim. Morbi a tortor tortor.</p>

<p>Vestibulum sed quam lectus, eget facilisis ligula. Ut blandit nibh arcu. Quisque iaculis, tellus vel mollis tempor, urna massa volutpat leo, eu vehicula nisl tellus a augue. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Aliquam erat volutpat. Cras at dolor felis, ac commodo nibh. Vivamus facilisis purus quis ante feugiat eu sodales diam tincidunt. In hac habitasse platea dictumst. In auctor dictum justo et dictum. Mauris hendrerit tincidunt tellus, vel imperdiet nibh dignissim id. Mauris eget dui eget sapien varius fringilla eget et ante. Duis volutpat commodo eleifend. Morbi auctor blandit elit, non feugiat velit varius scelerisque. Cras at blandit est. Cras sit amet sem lectus. Quisque sodales gravida nisl, sit amet ultricies dui tempus in. Quisque malesuada mattis metus, et dictum erat condimentum eget. Quisque feugiat ipsum sed nibh dictum ultricies.</p>

<h2>Activites</h2>
<p>Sed quis nisi a lorem lacinia mollis. Sed posuere, lorem iaculis feugiat facilisis, arcu lacus laoreet tellus, vel molestie dolor tortor nec ipsum. Morbi aliquet, urna tempus bibendum egestas, libero sem malesuada felis, eget mollis ligula urna ut turpis. Donec suscipit, nunc eget dictum fringilla, tortor diam cursus sapien, vel interdum ligula orci vel leo. Pellentesque id dictum magna. Vivamus sit amet massa at tortor placerat vehicula a quis libero. Nullam quis neque quis nisi viverra sodales. In ornare pretium orci, at iaculis libero dignissim vel. Donec non urna ipsum. Aenean ligula arcu, malesuada hendrerit ultrices ut, rutrum sit amet mi. Nulla vel ullamcorper velit. Donec sit amet libero ut erat aliquam mollis eget nec leo. Nullam non consectetur tellus. Phasellus sagittis erat vitae enim convallis venenatis placerat risus luctus.</p>
</div>


<div id="side">
<h1>info</h1>

This layout incorporates round rectangles, gradients, shadows, and opacity effects that are not supported in internet explorer.  Please upgrade to a better browser like Chrome or Safari.

<h2>Credit</h2>
Please leave Figmint's credit at the bottom.
</div>
<div class="clearer"></div>



<div id="cbottom">Layout Design © Frisby at <a href="http://figmint.uuuq.com/">Figmint</a>.  Site content © us.</div>

</body>
</HTML>

Set: 3 Part


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Welcome</title>

<style type="text/css">
html, body {
	margin:0;
	padding:0;
	height:100%;
	background-color: #232323;
	font-family: Century, arial, helvetica;
	font-size: 12pt;
}
	
#container {
	min-height:100%;
	position:relative;
}
	
#header {
	background-image: url('http://i107.photobucket.com/albums/m315/kubummer/figmint/img/chalktop.png');
	position:absolute;
	top: 0px;
	left: 0px;
	background-repeat: repeat-x;
	width: 100%;
	height: 188px;
	z-index:1;	
}

#body {
	position:relative;
	width: auto;
	height: auto;
	z-index:2;
	margin: 20px;
}

#footer {
	position:relative;
	bottom:0px;
	width:100%;
	height:165px;		
	background-image: url('http://i107.photobucket.com/albums/m315/kubummer/figmint/img/chalkbottom.png');
	z-index: 0;
}

/*Body Components*/

#title, h1,h2, a.nav{
	font-family: century, arial rounded MT bold, helvetica;
	text-transform: lowercase;
	font-weight: normal;
	margin-top: 0px;
	padding: 3px;
}


#left h1, #left h2, #right a.nav{
	color: #FB15C7;
}

#right h1, #right h2{
	color: #66F13E;
}

#title{
	position: relative;
	top: 0px;
	left: -50px;
	font-size: 40px;
	height: 50px;
	z-index:2;
	color: #2e2e2e;
	width: auto;
}

	
#left{
	color:#95F17A;
	position:relative;
	float: left;
	top: 120px;
	width: 70%;
	padding: 10px;
}
	
#right{
	color: #F95FD6;
	position:relative;
	float: right;
	top: 120px;
	width: 25%;
	height: auto;
	padding: 10px;
}

/*nav*/


#footmess{
	position: relative;
	z-index: 1;
	background: rgba(35,35,35,.7);
	-moz-border-radius: 25px;
	-webkit-border-radius: 25px;
	width: 800px;
	margin: 50px 50px 50px 50px;
	padding: 5px;
	bottom: -165px;
	color: #FFFFFF;
}

#footmess a.nav{
	color:#95F17A;
	font-size: 15pt;
}

a.nav{
	font-size: 30px;
	text-decoration: none;
}


/*style*/

a{
	color: #FC16C8;
	text-decoration: none;
}
a:hover, #right a.nav:hover, #footmess a.nav:hover{
	color: #2E2E2E;
}

blockquote{
	background:#2E2E2E;
	padding: 4px;
	color:#FFFFFF;
	border-left: 1px dotted #FC16C8;
}

.clearer{clear:both;width:100%;height:0;}
	
</style>
<!--[if lt IE 7]>
<style media="screen" type="text/css">
#container {
	height:100%;
}
</style>
<![endif]-->

</head><body>
<div id="container"><div id="header"></div>
		
<div id="title"></div>
	<div id="body">
<div id="left">




<h1>user manual</h1>

<p>Thank you for using one of my layouts, I really appreciate it!  To enjoy it to the fullest extent, please take the time to review the following notes about editing and using the layout.</p>

<h2>copyright issues 'n' stuff</h2>
<p>If you wish to alter the layout in any way (besides just changing the words, titles, content, links, etc) please first look over Figmint's terms of use <a href="../surplus/tou.php">here</a> and if you have any questions you will find a handy link to my email at the bottom of that page.</p>

<h2>using</h2>
<p>If you wish to change the titles, links, and whatnot, simply find and replace replace the given text with what you want to say.  It is advised that you keep the titles and links from being too long, because once they reach a certain size, things start gettin' ugly.  With the links, be sure to change the url (the x between this quotation marks) as well as the clickable text.
<br>To change the "Welcome" page title, scroll to the top of the code and find where it says Welcome.  Replace it with the desired title.


<h1>Layout Functions</h1>
		
<p>Paragraph</p>
		
<h2>Smaller Header</h2>
List:
<ul>
<li>	<b>Bold Text</b>
<li><i>Italics</i>
<li><u>Underlined</u>
<li><a href="url goes here">Link</a>
</ul>



<blockquote>If you have any difficulties, please refer to a simple HTML guide or send me an email here: frisby.figmint@gmail.com</blockquote>
		
	


	
</div><div id="right">




		
<h1>hello there</h1>
<p>Write a little blurb here.  Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed ipsum nisl, hendrerit nec vulputate sed, vehicula eget lectus. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p>
		
<h1>Navigation</h1>
	
<center>
<a href="x" class="nav">news</a>
<br><a href="x" class="nav">about us</a>
<br><a href="x" class="nav">services</a>
<br><a href="x" class="nav">resources</a>
<br><a href="x" class="nav">forum</a>
</center>
<br>

<h2>Header</h2>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed ipsum nisl, hendrerit nec vulputate sed, vehicula eget lectus. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Morbi vitae erat vitae nisi molestie mollis. Sed porta est in libero luctus malesuada. Curabitur semper cursus felis, eu tempus ligula molestie sed. Lorem ipsum dolor sit amet, consectetur adipiscing elit. 
		
		
</div>		
</div>
<div class="clearer"></div>  
<div id="footmess">


<center>
<a href="x" class="nav">news </a>
<a href="x" class="nav">about us </a>
<a href="x" class="nav">services </a>
<a href="x" class="nav">resources </a>
<a href="x" class="nav">forum</a>
<Br>Content (c) Me 2010.  Layout by <a href="http://figmintdesigns.webs.com/">Frisby</a>.
</center>



</div><div id="footer"></div></div>
</body>
</html>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Welcome</title>

<style type="text/css">
html, body {
	margin:0;
	padding:0;
	height:100%;
	background-image: url('http://i107.photobucket.com/albums/m315/kubummer/figmint/img/copattern.jpg');
	font-family: helvetica;
}
	
#container {
	min-height:100%;
	position:relative;
}
	
#header {
	background-image: url('http://i107.photobucket.com/albums/m315/kubummer/figmint/img/cotop.png');
	position:absolute;
	top: -24px;
	left: 0px;
	background-repeat: repeat-x;
	width: 100%;
	height: 820px;
	z-index:1;	
}

#body {
	position:relative;
	width: 800px;
	height: auto;
	z-index:2;
	margin-left: 50px;
}

#footer {
	position:relative;
	margin-top: -500px;
	bottom:0px;
	width:100%;
	height:738px;		
	background-image: url('http://i107.photobucket.com/albums/m315/kubummer/figmint/img/cobot.png');
	z-index: 0;
}

/*Body Components*/

#title, h1,h2, a.nav{
	font-family: helvetica;
	text-transform: lowercase;
	color: #FFFFFF;
	text-shadow: 0px 0px 10px #000000;
	font-weight: normal;
	margin-top: 0px;
	padding: 3px;
}

#title{
	position: relative;
	top: 0px;
	font-size: 70px;
	text-shadow: 0px 0px 20px #000000;
	height: 80px;
	z-index:2;
}

#title sub{
	
	font-size: 30px;
	vertical-align:middle;
	font-style: italic;
}
	
#left{
	position:relative;
	float: left;
	width: 550px;
	background: rgba(169,188,191,.5);
	-moz-border-radius: 25px;
	-webkit-border-radius: 25px;
	padding: 10px;
}
	
#right{
	position:relative;
	float: right;
	width: 200px;
	height: auto;
	background: rgba(169,188,191,.5);
	-moz-border-radius: 25px;
	-webkit-border-radius: 25px;
	padding: 10px;
}

/*nav*/


#footmess{
	position: relative;
	z-index: 1;
	background: rgba(0,0,0,.1);
	-moz-border-radius: 25px;
	-webkit-border-radius: 25px;
	width: 800px;
	margin: 50px;
	padding: 5px;
	bottom: -270px;
}
a.nav{
	font-size: 30px;
	text-decoration: none;
}
a.nav:hover{
	text-shadow: 0px 0px 10px #FFFFFF;
	color: #FFFFFF;
}

/*style*/

a{
	color: #463755;
	text-decoration: none;
}
a:hover{
	color: #376B4D;
}

blockquote{
	background: rgba(0,0,0,.3);
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	padding: 4px;
	color:#FFFFFF;
}

.clearer{clear:both;width:100%;height:0;}
	
</style>
<!--[if lt IE 7]>
<style media="screen" type="text/css">
#container {
	height:100%;
}
</style>
<![endif]-->

</head><body>
<div id="container"><div id="header"></div><div id="body">
		
<div id="title">title here <sub>quality subtitles since 1809</sub></div>
	
<div id="left">




<h1>user manual</h1>

<p>Thank you for using one of my layouts, I really appreciate it!  To enjoy it to the fullest extent, please take the time to review the following notes about editing and using the layout.</p>

<h2>copyright issues 'n' stuff</h2>
<p>If you wish to alter the layout in any way (besides just changing the words, titles, content, links, etc) please first look over Figmint's terms of use <a href="../surplus/tou.php">here</a> and if you have any questions you will find a handy link to my email at the bottom of that page.</p>

<h2>using</h2>
<p>If you wish to change the titles, links, and whatnot, simply find and replace replace the given text with what you want to say.  It is advised that you keep the titles and links from being too long, because once they reach a certain size, things start gettin' ugly.  With the links, be sure to change the url (the x between this quotation marks) as well as the clickable text.
<br>To change the "Welcome" page title, scroll to the top of the code and find where it says Welcome.  Replace it with the desired title.


<h1>Layout Functions</h1>
		
<p>Paragraph</p>
		
<h2>Smaller Header</h2>
List:
<ul>
<li>	<b>Bold Text</b>
<li><i>Italics</i>
<li><u>Underlined</u>
<li><a href="url goes here">Link</a>
</ul>



<blockquote>If you have any difficulties, please refer to a simple HTML guide or send me an email here: frisby.figmint@gmail.com</blockquote>
		
	


	
</div><div id="right">




		
<h1>hello there</h1>
<p>Write a little blurb here.</p>
		
<h1>Navigation</h1>
	
<center>
<a href="x" class="nav">news</a>
<br><a href="x" class="nav">about us</a>
<br><a href="x" class="nav">services</a>
<br><a href="x" class="nav">resources</a>
<br><a href="x" class="nav">forum</a>
</center>
<br>
		
		
</div>		
</div>
<div class="clearer"></div>  
<div id="footmess">


<center>
<a href="x" class="nav">news </a>
<a href="x" class="nav">about us </a>
<a href="x" class="nav">services </a>
<a href="x" class="nav">resources </a>
<a href="x" class="nav">forum</a>
<Br>Content (c) Me 2010.  Layout by <a href="http://figmintdesigns.webs.com/">Frisby</a>.
</center>



</div><div id="footer"></div></div>
</body>
</html>

Set: Fancy Backgrounds

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >

<title>Title Here</title>

<style type="text/css">

body{
background-color:#FFFCF7;
background-image:url('http://i107.photobucket.com/albums/m315/kubummer/figmint/img/dreamspace.png');
font-family:verdana,arial;
line-height:15px;
font-size:10px;
color:#A0A0A0;
}
b{
letter-spacing:2px;
}
i{
letter-spacing:-1px;
color:#769F9F;
}
u{
text-decoration:none;
border-bottom:1px dotted #A5D9D8;
color:#A5D9D8;
}

#text{
margin: 0 auto;
width:480px;
height:auto;
background:#FFFCF7;
padding:10px;
border:3px dashed #CCF0EB;
}
a{
background: #8CBDBC;
color:#FFFCF7;
letter-spacing:1px;
font-size:10px;
text-decoration:none;
}
a:hover{
background: #A5D9D8;
}

h1{
background: #8CBDBC;
color:#FFFCF7;
}

h1,h2,a.nav{
font-size:20px;
line-height:20px;
font-family: helvetica;
text-transform:lowercase;
letter-spacing:3px;
font-weight:100;
}
h1,h2{
padding:3px;
}

h2{
text-align:right;
background: #FFFCF7;
color:#8CBDBC;}

a.nav:link, a.nav:active, a.nav:visited{
display:inline;
background:#8CBDBC;
color:#FFFCF7;
text-decoration:none;
padding:1px 13px 1px 13px;
margin:2px;
}
a.nav:hover,a:hover{
background:#A5D9D8;
}
</style>
</head>
<body>

<div ID="text">
<p align="center">
<a href="link" class="nav">home</a>
<a href="link" class="nav">site</a>
<a href="link" class="nav">visitor</a>
<a href="link" class="nav">other</a>

</p><br>


<p>Thanks for using this layout made by figmint.  Feel free to change the navigation links and the title of the page. You may relocate the credit so long as it is clearly visible.  Enjoy! (:
<br><br>

<h1>Level 1 header</h1>
<b>Bold text</b>, <i>italic text</i>, <u>underlined text</u>.  And, of course, a <a href="#">link</a> to no where.

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris tristique. Cras urna nulla, tincidunt ut, viverra dapibus, consectetur et, lacus. Integer vitae risus nec nunc faucibus tincidunt. Nulla nisi felis, bibendum ut, porta ac, hendrerit ut, quam. Phasellus rhoncus, metus ut adipiscing tincidunt, nulla lectus eleifend mauris, et imperdiet lacus magna sit amet metus. Aenean erat. Mauris gravida. Duis consequat, risus in convallis venenatis, sapien sem pharetra sapien, eget laoreet est est non lorem. In ultricies. Proin magna dolor, euismod a, varius in, semper et, ligula. Mauris eu justo. Donec justo ipsum, ultrices quis, placerat nec, auctor id, mi. Nunc aliquam est. Pellentesque ultrices molestie arcu. Duis ut est non nisl pretium ornare. Cras purus dui, tristique non, dictum placerat, rutrum et, metus. Morbi rhoncus erat. Morbi condimentum mauris a tortor.
</p>

<h2>Level 2 header</h2>


<p>
Donec egestas viverra odio. Pellentesque at quam at est feugiat accumsan. Quisque ultricies pulvinar lorem. Maecenas ac enim a leo ornare suscipit. Aliquam imperdiet. Nullam scelerisque velit at elit faucibus accumsan. Etiam nunc. Nullam sapien. Ut libero elit, porta nec, commodo sit amet, pellentesque ut, enim. Morbi a sem. Duis interdum venenatis neque. Etiam sapien diam, mollis vitae, iaculis nec, bibendum et, diam. In a arcu sed neque tempus commodo. Integer magna dui, commodo sed, laoreet ut, semper ac, lorem. In mattis dapibus elit. Nunc justo lacus, mollis id, convallis vel, convallis vel, leo. Nam fringilla sodales purus. Fusce luctus fringilla tortor.
</p>

<h1>credit</h1>
<center>Layout by <a href="http://www.neopets.com/~cooklus">Figmint</a>.  Background by <b>angelafaye</b> at Colourlovers.</center>
</div>




</div>
</body>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >

<title>Title Here</title>

<style type="text/css">

body{
background-color:#FFFCF7;
background-image:url('http://i107.photobucket.com/albums/m315/kubummer/figmint/img/silk.png');
font-family:verdana,arial;
line-height:15px;
font-size:10px;
color:#A0A0A0;
}
b{
color:#CCC1BE;
letter-spacing:2px;
}
i{
letter-spacing:-1px;
color:#BBB9B5;
}
u{
text-decoration:none;
border-bottom:1px dotted #DDD4D1;
color:#DDD4D1;
}

#text{
margin: 0 auto;
width:480px;
height:auto;
background:#FFFCF7;
padding:10px;
border:2px solid #CCC1BE;
}
a{
background: #CCC1BE;
color:#FFFCF7;
letter-spacing:1px;
font-size:10px;
text-decoration:none;
}
a:hover{
background: #FFFCF7;
color:#CCC1BE;
}

h1{
background: #CCC1BE;
color:#FFFCF7;
}

h1,h2,a.nav{
font-size:35px;
line-height:20px;
font-family: helvetica;
text-transform:lowercase;
letter-spacing:-3px;
font-weight:100;
}
h1,h2{
padding-right:3px;
padding-top:3px;
padding-bottom:3px;
}

h2{
text-align:right;
background: #FFFCF7;
color:#CCC1BE;}

a.nav:link, a.nav:active, a.nav:visited{
display:inline;
background:#CCC1BE;
color:#FFFCF7;
text-decoration:none;
padding:1px 13px 1px 13px;
margin:2px;
}
a.nav:hover,a:hover{
background:#FFFCF7;
color:#CCC1BE;
}
</style>
</head>
<body>

<div ID="text">
<p align="center">
<a href="link" class="nav">home</a>
<a href="link" class="nav">site</a>
<a href="link" class="nav">visitor</a>
<a href="link" class="nav">other</a>

</p><br>


<p>Thanks for using this layout made by figmint.  Feel free to change the navigation links and the title of the page. You may relocate the credit so long as it is clearly visible.  Enjoy! (:
<br><br>

<h1>Level 1 header</h1>
<b>Bold text</b>, <i>italic text</i>, <u>underlined text</u>.  And, of course, a <a href="#">link</a> to no where.

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris tristique. Cras urna nulla, tincidunt ut, viverra dapibus, consectetur et, lacus. Integer vitae risus nec nunc faucibus tincidunt. Nulla nisi felis, bibendum ut, porta ac, hendrerit ut, quam. Phasellus rhoncus, metus ut adipiscing tincidunt, nulla lectus eleifend mauris, et imperdiet lacus magna sit amet metus. Aenean erat. Mauris gravida. Duis consequat, risus in convallis venenatis, sapien sem pharetra sapien, eget laoreet est est non lorem. In ultricies. Proin magna dolor, euismod a, varius in, semper et, ligula. Mauris eu justo. Donec justo ipsum, ultrices quis, placerat nec, auctor id, mi. Nunc aliquam est. Pellentesque ultrices molestie arcu. Duis ut est non nisl pretium ornare. Cras purus dui, tristique non, dictum placerat, rutrum et, metus. Morbi rhoncus erat. Morbi condimentum mauris a tortor.
</p>

<h2>Level 2 header</h2>


<p>
Donec egestas viverra odio. Pellentesque at quam at est feugiat accumsan. Quisque ultricies pulvinar lorem. Maecenas ac enim a leo ornare suscipit. Aliquam imperdiet. Nullam scelerisque velit at elit faucibus accumsan. Etiam nunc. Nullam sapien. Ut libero elit, porta nec, commodo sit amet, pellentesque ut, enim. Morbi a sem. Duis interdum venenatis neque. Etiam sapien diam, mollis vitae, iaculis nec, bibendum et, diam. In a arcu sed neque tempus commodo. Integer magna dui, commodo sed, laoreet ut, semper ac, lorem. In mattis dapibus elit. Nunc justo lacus, mollis id, convallis vel, convallis vel, leo. Nam fringilla sodales purus. Fusce luctus fringilla tortor.
</p>

<h1>credit</h1>
<center>Layout by <a href="http://www.neopets.com/~cooklus">Figmint</a>.  Background by <b>wist</b> at Colourlovers.</center>
</div>




</div>
</body>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >

<title>Title Here</title>

<style type="text/css">

body{
background-color:#FFFCF7;
background-image:url('http://i107.photobucket.com/albums/m315/kubummer/figmint/img/wallpaper.png');
font-family:verdana,arial;
line-height:15px;
font-size:10px;
color:#929084;
}
b{
letter-spacing:2px;
}
i{
letter-spacing:-1px;
color:#EB977D;
}
u{
text-decoration:none;
border-bottom:1px dotted #E0BAAF;
color:#E0BAAF;
}

#text{
margin: 0 auto;
width:480px;
height:auto;
background:#FFFCF7;
padding:10px;
border:1px solid #6C5E5B;
}
a{
background: #6C5E5B;
color:#FFFCF7;
letter-spacing:1px;
font-size:10px;
text-decoration:none;
}
a:hover{
background: #E0BAAF;
}

h1{
background: #6C5E5B;
color:#FFFCF7;
}

h1,h2,a.nav{
font-size:20px;
line-height:20px;
font-family: helvetica;
text-transform:lowercase;
letter-spacing:3px;
font-weight:100;
}
h1,h2{
padding:3px;
}

h2{
text-align:right;
background: #FFFCF7;
color:#6C5E5B;}

a.nav:link, a.nav:active, a.nav:visited{
display:inline;
background:#6C5E5B;
color:#FFFCF7;
text-decoration:none;
padding:1px 13px 1px 13px;
margin:2px;
}
a.nav:hover,a:hover{
background:#E0BAAF;
}
</style>
</head>
<body>

<div ID="text">
<p align="center">
<a href="link" class="nav">home</a>
<a href="link" class="nav">site</a>
<a href="link" class="nav">visitor</a>
<a href="link" class="nav">other</a>

</p><br>


<p>Thanks for using this layout made by figmint.  Feel free to change the navigation links and the title of the page. You may relocate the credit so long as it is clearly visible.  Enjoy! (:
<br><br>

<h1>Level 1 header</h1>
<b>Bold text</b>, <i>italic text</i>, <u>underlined text</u>.  And, of course, a <a href="#">link</a> to no where.

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris tristique. Cras urna nulla, tincidunt ut, viverra dapibus, consectetur et, lacus. Integer vitae risus nec nunc faucibus tincidunt. Nulla nisi felis, bibendum ut, porta ac, hendrerit ut, quam. Phasellus rhoncus, metus ut adipiscing tincidunt, nulla lectus eleifend mauris, et imperdiet lacus magna sit amet metus. Aenean erat. Mauris gravida. Duis consequat, risus in convallis venenatis, sapien sem pharetra sapien, eget laoreet est est non lorem. In ultricies. Proin magna dolor, euismod a, varius in, semper et, ligula. Mauris eu justo. Donec justo ipsum, ultrices quis, placerat nec, auctor id, mi. Nunc aliquam est. Pellentesque ultrices molestie arcu. Duis ut est non nisl pretium ornare. Cras purus dui, tristique non, dictum placerat, rutrum et, metus. Morbi rhoncus erat. Morbi condimentum mauris a tortor.
</p>

<h2>Level 2 header</h2>


<p>
Donec egestas viverra odio. Pellentesque at quam at est feugiat accumsan. Quisque ultricies pulvinar lorem. Maecenas ac enim a leo ornare suscipit. Aliquam imperdiet. Nullam scelerisque velit at elit faucibus accumsan. Etiam nunc. Nullam sapien. Ut libero elit, porta nec, commodo sit amet, pellentesque ut, enim. Morbi a sem. Duis interdum venenatis neque. Etiam sapien diam, mollis vitae, iaculis nec, bibendum et, diam. In a arcu sed neque tempus commodo. Integer magna dui, commodo sed, laoreet ut, semper ac, lorem. In mattis dapibus elit. Nunc justo lacus, mollis id, convallis vel, convallis vel, leo. Nam fringilla sodales purus. Fusce luctus fringilla tortor.
</p>

<h1>credit</h1>
<center>Layout by <a href="http://www.neopets.com/~cooklus">Figmint</a>.  Background by <b>micruciani</b> at Colourlovers.</center>
</div>




</div>
</body>

Set: Simple and Clean

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >

<title>Welcome to Mysite!</title>

<style type="text/css">
body{
background-color:#2D3839;
font-family:tahoma;
}

#hold{
margin:0 auto;
top:0px;
top:40px;
width:700px;
height:auto;
background-color:#E0E4CE;
border:10px solid #27191C;
}

#title, #subtitle, #navspace{
text-transform:lowercase;
}

#title{
height:70px;
overflow:hidden;
text-align:center;
color:#27191C;
font-size:60px;
}
#subtitle{
top:-20px;
height:30px;
overflow:hidden;
text-align:center;
color:#2D3839;
font-size:15px;
}

#footerspace{
text-transform:lowercase;
left:80px;
clear: both; 
bottom:20px;
height:40px;
width:690px;
background:#F1F3EA;
padding:5px;
text-align:center;
margin-top:20px;
margin-bottom:20px;
font-size:11px;
}
p.ft{
vertical-align:middle;
}

#navspace{
top:110px;
height:40px;
width:690px;
background:#F1F3EA;
padding:5px;
text-align:center;
}

a.nl{
display:inline;
font-size:30px;
line-height:40px;
color:#27191C;
text-decoration:none;
padding:4px;
}

a.nl:hover{
color:#2D3839;
}

#main{
top:180px;
left:0px;
width:480px;
height:auto;
color:#27191C;
font-size:12px;
float:left;
padding:10px;
}

#sidebar{
top:180px;
left:520px;
width:180px;
height:auto;
color:#27191C;
font-size:12px;
float:right;
text-align:justify;
padding:10px;
}

h1,h2{
color:#FFFFFF;
font-weight:normal;
text-transform:lowercase;
}
h1{
color:#2D3839;
}
h2{
color:#114D4D;
}

a{
color:#114D4D;
}
a:hover{
color:#6E9987;
}



</style>

</head>
<body>
<div id="hold">
<div id="title">mysite.com</div>
<div id="subtitle">supplying you with filler text since earlier this morning</div>

<div id="navspace">
<a href="xxx" class="nl">Blog</a>
<a href="xxx" class="nl">About</a>
<a href="xxx" class="nl">Archive</a>
<a href="xxx" class="nl">Network</a>
<a href="xxx" class="nl">More</a>
</div>

<div id="main">
<h1>Lorem Ipsum</h1>

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent est risus, lacinia eget interdum a, tempus vitae ante. Fusce vitae risus et tellus facilisis facilisis ac at mauris. Duis sollicitudin tincidunt lectus eget accumsan. Suspendisse hendrerit fermentum scelerisque. Fusce congue porttitor magna nec rutrum. Nullam erat mi, lacinia quis pulvinar eu, molestie a est. Integer et ullamcorper sem. Morbi volutpat, ante non interdum cursus, enim ante lacinia justo, et porttitor sapien lectus gravida mi. Maecenas interdum lobortis congue. Quisque a dui tellus, sed adipiscing magna. Duis volutpat, lectus eget facilisis rhoncus, augue metus convallis tellus, at fringilla odio dui eu libero. Vivamus tristique ultricies lacinia.

<p>Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Praesent a pharetra nunc. Ut quis neque quis quam volutpat pharetra. Aenean commodo neque ac nibh sollicitudin fringilla. Nam ut nisl neque. Integer arcu mi, faucibus quis pharetra vel, ornare vel lorem. Praesent ac arcu lacus. Maecenas lobortis aliquet massa, in vulputate felis dapibus eget. Nam sit amet tincidunt felis. Pellentesque tincidunt turpis ut enim gravida eu semper mauris varius. Suspendisse potenti. Mauris laoreet mi sit amet risus ultrices malesuada. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce venenatis, orci vel tincidunt ornare, eros quam egestas sem, sit amet aliquet lacus magna eu felis. Duis faucibus nulla suscipit ante lacinia et gravida nibh ultricies. Suspendisse potenti. Duis pellentesque placerat enim, sed ultrices urna auctor vitae. Aenean at nulla at eros euismod eleifend at ut velit. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Sed adipiscing, neque consectetur fringilla egestas, elit justo eleifend tellus, ut rutrum nulla eros gravida lorem.

<p>Fusce eget mauris vel lectus porttitor vulputate eu sit amet lacus. Nulla accumsan interdum pharetra. Suspendisse libero justo, hendrerit ac mollis viverra, sollicitudin in erat. Praesent eget malesuada elit. Nulla adipiscing lobortis ipsum eu accumsan. Proin vitae nibh id magna molestie dignissim quis vitae mauris. Duis ac erat at enim fermentum malesuada. Phasellus imperdiet aliquet lacus, sit amet ornare sapien mollis ac. Donec metus velit, fermentum vitae ultricies id, varius id risus. Nulla volutpat pretium leo, et placerat est volutpat ac. Aenean facilisis arcu sit amet mauris luctus vel accumsan enim mattis. Cras tempus turpis quis augue commodo feugiat. Pellentesque laoreet, felis sed luctus laoreet, lectus eros iaculis purus, sed elementum ante nibh ac ligula. Phasellus eleifend dapibus neque consectetur pulvinar. Aenean placerat malesuada odio, vel consequat diam rhoncus nec. Fusce sodales nisi eget justo sagittis quis egestas nunc pulvinar. Nulla nisl metus, vulputate ut dapibus id, vulputate id tellus. Praesent id lorem sapien.

<p>Vestibulum fringilla ultrices quam vitae rhoncus. Donec aliquam lorem vel augue aliquet non fermentum velit sagittis. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Suspendisse eu lorem vitae sapien varius adipiscing vitae vulputate tortor. In luctus gravida elit, id faucibus lacus gravida nec. Fusce commodo, lacus ultrices venenatis sollicitudin, velit leo elementum nunc, at pretium augue enim vitae nulla. Fusce feugiat, felis vel bibendum vehicula, tortor turpis rhoncus nisi, id tristique nunc lacus at nisi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Integer volutpat convallis risus, pulvinar hendrerit nulla dictum ac. In hac habitasse platea dictumst. Sed cursus rutrum sapien, nec venenatis risus lacinia eu. Integer eu pretium enim. Nullam venenatis eleifend tellus, vel tempus lorem aliquet ac. Suspendisse potenti. Donec varius cursus pretium. Morbi fringilla, risus ac semper vestibulum, neque odio placerat nunc, eget fringilla eros nulla vel felis. Pellentesque tincidunt est viverra sem venenatis ut pulvinar nisi molestie.

<p>Aliquam nunc erat, tristique a gravida eget, luctus at sem. Aliquam sollicitudin dignissim ante sed iaculis. Vivamus lobortis, augue ut euismod posuere, leo odio rutrum magna, vel aliquet nisi purus eu augue. Sed semper pulvinar iaculis. Aenean et diam libero. Phasellus at urna a libero luctus rutrum. Proin eget sem gravida elit scelerisque dapibus id euismod leo. Suspendisse potenti. Maecenas quis erat lacus, et cursus enim. Etiam leo tellus, scelerisque vitae porttitor ac, rutrum et mi. Aenean ac dolor lacus. Praesent condimentum, diam eget consequat cursus, justo ipsum pharetra orci, quis fringilla magna mi in urna.
</div>

<div id="sidebar">

<h2>user manual</h2>

Feel free to change the titles and links along with their addresses.  Actually, please do!  You won't have much of a site if you don't.  You are allowed to minorly edit the layout--its colors, maybe a font here and there, but please, if you want to completely renovate it lemme know, <a href="">here</a>.
<p>
You may <b>not</b> claim that you created the layout.  I'm not worried about that though.  If you're using this, you'll hopefully respect the both of us enough to not steal.  Stealing shows you do not appreciate what I do for you, and it also shows you're a real bumhead.  Don't do it.


</div>
<div id="footerspace">
<p class="ft">
Layout design and coding by <a href="http://figmintdesigns.webs.com/">Figmint</a>.   Color palette by <a href="http://www.colourlovers.com/palette/911100/oxygenation">Electroluv</a>. Content by Mysite.com.
</p></div>
</div>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >

<title>Welcome to Mysite!</title>

<style type="text/css">
body{
background-color:#000000;
font-family:tahoma;
}

#hold{
margin:0 auto;
top:40px;
width:700px;
height:auto;
}

#title, #subtitle, #navspace{
text-transform:lowercase;
}

#title{
height:70px;
overflow:hidden;
text-align:center;
color:#FFFFFF;
font-size:60px;
}
#subtitle{
top:-20px;
height:30px;
overflow:hidden;
text-align:center;
color:#FFFFFF;
font-size:15px;
}

#footerspace{
text-transform:lowercase;
left:80px;
clear: both; 
bottom:20px;
height:40px;
width:690px;
background:#FFFFFF;
padding:5px;
text-align:center;
margin-top:20px;
margin-bottom:20px;
font-size:11px;
}
p.ft{
vertical-align:middle;
}

#navspace{
top:110px;
height:40px;
width:690px;
background:#FFFFFF;
padding:5px;
text-align:center;
}

a.nl{
display:inline;
font-size:30px;
line-height:40px;
color:#000000;
text-decoration:none;
padding:4px;
}

a.nl:hover{
background-color:#EEEEEE;
color:#000000;
}

#main{
top:180px;
left:0px;
width:500px;
height:auto;
color:#DDDDDD;
font-size:12px;
float:left;
}

#sidebar{
top:180px;
left:520px;
width:180px;
height:auto;
color:#DDDDDD;
font-size:12px;
float:right;
text-align:justify;
}

h1,h2{
color:#FFFFFF;
font-weight:normal;
text-transform:lowercase;
}

a{
color:#AAAAAA;
}
a:hover{
color:#EEEEEE;
}



</style>

</head>
<body>
<div id="hold">
<div id="title">mysite.com</div>
<div id="subtitle">supplying you with filler text since earlier this morning</div>

<div id="navspace">
<a href="xxx" class="nl">Blog</a>
<a href="xxx" class="nl">About</a>
<a href="xxx" class="nl">Archive</a>
<a href="xxx" class="nl">Network</a>
<a href="xxx" class="nl">More</a>
</div>

<div id="main">
<h1>Lorem Ipsum</h1>

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent est risus, lacinia eget interdum a, tempus vitae ante. Fusce vitae risus et tellus facilisis facilisis ac at mauris. Duis sollicitudin tincidunt lectus eget accumsan. Suspendisse hendrerit fermentum scelerisque. Fusce congue porttitor magna nec rutrum. Nullam erat mi, lacinia quis pulvinar eu, molestie a est. Integer et ullamcorper sem. Morbi volutpat, ante non interdum cursus, enim ante lacinia justo, et porttitor sapien lectus gravida mi. Maecenas interdum lobortis congue. Quisque a dui tellus, sed adipiscing magna. Duis volutpat, lectus eget facilisis rhoncus, augue metus convallis tellus, at fringilla odio dui eu libero. Vivamus tristique ultricies lacinia.

<p>Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Praesent a pharetra nunc. Ut quis neque quis quam volutpat pharetra. Aenean commodo neque ac nibh sollicitudin fringilla. Nam ut nisl neque. Integer arcu mi, faucibus quis pharetra vel, ornare vel lorem. Praesent ac arcu lacus. Maecenas lobortis aliquet massa, in vulputate felis dapibus eget. Nam sit amet tincidunt felis. Pellentesque tincidunt turpis ut enim gravida eu semper mauris varius. Suspendisse potenti. Mauris laoreet mi sit amet risus ultrices malesuada. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce venenatis, orci vel tincidunt ornare, eros quam egestas sem, sit amet aliquet lacus magna eu felis. Duis faucibus nulla suscipit ante lacinia et gravida nibh ultricies. Suspendisse potenti. Duis pellentesque placerat enim, sed ultrices urna auctor vitae. Aenean at nulla at eros euismod eleifend at ut velit. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Sed adipiscing, neque consectetur fringilla egestas, elit justo eleifend tellus, ut rutrum nulla eros gravida lorem.

<p>Fusce eget mauris vel lectus porttitor vulputate eu sit amet lacus. Nulla accumsan interdum pharetra. Suspendisse libero justo, hendrerit ac mollis viverra, sollicitudin in erat. Praesent eget malesuada elit. Nulla adipiscing lobortis ipsum eu accumsan. Proin vitae nibh id magna molestie dignissim quis vitae mauris. Duis ac erat at enim fermentum malesuada. Phasellus imperdiet aliquet lacus, sit amet ornare sapien mollis ac. Donec metus velit, fermentum vitae ultricies id, varius id risus. Nulla volutpat pretium leo, et placerat est volutpat ac. Aenean facilisis arcu sit amet mauris luctus vel accumsan enim mattis. Cras tempus turpis quis augue commodo feugiat. Pellentesque laoreet, felis sed luctus laoreet, lectus eros iaculis purus, sed elementum ante nibh ac ligula. Phasellus eleifend dapibus neque consectetur pulvinar. Aenean placerat malesuada odio, vel consequat diam rhoncus nec. Fusce sodales nisi eget justo sagittis quis egestas nunc pulvinar. Nulla nisl metus, vulputate ut dapibus id, vulputate id tellus. Praesent id lorem sapien.

<p>Vestibulum fringilla ultrices quam vitae rhoncus. Donec aliquam lorem vel augue aliquet non fermentum velit sagittis. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Suspendisse eu lorem vitae sapien varius adipiscing vitae vulputate tortor. In luctus gravida elit, id faucibus lacus gravida nec. Fusce commodo, lacus ultrices venenatis sollicitudin, velit leo elementum nunc, at pretium augue enim vitae nulla. Fusce feugiat, felis vel bibendum vehicula, tortor turpis rhoncus nisi, id tristique nunc lacus at nisi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Integer volutpat convallis risus, pulvinar hendrerit nulla dictum ac. In hac habitasse platea dictumst. Sed cursus rutrum sapien, nec venenatis risus lacinia eu. Integer eu pretium enim. Nullam venenatis eleifend tellus, vel tempus lorem aliquet ac. Suspendisse potenti. Donec varius cursus pretium. Morbi fringilla, risus ac semper vestibulum, neque odio placerat nunc, eget fringilla eros nulla vel felis. Pellentesque tincidunt est viverra sem venenatis ut pulvinar nisi molestie.

<p>Aliquam nunc erat, tristique a gravida eget, luctus at sem. Aliquam sollicitudin dignissim ante sed iaculis. Vivamus lobortis, augue ut euismod posuere, leo odio rutrum magna, vel aliquet nisi purus eu augue. Sed semper pulvinar iaculis. Aenean et diam libero. Phasellus at urna a libero luctus rutrum. Proin eget sem gravida elit scelerisque dapibus id euismod leo. Suspendisse potenti. Maecenas quis erat lacus, et cursus enim. Etiam leo tellus, scelerisque vitae porttitor ac, rutrum et mi. Aenean ac dolor lacus. Praesent condimentum, diam eget consequat cursus, justo ipsum pharetra orci, quis fringilla magna mi in urna.
</div>

<div id="sidebar">

<h2>user manual</h2>

Feel free to change the titles and links along with their addresses.  Actually, please do!  You won't have much of a site if you don't.  You are allowed to minorly edit the layout--its colors, maybe a font here and there, but please, if you want to completely renovate it lemme know, <a href="">here</a>.
<p>
You may <b>not</b> claim that you created the layout.  I'm not worried about that though.  If you're using this, you'll hopefully respect the both of us enough to not steal.  Stealing shows you do not appreciate what I do for you, and it also shows you're a real bumhead.  Don't do it.


</div>
<div id="footerspace">
<p class="ft">
Layout design and coding by <a href="http://figmintdesigns.webs.com/">Figmint</a>.  Content by Mysite.com.
</p></div>
</div>

Set: Miniskins

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">



<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >

<title>Welcome</title>

<style type="text/css">
body{
background:#C5C5C5;
font-family:tahoma, helvetica, verdana, arial;
font-size:13px;
}

#b{
background:url('../previews/msbg.png');
}

a:hover,a.nav:hover{
color:#C5C5C5;
}

table.p textarea, textarea, input, table.p td, blockquote, div.comment, .q{
border:1px solid #DDD;
color:#bbbbbb;
background:#EdEdEd;
}

#s{position:relative;margin:0px auto;width:550px;top:-73px;
text-align:center;color:#AAAAAA;}

#t{
position:relative;
margin:0px auto;
width:550px;
}

.title{
position:relative;
top:32px;
left:30px;
width:500px;
font-size:50px;
height:55px;
overflow:hidden;
color:#FFFFFF;
z-index:4;
}

#b{
position:relative;
margin:0px auto;
width:550px;
min-height:500px;
overflow:auto;
top:-73px;
left:0px;
z-index:3;
}

#left{
position:relative;
left:0px;
float:left;
top:-24px;
width:350px;
padding:10px;
color:#A4A4A4;
}

#right{
padding:10px;
position:relative;
right:0px;
top:-24px;
float:right;
width:160px;
color:#FFFFFF;
}

a{font-weight:bold;
text-decoration:none;
color:inherit;}

h1,h2,h3,h4,a.nav,.title{
font-weight:normal;
text-transform:uppercase;
display: block;
clear: both;
}

h1{font-size:26px;margin:0px;}

.nav{text-align:left;}

a.nav{
color:#FFFFFF;
display:block;
font-size:20px;
text-decoration:none;
margin-top:12px;
}

p{margin-top:0px;}

img{
border:none;
}

code,pre{
color: #000000;
font-size:11px;
}

pre{
height:auto;
overflow:auto;
width:auto;
display:inherit;
}

blockquote{
padding: 10px;
}

</style>

</head>
<body>
<div id="t"><div class="title">site name</div></div>

<div id="b">
<img src="../previews/mstop.png" alt="Its only superstition!">

<div id="left">


<h1>user manual</h1>

<p>Thank you for using one of my layouts, I really appreciate it!  To enjoy it to the fullest extent, please take the time to review the following notes about editing and using the layout.</p>

<h2>copyright issues 'n' stuff</h2>
<p>If you wish to alter the layout in any way (besides just changing the words, titles, content, links, etc) please first look over Figmint's terms of use <a href="../surplus/tou.php">here</a> and if you have any questions you will find a handy link to my email at the bottom of that page.</p>

<h2>using</h2>
<p>If you wish to change the titles, links, and whatnot, simply find and replace replace the given text with what you want to say.  It is advised that you keep the titles and navigation links from being too long, because once they reach a certain size, things start gettin' ugly.  With the links, be sure to change the url (the bit between the quotation marks) as well as the clickable text.
<br>To change the page title, scroll to the top of the code and find where it says Welcome.  Replace it with the desired title.  You should also change where it says "site name" to your site's name.  This can be changed just before the beginning of this user manual.


<h1>Layout Functions</h1>
		
<p>Paragraph</p>
		
<h2>Smaller Header</h2>
<h3>Even smaller</h3>
List:
<ul>
<li>	<b>Bold Text</b>
<li><i>Italics</i>
<li><u>Underlined</u>
<li><a href="url goes here">Link</a>
</ul>



<blockquote>If you have any difficulties, please refer to a simple HTML guide or send me an email here: frisby.figmint@gmail.com</blockquote>
		




</div>
<div id="right">


<h1 class="s">ABOUT.</h1>
<p>Write a little blurb here.  Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed ipsum nisl, hendrerit nec vulputate sed, vehicula eget lectus. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p>

<div class="nav">
<a href="url" class="nav">Link</a>
Caption here please.

<a href="url" class="nav">Link</a>
Caption here please.

<a href="url" class="nav">Link</a>
Caption here please.

<a href="url" class="nav">Link</a>
Caption here please.

</div>
</div>

</div>
<div id="s"><P><img src="../previews/msbottom.png" alt="layout by frisby at figmint">
</p>

<a href="x">Link</a>
<a href="x">Link</a>
<a href="x">Link</a>
<a href="http://figmintdesigns.webs.com/">Credit</a>
<br>
</div>

</body>
</HTML>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >

<title>Your Site Title Here</title>

<style type="text/css">
#img{position:absolute;top:0px;left:0px;z-index:-1;}
#l{position:absolute;top:160px;width:193px;height:375px;left:414px;overflow:auto;}
#m{position:absolute;top:160px;left:85px;width:320px;height:373px;overflow:auto;padding-right:2px;}
#w{position:absolute;top:90px;left:309px;width:auto;height:auto;}

body{color:#000;background-color:#323232;}
body,table,td{font-family:tahoma,Trebuchet MS;font-size: 11px;}
a:link,a:active,a:visited{
color:#397D7C;font-size:10px;text-transform:uppercase;}
a:hover{
color:#000;font-size:10px;text-transform:uppercase;}

h1,h2,h3{
background:#323232;
color:#4ECBBF;
font-family:century gothic,tahoma;
font-weight:normal;
}
h1{
font-size:20px;
}
h2 {
font-size:15px;
}
h3 {
font-size:13px;
}

b{
font-family:century gothic,tahoma;
color:#397D7C;
}
i{
background:#323232;
color:#4ECBBF;
font-family:century gothic,tahoma;
}
u{
color:#323232;
font-size:10px;
text-transform:lowercase;
}

.box {
background:#48B7AD none repeat scroll 0 0;
border-right:12px solid #323232;
font-family:tahoma,Trebuchet MS;
padding:10px;margin:10px 2px 10px 2px;}

a.nav{
color:#FFFFFF;
font-family:century gothic;
font-size:25px;
line-height:25px;
font-weight:normal;
text-transform:lowercase;
padding:0px;
display:block;
text-decoration:none;
text-align:center;}
a.nav:hover{
color:#A4D5D0;}
</style>
</head><body><div id="w"><img src="http://i107.photobucket.com/albums/m315/kubummer/figmint/img/ciwelcome.png" alt="layout by frisby at figmint"></div>
<div id="img"><img src="http://i107.photobucket.com/albums/m315/kubummer/figmint/img/cibody.png" alt="layout by frisby at figmint"></div>
<div id="l">


<p>
<a href="" class="nav">Home</a>
<a href="" class="nav">About Us</a>
<a href="" class="nav">Services</a>
<a href="" class="nav">Links</a>
<a href="http://figmint.zzl.org" class="nav">Credit</a>
</p>


<h2>about the layout</h2>
As you may notice, this layout does not offer a great amount of space for the extra tidbits like your twittering, cbox, alternative links, affies, advertisements, etc.  A good idea would be to put many of those things on seperate page.  That way the layout would look neater and better.

<p>Oh, and I almost forgot--feel free to change the welcome message image to say your site's name or whatever. You can reposition it as well.



</div><div id="m">




<h1>Header 1</h1>

Welcome to the humble website of the Cookie Co.!  We sell thousands of different types of cookies from all around the globe, and thats not all!  We also <a href="xxx">remodel homes</a> to mimic the cozy sensation our mouthwatering delights instill in you, and everything is available at a <b>reasonable price</b>!



<h2>Header 2</h2>

New pictures of our most resent remodeling job are available under services at the left.  Our "cookie-houses" are becoming more popular than ever before, and as <i>Dessertmonger</i> reports, "in this economy, <u>now</u> is the time to deck out your house in delectable treats."


<h3>Header 3</h3>

You can fit some little tidbits at the bottom like so, but not very many.


<div class="box">
<table><tr><td><center>

Box 1 Content Here.

</center></td><td><center>


Box 2 content here.

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

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >

<title>Your Site Title Here</title>

<style type="text/css">
#img{position:absolute;top:120px;left:0px;z-index:-1;}
#l{position:absolute;top:152px;width:129px;height:441px;left:71px;padding:5px;overflow:auto;}
#m{position:absolute;top:162px;left:222px;width:428px;height:432px;padding:5px;overflow:auto;}
#w{position:absolute;top:76px;left:409px;width:auto;height:auto;}

body{color:#000;background-color:#181E1D;}
body,table,td{font-family:georgia;font-size: 11px;}
a:link,a:active,a:visited{color:#62928E;text-decoration:none;}
a:hover{color:#88CBC5;text-decoration:none;}

h1{
color:#88CBC5;
font-family:georgia;
font-size:32px;
font-weight:normal;
letter-spacing:4px;
text-transform:lowercase;
margin:10px 0px 10px 0px;
text-decoration:none;}

h1:first-letter{color:#62928E;}
h2,h3{
color:#FFF;
font-family: georgia;
font-size:20px;
font-weight:normal;
letter-spacing:2px;
text-transform:lowercase;
margin:10px 0px 10px 0px;}
h2{text-align:right;background:#88CBC5;}
h3{text-align:left;background:#62928E;}

b{color:#62928E;}
i{color:#FFF;background:#88CBC5;letter-spacing:2px;}
u{color:#181E1D;font-family:comic sans MS;}

.box {background:#BEE3E0;border:2px dotted #FFF; margin:10px 2px 10px 2px;padding:3px;}

a.nav{
color:#88CBC5;
font-family:georgia;
font-size:35px;
font-weight:normal;
letter-spacing:-4px;
text-transform:lowercase;
padding:0px;
line-height:20px;
display:block;
text-decoration:none;
text-align:right;}
a.nav:hover{
color:#62928E;}
a.nav:hover:before{
content:url(http://i107.photobucket.com/albums/m315/kubummer/figmint/img/navglow.png);}

</style>
</head><body><div id="w"><img src="http://i107.photobucket.com/albums/m315/kubummer/figmint/img/welcomemessage.png" alt="layout by frisby at figmint"></div>
<div id="img"><img src="http://i107.photobucket.com/albums/m315/kubummer/figmint/img/glowbody.png" alt="layout by frisby at figmint"></div>
<div id="l">


<p>
<a href="" class="nav">Home</a>
<a href="" class="nav">About Us</a>
<a href="" class="nav">Services</a>
<a href="" class="nav">Links</a>
<a href="http://figmint.zzl.org" class="nav">Credit</a>
</p>


<h2>important</h2>
Please leave credit for figmint somewhere.

<h3>header 3</h3>
Feel free to change the image that says welcome to say whatever you want.

<h2>uh oh...</h2>
Avoid making this sidebar big enough to scroll, because it'll look really ugly with the scrollbar.  You can always put stuff at the bottom of the main content space instead on in this little bar.






</div><div id="m">





<h1>Welcome!</h1>


Welcome to the humble website of the Cookie Co.!  We sell thousands of different types of cookies from all around the globe, and thats not all!  We also <a href="xxx">remodel homes</a> to mimic the cozy sensation our mouthwatering delights instill in you, and everything is available at a <b>reasonable price</b>!



<h1>Newsflash 8/5/09</h1>

New pictures of our most resent remodeling job are available under services at the left.  Our "cookie-houses" are becoming more popular than ever before, and as <i>Dessertmonger</i> reports, "in this economy, <u>now</u> is the time to deck out your house in delectable treats."


<h1>Newsflash 7/9/09</h1>

An example of overflow tidbits is below.  You could put your advertising, cbox, twitterage...All at the bottom! It works, and everything will look better.


<div class="box">
<table><tr><td><center>

<img src="http://img706.imageshack.us/img706/5366/web1r.png" alt="layout by frisby at figmint">

</center></td><td><center>

<img src="http://img857.imageshack.us/img857/5367/web2bo.png" alt="layout by frisby at figmint">


</center></td><td><center>

<img src="http://img818.imageshack.us/img818/6100/web3x.png" alt="layout by frisby at figmint">

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


</div>
</body>

Set: Distressed Vines

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >

<title>Title Here</title>

<style type="text/css">
body{
background-repeat:repeat-y;
background-image:url('http://img823.imageshack.us/img823/5468/webtealvinesrep.jpg');
background-color:#C9FAFF;
font-size:11px;
font-family:trebuchet ms;
color:#C9FAFF;
}
#image{
position:absolute;
top:0px;
left:0px;
}
#main{
position:absolute;
top:25px;
left:35px;
width:304px;
}

a.nav:link, a.nav:active, a.nav:visited{
background:#8DD8DE;}
a.nav:link, a.nav:active, a.nav:visited, a.nav:hover{
display:block;
line-height:110%;
font-family:Century Gothic, Georgia;
color:#C9FAFF;
font-size:20px;
text-align:right;
text-decoration:none;
margin:4px;
}
a.nav:hover{
border-left:20px solid #62C0C8;
background:#70C7D0;
}
#nav{
position:absolute;
top:18px;
left:347px;
height:105px;
width:154px;overflow:hidden;
}

#side{
position:absolute;
top:128px;
left:350px;
width:151px;
}

h1{
font-family:Century Gothic, Georgia;
color:#C9FAFF;
font-size:20px;
text-align:right;
border-left:20px solid #70C7D0;
background:#62C0C8;
font-weight:normal
}

a:link, a:hover, a:active{
color:#C9FAFF;
background:#62C0C8;
font-family:century gothic, georgia;
text-decoration:none;
}

a:hover{
color:#62C0C8;
background:#C9FAFF;
font-family:century gothic, georgia;
text-decoration:none;
}

i{
text-transform:uppercase;
font-family:verdana;
font-size:9px;
}

b{
text-transform:uppercase;
font-family:verdana;
font-size:9px;
}

u{
text-decoration:none;
border-bottom:1px dotted #C9FAFF;
}
</style>

<div ID="image">
<img src="http://img59.imageshack.us/img59/2873/webtealvines.jpg" alt="Layout by Figmint.zzl.org">
</div>
<div id="nav">


<a href="index.html" class=nav>Home</a>
<a href="sitely.html" class=nav>Sitely</a>
<a href="content.html" class=nav>Content</a>
<a href="more.html" class=nav>More</a>
</div>
<div ID="side">

<h1>Affies</h1>
Lorem ipsum sit dolor.  Blah blah blah.  Hmmmm...I feel mildly sick.  


<h1>Chat</h1>
Hello.  Alice's restaurant....50 people....organization...blind judge.


</div>
<div ID="main">


<h1>Lorem ipsum</h1>

<a href="#">Link</a> <i>italics</i> <u>underlined</u> <b>and bold</b>.  Blah blah blah.  Lorem ipsum sit dolor.  Blah blah blah.  Lorem ipsum sit dolor.  Blah blah blah.  Hmmmm...  Blah blah blah.  Lorem ipsum sit dolor.  Blah blah blah.  Lorem ipsum sit dolor.  Blah blah blah.  Hmmmm...  Blah blah blah.  Lorem ipsum sit dolor.  Blah blah blah.  Lorem ipsum sit dolor.  Blah blah blah.  Hmmmm...  Blah blah blah.  Lorem ipsum sit dolor.  Blah blah blah.  Lorem ipsum sit dolor.  Blah blah blah.  Hmmmm...

<h1>Lorem ipsum</h1>

Lorem ipsum sit dolor.  Blah blah blah.  Hmmmm...I feel mildly sick.  Hello.  Alice's restaurant....50 people....organization...blind judge.  This part of the webpage is complete.  e_e  You actually read all this?  I hope not...
</div>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >

<title>Title Here</title>

<style type="text/css">
body{
background-repeat:repeat-y;
background-color:#FFF0D1;
background-image:url('http://img853.imageshack.us/img853/7964/webgoldvinesrep.jpg');
font-size:11px;
font-family:trebuchet ms;
color:#FFF0D1;
}
#image{
position:absolute;
top:0px;
left:0px;
}
#main{
position:absolute;
top:25px;
left:35px;
width:304px;
}

a.nav:link, a.nav:active, a.nav:visited{
background:#E4CC9C;}
a.nav:link, a.nav:active, a.nav:visited, a.nav:hover{
display:block;
line-height:110%;
font-family:Century Gothic, Georgia;
color:#FFF0D1;
font-size:20px;
text-align:right;
text-decoration:none;
margin:4px;
}
a.nav:hover{
border-left:20px solid #D2B373;
background:#D9BC80;
}
#nav{
position:absolute;
top:22px;
left:347px;
height:100px;
width:154px;
}

#side{
position:absolute;
top:128px;
left:350px;
width:151px;
}

h1{
font-family:Century Gothic, Georgia;
color:#FFF0D1;
font-size:20px;
text-align:right;
border-left:20px solid #D9BC80;
background:#D2B373;
font-weight:normal
}

a:link, a:hover, a:active{
color:#FFF0D1;
background:#D2B373;
font-family:century gothic, georgia;
text-decoration:none;
}

a:hover{
color:#D2B373;
background:#FFF0D1;
font-family:century gothic, georgia;
text-decoration:none;
}

i{
text-transform:uppercase;
font-family:verdana;
font-size:9px;
}

b{
text-transform:uppercase;
font-family:verdana;
font-size:9px;
}

u{
text-decoration:none;
border-bottom:1px dotted #FFF0D1;
}
</style>

<div ID="image">
<img src="http://img842.imageshack.us/img842/4783/webgoldvines.jpg" alt="layout by frisby at figmint">
</div>
<div id="nav">


<a href=index.html class=nav>Home</a>
<a href=sitely.html class=nav>Sitely</a>
<a href=content.html class=nav>Content</a>
<a href=more.html class=nav>More</a>

</div>

<div ID="side">

<h1>Affies</h1>

Lorem ipsum sit dolor.  Blah blah blah.  Hmmmm...I feel mildly sick.  


<h1>Chat</h1>

Hello.  Alice's restaurant....50 people....organization...blind judge.
</div>

<div ID="main">

<h1>Lorem ipsum</h1>

<a href="#">Link</a> <i>italics</i> <u>underlined</u> <b>and bold</b>.  Blah blah blah.  Lorem ipsum sit dolor.  Blah blah blah.  Lorem ipsum sit dolor.  Blah blah blah.  Hmmmm...  Blah blah blah.  Lorem ipsum sit dolor.  Blah blah blah.  Lorem ipsum sit dolor.  Blah blah blah.  Hmmmm...  Blah blah blah.  Lorem ipsum sit dolor.  Blah blah blah.  Lorem ipsum sit dolor.  Blah blah blah.  Hmmmm...  Blah blah blah.  Lorem ipsum sit dolor.  Blah blah blah.  Lorem ipsum sit dolor.  Blah blah blah.  Hmmmm...

<h1>Lorem ipsum</h1>

Lorem ipsum sit dolor.  Blah blah blah.  Hmmmm...I feel mildly sick.  Hello.  Alice's restaurant....50 people....organization...blind judge.  This part of the webpage is complete.  e_e  You actually read all this?  I hope not...
</div>

General Website Layouts

<HTML>
<head>

<title>Title</title>

<style type="text/css">

body{
background:#AAAAAA;
font-family:arial;
}

#center{
margin:0 auto;
width:600px;
border:20px solid #CCCCCC;
background:#EEEEEE;
color:#838689;
padding:20px;
font-size:11px;
line-height:13px;
}

h1,h2,h3,h4{
color:#AAAAAA;
}

h1{
font-size:20px;
line-height:30px;
letter-spacing:4px;
}


h2{
font-size:15px;
line-height:25px;
letter-spacing:4px;
}


h3{
font-size:12px;
line-height:22px;
letter-spacing:4px;
}


.c{
margin:0 auto;
width:600px;
text-align:center;
text-transform:lowercase;
color:#BBBBBB;
font-size:9px;
padding:2px;
}

a{color:#000000;}
a:hover,.c:hover{color:#FFFFFF;}

</style>

</head>
<body>


<div id="center">

<h1>Header 1</h1>

<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin malesuada posuere est vel vehicula. Nunc elementum scelerisque fermentum. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque feugiat ante eu ipsum pulvinar vel tincidunt ligula interdum. Morbi sed sem eget sapien porttitor pretium. Ut et metus eu eros vestibulum imperdiet. Quisque varius feugiat mi, rutrum facilisis nulla aliquet nec. Curabitur nulla risus, tincidunt vitae facilisis a, imperdiet accumsan magna. Nullam quis felis enim. Vestibulum sodales consequat elit, et sodales erat posuere in. Praesent vel diam nulla, at imperdiet diam. Maecenas est lorem, auctor a tristique ac, fringilla eu lorem. Nunc ut metus nunc. Proin suscipit sagittis mauris nec porta. Suspendisse lacinia placerat varius. Nullam sit amet odio quis mi semper rutrum. Pellentesque at ornare orci.
</p>

<h2>Header 2</h2>

<p>
Aenean magna est, ultrices eu dictum at, porttitor ut dolor. Phasellus feugiat tortor vel nisi ultricies at hendrerit nibh semper. Sed vel nibh a leo accumsan ultrices vitae id purus. Maecenas auctor elit vel ipsum dictum adipiscing. Fusce lorem erat, gravida non varius nec, facilisis quis risus. Nulla facilisis, sapien dapibus lacinia rhoncus, magna massa faucibus elit, at dictum eros nulla vitae odio. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Nulla sed felis purus. Nunc imperdiet, ipsum ac rutrum fermentum, augue orci adipiscing turpis, id lobortis purus nibh vitae elit. Mauris ante tortor, interdum eget ullamcorper quis, ultrices quis metus. Praesent tempor bibendum magna. Praesent malesuada euismod tempus. Quisque tellus odio, venenatis viverra aliquam ac, imperdiet a lacus. Etiam pretium, ante in ullamcorper consectetur, quam eros eleifend dui, in mollis mauris ligula id velit. Mauris eleifend feugiat mi vitae sodales.
</p>

<h3>Header 3</h3>

<p>
Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Cras aliquam dui ac dolor volutpat ultricies aliquet leo cursus. Duis porttitor varius nunc ut tempor. Vestibulum pellentesque egestas massa, sit amet venenatis eros hendrerit a. Phasellus enim ligula, luctus sit amet bibendum eu, gravida at neque. Mauris hendrerit venenatis nisi, in gravida lectus feugiat ac. Suspendisse lacinia auctor velit et imperdiet. Aliquam et neque non metus sagittis ultricies ut ac magna. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Ut dignissim pretium tincidunt. Donec ullamcorper elementum auctor. 
</p>
</div>
<div class="c"><a href="http://figmintdesigns.webs.com/">Design</a></div>

</body>
</HTML>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >

<title>Your Title Here</title>

<style type="text/css">
body{
font-family:verdana;
background-image:url('http://i107.photobucket.com/albums/m315/kubummer/figmint/img/right.png');
background-repeat:repeat-x;
}
#s{position:relative;margin:0px auto;width:800px;}
#b{
position:relative;
margin:0px auto;
width:800px;
min-height:500px;
overflow:auto;
top:0px;
left:0px;
background-image:url('http://i107.photobucket.com/albums/m315/kubummer/figmint/img/bottom.png');
background-repeat:repeat-y;
}

#left{
font-size:9px;
position:relative;
left:178px;
float:left;
top:-10px;
width:183px;
}

#right{
font-size:9.5px;
position:relative;
right:39px;
float:right;
top:-30px;
width:386px;
}
h1,h2,h3,h4,a.nav{
font-weight:normal;
letter-spacing:2px;
}
h1,a,u,blockquote{
color:#BA0610;}
h2,a:hover,b,i{
color:#007EFD;}

blockquote{
border:#007EFD solid 2px;
background:#FFF5B3;
padding:5px;
}

a.nav{
width:178px;
padding:2px;
display:block;
font-size:20px;
text-decoration:none;
text-align:center;
}
a:hover{
background:#EEEEEE;
}


</style>
</head>
<body>

<div id="b">
<img src="http://i107.photobucket.com/albums/m315/kubummer/figmint/img/top.png" alt="Its only superstition!">

<div id="left">

<h2>Welcome</h2>
Hello!  My name is Aiden and this is my humble website.  I work as a graphic designer based in Cincinnati OH (where all us folk are), and I'm currently taking commissions. 

<a href="x" class="nav">Homepage</a>
<a href="x" class="nav">Examples</a>
<a href="x" class="nav">Resources</a>
<a href="x" class="nav">Forum</a>

<P>To see what I can do, click <b>examples</b>.  I also offer free resources including photography, textures, brushes and a network of helpful links for aspiring designers.
<p>  If you're interested in my work and would like to hire me, click <u>forum</u> and we can talk.  Thanks for your time, and hopefully I'll be able to be at you're service! ;D



</div><div id="right">


<h1>Header 1</h1>

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed elementum metus et quam rhoncus molestie. Donec porttitor ullamcorper metus et euismod. Donec interdum sagittis urna, at commodo ipsum tincidunt et. Ut vitae orci quis nisl convallis sodales. Sed nec sagittis ante. Integer convallis sem elit, non dignissim orci. Curabitur ligula orci, blandit et suscipit a, tempus eu enim. Morbi suscipit pharetra fermentum. Nunc tempor, tellus id posuere porta, libero neque commodo enim, non iaculis tortor nunc eu erat. 

<h2>Header 2</h2>

Nulla facilisi. In lacinia eleifend magna eleifend vulputate. Ut aliquam suscipit tempus. Praesent quis sem diam. Sed lacinia erat vitae mi tristique egestas et a risus. Donec molestie luctus enim, eget sollicitudin elit fermentum in. Praesent hendrerit, purus ut fermentum volutpat, nisl justo viverra elit, nec interdum augue enim rhoncus arcu. Sed id tellus in lectus fermentum mollis quis eu leo. Sed pellentesque ullamcorper turpis, in sollicitudin tortor accumsan vitae. Phasellus tincidunt sagittis placerat.

<h3>Different Styles</h3>

Unordered List
<ul>
<li><b>Bold</b>
<li><u>underlined</u>
<li><i>Italic</i>
<li><a href="x">Link</a>
<li>Blockquote:

<blockquote>Put a quote here or use this special box for another kind of organization. :D</blockquote>


</ul>


Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Suspendisse dui ipsum, accumsan consectetur ornare non, consectetur ut nisi. Quisque gravida nisl sit amet dolor sollicitudin sed pellentesque neque accumsan. Donec sodales posuere quam vel bibendum. Duis ut nibh quis diam varius dapibus. Maecenas luctus placerat ultrices. Suspendisse eleifend iaculis semper. Nam facilisis nunc id justo volutpat cursus. Fusce nec nisl elit. Cras ac odio et lacus feugiat posuere id id mauris.

In in lorem magna. Suspendisse potenti. Cras dictum, sapien non ornare adipiscing, enim nisi faucibus enim, et interdum arcu elit accumsan felis. Donec sagittis dui a augue dignissim rutrum. In hac habitasse platea dictumst. Sed et dolor orci. Sed sagittis euismod scelerisque. Pellentesque feugiat nunc hendrerit felis bibendum vitae dapibus urna interdum. Vivamus congue augue a ipsum varius sagittis quis sed nibh. Quisque a est augue, et congue sem. Nunc scelerisque aliquam ipsum, dignissim eleifend mi euismod sit amet. Nam quis est quis enim sagittis tincidunt. Nam volutpat felis aliquam eros lacinia in volutpat erat gravida.


</div>
</div>
<div id="s"><img src="http://i107.photobucket.com/albums/m315/kubummer/figmint/img/shadow.png" alt="Your Conscience: Don't even try to remove the credit."></div>

</body>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >

<title>Your Site Title Here</title>

<style type="text/css">
body{
font-size:11px;font-family:garamond;color:#000;font-size:13px;
background-image:url(http://img703.imageshack.us/img703/7822/webbothalf.jpg);background-repeat:repeat-y;background-color:#1C1B13;}
#img{position:absolute;top:0px;left:0px;z-index:-1;}
#l{position:absolute;top:202px;width:127px;height:auto;left:26px;}
#m{position:absolute;top:203px;left:170px;width:538px;height:auto;}

h1,h2{
font-weight:normal;
text-transform:lowercase;
}
h1{
font-size:30px;
color:#A9B4B7;
border-bottom:5px solid #171E2D;
padding:2px;
line-height:20px;
}
h2{
font-size:25px;
color:#DCDCC8;
border-bottom:3px solid #666852;
background:#AEAE88;
padding:2px;
line-height:20px;
}
h1,a.nav{
background: #2D3940;
}
a.nav{
font-size:20px;
line-height:15px;
text-decoration:none;
display:block;
color:#A9B4B7;
border-bottom:5px solid #171E2D;
margin:0px;
padding:2px;
text-transform:lowercase;
}
a.nav:hover{
color:#DCDCC8;
border-bottom:5px solid #666852;
background:#AEAE88;
}

a,i{
color:#2D3940;
font-size:1.2em;
}
u,b{
color:#666852;
}
a:hover{
color:#171E2D;
}
blockquote{
background:#FFF;
border:2px solid #2D3940;
padding:4px;
font-family:garamond;
font-size:19px;
text-align:center;
font-style:italic;
opacity:0.7;filter:alpha(opacity=70);
}

</style>
</head><body>
<div id="img"><img src="http://img820.imageshack.us/img820/4484/webtophalf.jpg" alt="layout by frisby at figmint"></div>
<div id="l">


<p>
<a href="" class="nav">Home</a>
<a href="" class="nav">About Us</a>
<a href="" class="nav">Services</a>
<a href="" class="nav">Links</a>
<a href="http://figmint.zzl.org" class="nav">Credit</a>
</p>


Please leave credit for figmint somewhere.









</div><div id="m">





<h1>Welcome!</h1>


Welcome to the humble website of the Cookie Co.!  We sell thousands of different types of cookies from all around the globe, and thats not all!  We also <a href="xxx">remodel homes</a> to mimic the cozy sensation our mouthwatering delights instill in you, and everything is available at a <b>reasonable price</b>!



<h1>Newsflash 8/5/09</h1>

New pictures of our most resent remodeling job are available under services at the left.  Our "cookie-houses" are becoming more popular than ever before, and as <i>Dessertmonger</i> reports, "in this economy, <u>now</u> is the time to deck out your house in delectable treats."

<blockquote>
Now is the time to deck out your house in delectable treats!</blockquote>



</div>
</body>


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >

<title>Rainy days...</title>

<style type="text/css">

body{
background-color:#656D72;
background-image:url(http://img26.imageshack.us/img26/7179/webrainrep.png);
background-repeat:repeat-y;
}

#main{
position:absolute;top:0px;left:50px;width:800px;height:300px;
}
#textbody{
position:absolute;
top:305px;
left:55px;
width:780px;
height:auto;
overflow:auto;
font-family:georgia;
font-size:11px;
line-height:13px;
color:#656D72;
}
h1{
color:#FFFFFF;
font-family:georgia;
font-size:30px;
line-height:40px;
text-align:left;
padding-left:8px;
background: url(http://img842.imageshack.us/img842/1703/webrainheader.png);
text-transform:lowercase;
}
h1:first-letter{
font-style:italic;
}
p:before{
content:url(http://img856.imageshack.us/img856/7615/webspace.png);
}
hr{
content:url(http://img841.imageshack.us/img841/8895/webrainsmear.png);
border:none;
}

#navtop{
position:absolute;
top:250px;
left:50px;
height:50px;
width:800px;
text-align:center;
}

#navigation {
   list-style: none;
   margin: 0; padding: 0;
}
#navigation li {
   float: left;
}
#navigation li a {
   display: block;
   width: 160px;
   text-align: center;
   color: #FFFFFF;
   padding: 3px 0;
   font-family:georgia;
   font-weight:bold;
   text-decoration:none;
text-transform:lowercase;
font-size:30px;
}
#navigation li a:hover {
   font-style:italic;
}
a{
color:#A6ABAE;
text-decoration:none;
font-weight:bold;
}
a:hover{
font-style:italic;
text-transform:lowercase;
}



</style>
</head>
<body>
<div id="main"><img src="http://img585.imageshack.us/img585/6682/webrainheader.jpg" alt="layout by frisby at figmint"></div>
<div id="navtop">
<ul id="navigation">
<li><a href="#">Home</a>
<li><a href="#">Graphics</a>
<li><a href="#">Layouts</a>
<li><a href="#">Tutorials</a>
<li><a href="#">More</a>
</ul></div>
<div id="textbody">

<h1>Header 1</h1>
<p>Thanks for using a layout from Figmint!  Please do not remove the credit at the bottom, unless you replace it with an image link or put it elsewhere.  If you have any trouble using this layout, you can always contact Frisby at the site for help. Enjoy! 8D
 

<p>Text styles:
<ul>
<li><b>Bold</b>
<li><i>Italic</i>
<li><u>Underlined</u>
<li><a href="#">Link</a>
<li><s>Strike</s></ul>

 



 


<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec a turpis et felis accumsan aliquam. Aliquam a diam. Vivamus augue. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer sollicitudin. In in mi. Phasellus metus orci, vestibulum tristique, faucibus nec, malesuada in, quam. Suspendisse potenti. Integer rhoncus neque. Cras id neque. Donec commodo placerat turpis. In commodo velit sit amet sem. Proin eleifend odio a massa. Cras ac massa id diam porttitor blandit. Integer in quam. Mauris non sapien. In iaculis, mauris id sollicitudin sollicitudin, dui velit rutrum justo, ut fringilla nulla quam id mi. Nulla elementum scelerisque risus.
 <p>

Aliquam sodales nunc in orci. Integer libero. Donec nec diam. Curabitur vestibulum dui. Morbi lacus. Sed ut dui. Donec adipiscing risus a diam. Proin arcu nisl, feugiat ac, egestas non, sagittis in, tellus. Curabitur pulvinar tortor ut diam semper scelerisque. Ut felis. Suspendisse id quam id purus posuere eleifend. Donec est nunc, sollicitudin quis, mollis quis, ultrices sed, urna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pharetra, justo eu laoreet condimentum, tortor libero pulvinar eros, nec ultrices augue arcu a lorem.
 <p>

Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nulla id lorem ut lacus rhoncus auctor. Proin at sem. In luctus tincidunt diam. Aliquam erat volutpat. Nulla ut sapien sed nisl dapibus mollis. Proin diam. Aliquam erat volutpat. Maecenas interdum mauris gravida massa. Integer metus felis, convallis a, tempor vitae, iaculis nec, neque.
 

<hr>

<p>
In sit amet dui. Aenean in massa quis lacus molestie feugiat. Ut tincidunt vehicula sem. Aliquam sed sapien sit amet dolor adipiscing vestibulum. In et sem vel quam convallis fermentum. Ut pretium. Phasellus lacinia purus nec leo. Duis pulvinar aliquet odio. Mauris orci. Curabitur aliquet lacus non purus. Phasellus quis sem vel risus venenatis lacinia. Nullam sit amet nisl vitae risus pretium aliquam. Morbi lorem orci, dignissim fringilla, congue eu, semper sit amet, nulla. Nunc auctor lacus id turpis. Donec bibendum bibendum velit. Aenean dapibus, arcu et porta fermentum, neque nisi tempus sapien, in convallis enim nunc sit amet lorem.
 <p>

Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Duis dictum imperdiet massa. Nullam dictum, sem non suscipit varius, nibh nulla dapibus urna, ac vehicula justo ipsum eu felis. Etiam quam metus, cursus eu, blandit nec, commodo at, ligula. Quisque tempus nisi sit amet quam. Nulla sed sem. Etiam eget metus sed orci bibendum scelerisque. Curabitur massa. Aliquam commodo lorem. Nam luctus vulputate est. Nunc imperdiet sem non dui. Phasellus nibh est, accumsan vitae, molestie quis, vehicula in, elit. Maecenas sagittis mi vel sapien. Proin dui dolor, scelerisque sit amet, eleifend fringilla, auctor dictum, libero. Ut augue lorem, pulvinar a, sagittis nec, vulputate quis, tortor. Aliquam erat volutpat. In euismod, tortor vulputate imperdiet ultrices, sapien nulla mattis augue, quis varius nulla erat vitae orci. Aliquam erat volutpat. Pellentesque sagittis tincidunt libero. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
 <p>

Maecenas purus. Donec in lacus nec elit dignissim ultrices. Phasellus et neque. Vestibulum sollicitudin, eros eget facilisis aliquet, nulla purus consectetur diam, eu egestas orci nisl sed mauris. Nulla luctus. Donec eu magna sit amet nisl auctor vulputate. Vivamus augue sem, vulputate in, lobortis vitae, molestie sit amet, tellus. Maecenas et sem non purus porta laoreet. Curabitur porta dictum quam. In hac habitasse platea dictumst. Donec eu magna. Nam velit dolor, ultricies sed, lobortis vel, cursus ut, leo. Phasellus ornare convallis tellus. Integer quis lectus porttitor turpis egestas pellentesque.
 <p>

Quisque ut risus. Mauris massa. Nam et enim vitae augue hendrerit ullamcorper. Integer dignissim mi nec felis. Donec semper ipsum at nibh. Curabitur congue velit sit amet est. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Duis lacus lacus, mattis quis, aliquet a, hendrerit sit amet, velit. Praesent at metus. Sed tempor consequat lacus. Vestibulum pretium. In iaculis mollis tellus. Donec porttitor, ante et malesuada tempor, tellus quam rutrum nibh, at elementum eros est sed nunc. Cras lectus dui, placerat vitae, convallis in, mattis sed, felis. Curabitur vitae purus. Curabitur elementum sapien nec massa pretium tincidunt. Quisque augue. Nunc euismod ligula quis orci.
 <p>

Aenean orci ante, porttitor eu, euismod ullamcorper, elementum mollis, ipsum. Aenean tempor nunc at tortor rhoncus rutrum. Nullam arcu ante, fringilla semper, iaculis tincidunt, viverra ut, urna. Duis felis felis, congue nec, fringilla nec, condimentum id, nisi. Sed lobortis dui nec augue. Maecenas lectus nisl, porta at, aliquet eu, euismod at, lacus. Proin porttitor, sapien ac vestibulum volutpat, mi nisi convallis urna, laoreet laoreet libero purus at justo. Nunc malesuada est a lacus. Sed velit. Nulla at dolor porta justo suscipit bibendum. Aliquam non metus at nisi ultricies molestie. Aliquam pulvinar. Aenean non felis a ligula consequat porttitor. Integer eget velit id nulla consequat vulputate. Morbi ipsum justo, viverra at, fermentum a, ultrices tempor, libero. Sed eros. Sed et metus. Curabitur luctus quam sit amet libero. Mauris bibendum felis quis ante. Cras sed turpis sit amet elit posuere posuere.
 <p>

Sed tincidunt euismod ante. Vivamus a lectus ac nunc lobortis pellentesque. Maecenas in sapien at quam suscipit accumsan. Fusce augue. Aenean a justo sed diam mattis luctus. Pellentesque mollis nisi et leo. Quisque ante. Vestibulum iaculis est nec enim. Aenean tortor. Pellentesque leo.
 <p>

Sed ultrices ligula eu purus. Aenean ligula tortor, condimentum eu, scelerisque ut, tristique sit amet, dolor. Integer pellentesque. Maecenas rhoncus. Vivamus dictum augue ut risus. In purus diam, pellentesque ac, suscipit non, venenatis vel, neque. Nunc rutrum. Vestibulum gravida interdum nibh. Nullam ut tellus. Ut leo lectus, tincidunt eleifend, consequat convallis, posuere ac, quam. Duis eget nunc vitae enim tristique venenatis. Aliquam aliquet, dui vitae porta porta, lacus leo interdum diam, consectetur rutrum ligula nulla ut justo. Fusce laoreet augue nec justo.
 

<p><center><a href="http://figmint.zzl.org">Layout by Figmint</a></center> 
</div>
</body>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >

<title>Title Here</title>

<style type="text/css">

body{
background:#DEDEDE;
font-family:verdana,arial;
line-height:15px;
font-size:10px;
color:#DEDEDE;
}
b{
color:#BCBCBC;
letter-spacing:2px;
}
i{
letter-spacing:-1px;
color:#BCBCBC;
}
u{
text-decoration:none;
border-bottom:1px dotted #BCBCBC;
}
#image{
position:absolute;
top:0px;
left:0px;
}
#text{
position:absolute;
top:150px;
left:360px;
width:455px;
height:660px;
overflow:auto;
}
a{
background: #DEDEDE;
color:#AF2424;
letter-spacing:1px;
font-size:10px;
text-decoration:none;
}
a:hover{
background-color:#AF2424;
color:#DEDEDE;
}
#navshape{
position:absolute;
top:109px;
left:360px;
height:68px;
}
.nav li{
float: left;
}
.nav{
list-style:none;
margin: 0; padding: 0;
}
.nav li a {
   display: block;
   background: #DEDEDE;
   width: 113px;
   text-align:center;
   color:#AF2424;
font-size:20px;
line-height:25px;
font-family: century gothic, helvetica;
text-transform:lowercase;
letter-spacing:-2px;
}
.nav li a:hover {
   background-color:#AF2424;
color:#DEDEDE;
text-transform:lowercase;
}

h1{
color:#DEDEDE;
font-size:35px;
line-height:20px;
font-family: century gothic, helvetica;
text-transform:lowercase;
letter-spacing:-3px;
font-weight:100;
padding-left:3px;
padding-top:3px;
padding-bottom:3px;
}

h2{
text-align:right;
color:#BCBCBC;
font-size:35px;
line-height:20px;
font-family: century gothic, helvetica;
text-transform:lowercase;
letter-spacing:-3px;
font-weight:100;
margin-right:5px;
padding-top:3px;
padding-bottom:3px;
}

</style>
</head>
<body>
<div ID="image"><img src="http://img832.imageshack.us/img832/2291/webscribblepaint.gif" alt="Layout by figmint.zzl.org"></div>
<div ID="navshape">
<table><tr><td>
<ul class="nav">
<li><a href="#">Home</a>
<li><a href="#">Blog</a>
<li><a href="#">Services</a>
<li><a href="#">More</a>
</ul>
</td></tr></table>
</div>
<div ID="text">





<p>Thanks for using this layout made by figmint.  Feel free to change the navigation links and the title of the page. Enjoy! (:
<br><br>

<h1>Level 1 header</h1>
<p>
<b>Bold text</b>, <i>italic text</i>, <u>underlined text</u>.  And, of course, a <a href="#">link</a> to no where.
</P>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris tristique. Cras urna nulla, tincidunt ut, viverra dapibus, consectetur et, lacus. Integer vitae risus nec nunc faucibus tincidunt. Nulla nisi felis, bibendum ut, porta ac, hendrerit ut, quam. Phasellus rhoncus, metus ut adipiscing tincidunt, nulla lectus eleifend mauris, et imperdiet lacus magna sit amet metus. Aenean erat. Mauris gravida. Duis consequat, risus in convallis venenatis, sapien sem pharetra sapien, eget laoreet est est non lorem. In ultricies. Proin magna dolor, euismod a, varius in, semper et, ligula. Mauris eu justo. Donec justo ipsum, ultrices quis, placerat nec, auctor id, mi. Nunc aliquam est. Pellentesque ultrices molestie arcu. Duis ut est non nisl pretium ornare. Cras purus dui, tristique non, dictum placerat, rutrum et, metus. Morbi rhoncus erat. Morbi condimentum mauris a tortor.
</p>

<h2>Level 2 header</h2>


<p>
Donec egestas viverra odio. Pellentesque at quam at est feugiat accumsan. Quisque ultricies pulvinar lorem. Maecenas ac enim a leo ornare suscipit. Aliquam imperdiet. Nullam scelerisque velit at elit faucibus accumsan. Etiam nunc. Nullam sapien. Ut libero elit, porta nec, commodo sit amet, pellentesque ut, enim. Morbi a sem. Duis interdum venenatis neque. Etiam sapien diam, mollis vitae, iaculis nec, bibendum et, diam. In a arcu sed neque tempus commodo. Integer magna dui, commodo sed, laoreet ut, semper ac, lorem. In mattis dapibus elit. Nunc justo lacus, mollis id, convallis vel, convallis vel, leo. Nam fringilla sodales purus. Fusce luctus fringilla tortor.
</p><p>
Donec non metus a sapien dignissim sollicitudin. Curabitur vel erat. Morbi eget magna. Sed euismod pulvinar eros. Suspendisse viverra. Quisque in augue. Cras egestas pretium dui. Donec in quam sit amet justo dapibus dignissim. Aenean facilisis, dui ac commodo hendrerit, velit nunc fermentum turpis, ut iaculis felis dui sed est. Duis quis dolor. Nunc enim tellus, dictum mollis, aliquet vel, ornare vel, turpis. Nunc venenatis accumsan orci. Aenean ligula tortor, sollicitudin sit amet, faucibus ac, ultrices placerat, dui. Proin vitae erat rhoncus felis tempus hendrerit. Nunc sit amet lacus vel quam dictum consequat. Phasellus et odio. Donec aliquam, lacus pretium aliquam bibendum, sapien ligula sollicitudin massa, sit amet egestas tellus enim vel eros. Ut odio. Quisque tristique.
</p><p>
Ut elementum varius erat. In venenatis. Nunc sodales convallis nulla. Donec eleifend consequat neque. Fusce varius, magna a accumsan rhoncus, nibh augue aliquet est, ac sagittis ante leo ut tortor. Praesent lacinia. Vestibulum vitae diam. Donec sodales, sapien auctor posuere volutpat, eros neque consectetur erat, eget auctor neque libero in mauris. Nulla porta enim ut magna. Aliquam consectetur luctus eros. Mauris varius odio eu mauris. Fusce congue nulla sit amet leo. Integer ac velit vel risus convallis consectetur. Proin turpis dolor, imperdiet non, facilisis sed, consequat in, arcu. Cras elementum pretium lectus.
</p><p>
Praesent eget felis ac urna luctus commodo. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nulla a felis. Vestibulum felis sapien, scelerisque vel, porta sed, suscipit quis, lectus. Suspendisse potenti. Cras elit arcu, porttitor a, vestibulum nec, scelerisque in, elit. Quisque metus eros, mollis sed, faucibus nec, porttitor in, justo. Mauris vel augue sollicitudin massa mollis pellentesque. Aliquam id lorem. Donec eget dui.
</p>

</div>
</body>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >

<title>Title Here</title>

<style type="text/css">

body{
background:#7B7769;
font-family:verdana,arial;
line-height:15px;
font-size:10px;
color:#7B7769;
}
b{
color:#28261F;
letter-spacing:2px;
}
i{
letter-spacing:-1px;
color:#28261F;
}
u{
text-decoration:none;
border-bottom:1px dotted #7B7769;
}
#image{
position:absolute;
top:50px;
left:50px;
}
#text{
position:absolute;
top:180px;
left:680px;
width:480px;
height:420px;
overflow:auto;
}
a{
color:#C9C9B6;
letter-spacing:1px;
font-size:10px;
text-decoration:none;
background: #7B7769;
}
a:hover{
background-color:#C9C9B6;
color:#7B7769;
}
#navshape{
position:absolute;
top:109px;
left:681px;
width:250px;
height:68px;
}
.nav{
list-style:none;
margin: 0px; padding: 0px;
}
.nav li a {
   display: block;
   background: #7B7769;
   width: 125px;
   text-align:center;
   color:#C9C9B6;
   margin-bottom:4px;
font-size:20px;
line-height:25px;
font-family: century gothic, helvetica;
text-transform:lowercase;
letter-spacing:-2px;
}
.nav li a:hover {
   background-color:#C9C9B6;
color:#7B7769;
text-transform:lowercase;
}

h1{
background: #7B7769;
color:#C9C9B6;
font-size:35px;
line-height:20px;
font-family: century gothic, helvetica;
text-transform:lowercase;
letter-spacing:-3px;
font-weight:100;
padding-left:3px;
padding-top:3px;
padding-bottom:3px;
}

h2{
text-align:right;
background: #C9C9B6;
color:#7B7769;
font-size:35px;
line-height:20px;
font-family: century gothic, helvetica;
text-transform:lowercase;
letter-spacing:-3px;
font-weight:100;
padding-right:3px;
padding-top:3px;
padding-bottom:3px;
}

</style>
</head>
<body>
<div ID="image"><img src="http://img6.imageshack.us/img6/9192/webcoffee.gif" alt="Layout by Figmint"></div>
<div ID="navshape">
<table><tr><td>
<ul class="nav">
<li><a href="#">Home</a>
<li><a href="#">Blog</a>
</ul>
</td><td>
<ul class="nav">
<li><a href="#">Services</a>
<li><a href="#">More</a>
</ul>
</td></tr></table>
</div>
<div ID="text">





<p>Thanks for using this layout made by figmint.  Feel free to change the navigation links and the title of the page. Enjoy! (:
<br><br>

<h1>Level 1 header</h1>
<b>Bold text</b>, <i>italic text</i>, <u>underlined text</u>.  And, of course, a <a href="#">link</a> to no where.

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris tristique. Cras urna nulla, tincidunt ut, viverra dapibus, consectetur et, lacus. Integer vitae risus nec nunc faucibus tincidunt. Nulla nisi felis, bibendum ut, porta ac, hendrerit ut, quam. Phasellus rhoncus, metus ut adipiscing tincidunt, nulla lectus eleifend mauris, et imperdiet lacus magna sit amet metus. Aenean erat. Mauris gravida. Duis consequat, risus in convallis venenatis, sapien sem pharetra sapien, eget laoreet est est non lorem. In ultricies. Proin magna dolor, euismod a, varius in, semper et, ligula. Mauris eu justo. Donec justo ipsum, ultrices quis, placerat nec, auctor id, mi. Nunc aliquam est. Pellentesque ultrices molestie arcu. Duis ut est non nisl pretium ornare. Cras purus dui, tristique non, dictum placerat, rutrum et, metus. Morbi rhoncus erat. Morbi condimentum mauris a tortor.
</p>

<h2>Level 2 header</h2>


<p>
Donec egestas viverra odio. Pellentesque at quam at est feugiat accumsan. Quisque ultricies pulvinar lorem. Maecenas ac enim a leo ornare suscipit. Aliquam imperdiet. Nullam scelerisque velit at elit faucibus accumsan. Etiam nunc. Nullam sapien. Ut libero elit, porta nec, commodo sit amet, pellentesque ut, enim. Morbi a sem. Duis interdum venenatis neque. Etiam sapien diam, mollis vitae, iaculis nec, bibendum et, diam. In a arcu sed neque tempus commodo. Integer magna dui, commodo sed, laoreet ut, semper ac, lorem. In mattis dapibus elit. Nunc justo lacus, mollis id, convallis vel, convallis vel, leo. Nam fringilla sodales purus. Fusce luctus fringilla tortor.
</p><p>
Donec non metus a sapien dignissim sollicitudin. Curabitur vel erat. Morbi eget magna. Sed euismod pulvinar eros. Suspendisse viverra. Quisque in augue. Cras egestas pretium dui. Donec in quam sit amet justo dapibus dignissim. Aenean facilisis, dui ac commodo hendrerit, velit nunc fermentum turpis, ut iaculis felis dui sed est. Duis quis dolor. Nunc enim tellus, dictum mollis, aliquet vel, ornare vel, turpis. Nunc venenatis accumsan orci. Aenean ligula tortor, sollicitudin sit amet, faucibus ac, ultrices placerat, dui. Proin vitae erat rhoncus felis tempus hendrerit. Nunc sit amet lacus vel quam dictum consequat. Phasellus et odio. Donec aliquam, lacus pretium aliquam bibendum, sapien ligula sollicitudin massa, sit amet egestas tellus enim vel eros. Ut odio. Quisque tristique.
</p><p>
Ut elementum varius erat. In venenatis. Nunc sodales convallis nulla. Donec eleifend consequat neque. Fusce varius, magna a accumsan rhoncus, nibh augue aliquet est, ac sagittis ante leo ut tortor. Praesent lacinia. Vestibulum vitae diam. Donec sodales, sapien auctor posuere volutpat, eros neque consectetur erat, eget auctor neque libero in mauris. Nulla porta enim ut magna. Aliquam consectetur luctus eros. Mauris varius odio eu mauris. Fusce congue nulla sit amet leo. Integer ac velit vel risus convallis consectetur. Proin turpis dolor, imperdiet non, facilisis sed, consequat in, arcu. Cras elementum pretium lectus.
</p><p>
Praesent eget felis ac urna luctus commodo. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nulla a felis. Vestibulum felis sapien, scelerisque vel, porta sed, suscipit quis, lectus. Suspendisse potenti. Cras elit arcu, porttitor a, vestibulum nec, scelerisque in, elit. Quisque metus eros, mollis sed, faucibus nec, porttitor in, justo. Mauris vel augue sollicitudin massa mollis pellentesque. Aliquam id lorem. Donec eget dui.
</p>
</div>


</div>
</body>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >

<title>Welcome to Mysite!</title>

<style type="text/css">

body{
	
	background: #99A7B5;
	font-family: trebuchet ms;
}

#page{
	border-left: 50px solid #611201;
	outline:  30px solid #961F04;
	position: absolute;
	top: 0px;
	left: 40px;
	height: 100%;
	width: 500px;
	background: #FFFFFF;
	color: #000000;
	font-size:12px;
	text-align: left;
}

#cont{
	padding: 5px;
}

#horizontal{
	height: 25px;
	background: #611201;
}

li.h{
	list-style: none;
	display:inline;
	float:left;
	margin: 5px;
	position:relative;
	z-index: 9000;
}

a.hl{
	text-decoration: none;
	color: #FFFFFF;
	text-transform:uppercase;
	letter-spacing: -1px;
	font-size: 12px;
	padding: 4px;
}

ul.dd{
	
	display: none;
	position:absolute;
	top: 13px;
	width: 100px;
	background: #961F04;
	border:#611201 2px solid;
	color: #FFFFFF;
	font-size: 11px;
	list-style: none;
	text-align: left;
	padding:4px;margin: 5px;
	text-transform:lowercase;
}

li ul.dd{
	z-index: 5;
}

li:hover ul.dd{
	
	display: block;
}

ul.dd li a{
	color: #EEEEEE;
	text-decoration: none;	
}

ul.dd li:hover{
	background: #611201;
}

h1{
	background: #961F04;
	font-size: 18px;
	line-height:25px;
	padding: 5px;
}

h2{
background: #611201;
font-size: 15px;
line-height:20px;
padding: 3px;
}

h3{
	background: #99A7B5;
	font-size: 13px;
	line-height: 15px;
	padding: 2px;
}
h1, h2, h3{
	color: #FFFFFF;
	text-transform:uppercase;
	letter-spacing: -1px;
	word-spacing: 5px;
	font-weight:normal;
}

h1 a{
	color: #FFFFFF;
	text-decoration: none;
}

h1 a:hover{
	text-decoration: underline;
	color: #FFFFFF;
}

a{
	color: #961F04;
}

a:hover{
	color:#99A7B5;
}

p{
	text-indent: 30px;
}

blockquote{
	background: #961F04;
	border:#611201 2px solid;
	color: #FFFFFF;
	padding: 5px;
}
</style>

</head>
<body>

<div id="page">
<ul id="horizontal">
<li class="h"><a href="x" class="hl">Home</a>
</li>


<li class="h"><a href="x" class="hl">Portfolio</a>
<ul class="dd">
<li><a href="x">Art</a></li>
<li><a href="x">Writing</a></li>
<li><a href="x">Audio</a></li>
</ul>
</li>

<li class="h"><a href="x" class="hl">Blog</a>
<ul class="dd">
<li><a href="x">Today</a></li>
<li><a href="x">Archive</a></li>
<li><a href="x">Tags</a></li>
<li><a href="x">Search</a></li>
</ul>
</li>

<li class="h"><a href="x" class="hl">About</a>
<ul class="dd">
<li><a href="x">Contact Me</a></li>
<li><a href="x">History</a></li>
<li><a href="x">Biography</a></li>
<li><a href="x">Testimonials</a></li>
</ul>
</li>
</ul>

<div id="cont">



<h1>Header 1</h1>

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed elementum metus et quam rhoncus molestie. Donec porttitor ullamcorper metus et euismod. Donec interdum sagittis urna, at commodo ipsum tincidunt et. Ut vitae orci quis nisl convallis sodales. Sed nec sagittis ante. Integer convallis sem elit, non dignissim orci. Curabitur ligula orci, blandit et suscipit a, tempus eu enim. Morbi suscipit pharetra fermentum. Nunc tempor, tellus id posuere porta, libero neque commodo enim, non iaculis tortor nunc eu erat. </p>

<h2>Header 2</h2>

<p>Nulla facilisi. In lacinia eleifend magna eleifend vulputate. Ut aliquam suscipit tempus. Praesent quis sem diam. Sed lacinia erat vitae mi tristique egestas et a risus. Donec molestie luctus enim, eget sollicitudin elit fermentum in. Praesent hendrerit, purus ut fermentum volutpat, nisl justo viverra elit, nec interdum augue enim rhoncus arcu. Sed id tellus in lectus fermentum mollis quis eu leo. Sed pellentesque ullamcorper turpis, in sollicitudin tortor accumsan vitae. Phasellus tincidunt sagittis placerat.</p>

<h3>Different Styles</h3>

Unordered List
<ul>
<li><b>Bold</b>
<li><u>underlined</u>
<li><i>Italic</i>
<li><a href="x">Link</a>
<li>Blockquote:

<blockquote>Put a quote here or use this special box for another kind of organization. :D</blockquote>


</ul>


<p>Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Suspendisse dui ipsum, accumsan consectetur ornare non, consectetur ut nisi. Quisque gravida nisl sit amet dolor sollicitudin sed pellentesque neque accumsan. Donec sodales posuere quam vel bibendum. Duis ut nibh quis diam varius dapibus. Maecenas luctus placerat ultrices. Suspendisse eleifend iaculis semper. Nam facilisis nunc id justo volutpat cursus. Fusce nec nisl elit. Cras ac odio et lacus feugiat posuere id id mauris.</p>

<p>In in lorem magna. Suspendisse potenti. Cras dictum, sapien non ornare adipiscing, enim nisi faucibus enim, et interdum arcu elit accumsan felis. Donec sagittis dui a augue dignissim rutrum. In hac habitasse platea dictumst. Sed et dolor orci. Sed sagittis euismod scelerisque. Pellentesque feugiat nunc hendrerit felis bibendum vitae dapibus urna interdum. Vivamus congue augue a ipsum varius sagittis quis sed nibh. Quisque a est augue, et congue sem. Nunc scelerisque aliquam ipsum, dignissim eleifend mi euismod sit amet. Nam quis est quis enim sagittis tincidunt. Nam volutpat felis aliquam eros lacinia in volutpat erat gravida.</p>




</div>
</div>

</body>
</html>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<head>
<title>Your Title Here</title>

<style type="text/css">
body{
	background-color: #4F5041;
	background-image:url('http://i107.photobucket.com/albums/m315/kubummer/figmint/img/antiquerepeat.png');
	background-repeat:repeat-x;
}
a:hover,#thin,#thick{
	color: #2F3024;	
}


#thick{
	float: left;
	width: 400px;
}
.thickbox{
	border: 7px solid #DFE0B9;
	background-color: #D3D7AE;
}

#thin{
	float: left;
	width: 250px;
}
.thinbox{
	border: 7px solid #E9E9AE;
	background-color: #FFF9C4;
}

.thinbox,.thickbox{
	margin: 20px;
	padding: 5px;
	font: 11px/13px tahoma;
}

h1,h2,h3,.nav,a{
	
	text-transform: lowercase;
	font-family:Arial Rounded MT Bold;
	text-decoration: none;
}
h1{
	 font-size: 30px;
}
h2,.nav{
	font-size: 23px;
}
h3{
	font-size: 17px;
}

.nav{
	
	display: block;
	text-align: center;
	font-family:Arial Rounded MT Bold;
	text-decoration: none;
	color: #2F3024;
	margin: 10px;
}
a.nav:hover, a{
	color: #4F5041;
}
blockquote{
	border-top: 2px solid #E9E9AE;
	padding: 4px;
	background: #FFF9C4;
}
</style>
</head>
<body>
<div id="thick">

<div class="thickbox">
<h1>Header 1</h1>

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed elementum metus et quam rhoncus molestie. Donec porttitor ullamcorper metus et euismod. Donec interdum sagittis urna, at commodo ipsum tincidunt et. Ut vitae orci quis nisl convallis sodales. Sed nec sagittis ante.
<br> Integer convallis sem elit, non dignissim orci. Curabitur ligula orci, blandit et suscipit a, tempus eu enim. Morbi suscipit pharetra fermentum. Nunc tempor, tellus id posuere porta, libero neque commodo enim, non iaculis tortor nunc eu erat.
</div>

 
<div class="thickbox">

<h2>Header 2</h2>

Nulla facilisi. In lacinia eleifend magna eleifend vulputate. Ut aliquam suscipit tempus. Praesent quis sem diam. Sed lacinia erat vitae mi tristique egestas et a risus. Donec molestie luctus enim, eget sollicitudin elit fermentum in. Praesent hendrerit, purus ut fermentum volutpat, nisl justo viverra elit, nec interdum augue enim rhoncus arcu. Sed id tellus in lectus fermentum mollis quis eu leo. Sed pellentesque ullamcorper turpis, in sollicitudin tortor accumsan vitae. Phasellus tincidunt sagittis placerat.

<h3>Different Styles</h3>

Unordered List
<ul>
<li><b>Bold</b></li>
<li><u>underlined</u></li>
<li><i>Italic</i></li>
<li><a href="x">Link</a></li>
<li>Blockquote:

<blockquote>Put a quote here or use this special box for another kind of organization. :D</blockquote></li>


</ul>
</div>

</div>
<div id="thin">

<div class="thinbox">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed elementum metus et quam rhoncus molestie. Donec porttitor ullamcorper metus et euismod.
</div>

<div class="thinbox">
<a href="x" class="nav">Homepage</a>
<a href="x" class="nav">Examples</a>
<a href="x" class="nav">Resources</a>
<a href="x" class="nav">Forum</a>

</div>
<div class="thinbox">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed elementum metus et quam rhoncus molestie. Donec porttitor ullamcorper metus et euismod. Donec interdum sagittis urna, at commodo ipsum tincidunt et. Ut vitae orci quis nisl convallis sodales. Sed nec sagittis ante. Integer convallis sem elit, non dignissim orci. Curabitur ligula orci, blandit et suscipit a, tempus eu enim. Morbi suscipit pharetra fermentum. Nunc tempor, tellus id posuere porta, libero neque commodo enim, non iaculis tortor nunc eu erat.

<p>Layout by <a href="http://figmint.zzl.org">Frisby</a>.  Please respect Figmint's terms of use.</p>
</div>


</div>
</body>
</HTML>

Graphics Site Only

<style>
body{
background:url(http://i43.tinypic.com/r89zs4.jpg);
font-family:Lucida Sans Unicode, Trebuchet MS;
font-size:10px;
line-height:14px;
color:#000;
}

h1{
color:#FFF;
font-weight:normal;
font-size:25px;
line-height:30px;
font-family:cochin,garamond,georgia;
text-transform:lowercase;
background:url(http://i39.tinypic.com/f1lgtf.jpg);
border-right:20px solid #5A0803;
}

#image{
position:absolute;
top:0px;
left:0px;
}

#text{
position:absolute;
top:110px;
left:30px;
width:442px;
height:574px;
overflow:auto;
}

a:link,a:active,a:visited{
color:#FFB912;
text-transform:uppercase;
font-size:9px;
text-decoration:none;
}

a:hover{
text-transform:uppercase;
font-size:9px;
color:#EEFF18;
text-decoration:none;
}

u{
color:#FF6967;
}

b{
color:#2C00FD;
font-weight:normal;
text-transform:uppercase;
}

i{
color:#FF00C4;
}

</style>
<map name="red"> 
<area shape="rect" coords="99,6,183,39" href="index.html">
<area shape="rect" coords="196,6,282,46" href="sitely.html">
<area shape="rect" coords="291,7,421,44" href="graphics.html">
<area shape="rect" coords="432,8,519,41" href="more.html">
</map>

<div ID="image">
<img src="http://i40.tinypic.com/2le1oae.jpg" usemap="#red" border="0">
</div>
<div ID="text">

<a href="##">Link</a> <b>Bold</b> <i>italic</i> <u>underline</u> text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here 

<h1> Header</h1>
text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here text here filler text here 


<h1>layout credit</h1>
<center><a href="http://figmintdesigns.webs.com/"><img src="http://i107.photobucket.com/albums/m315/kubummer/figmintultrabutton.gif" border="0"></a></center>

</div>

Seasonal & Holiday

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >

<title>Title Here</title>

<style type="text/css">

body{
background:url(http://i39.tinypic.com/10dt7jl.jpg) repeat;
color:#000000;
font-size:10px;
font-family:verdana;
}

a:link,a:active,a:visited{
color:#AF5353;
font-family:georgia;
text-transform:uppercase;
text-decoration:none;
font-size:9px;
}

a:hover{
color:#AF5353;
font-family:georgia;
text-decoration:underline;
font-size:9px;
}

u{
color:#9F3939;
font-family:georgia;
}

b{
font-weight:normal;
text-transform:uppercase;
color:#9F3939;
font-family:georgia;
}

i{
color:#AF5353;
font-family:georgia;
}

#img{
position:absolute;
top:0px;
left:0px;
}


h1{
font-family:georgia;
color:#9F3939;
font-weight:normal;
text-transform:uppercase;
font-size:13px;
}


h2{
font-family:georgia;
color:#AF5353;
font-weight:normal;
text-transform:uppercase;
text-align:right;
font-size:13px;
}


#content{
position:absolute;
top:420px;
left:70px;
width:420px;
height:auto;
overflow:auto;
}


</style>

<div ID="img">
<img src="http://i39.tinypic.com/2drxf0x.jpg" alt="layout by frisby at figmint">
</div>
<div ID="content">

All your content goes here.  I don't use iframes, so I wasn't really able to get it working properly....

<p>

<h1>Header 1</h1>
<i>Italic</i>, <b>bold</b>, <u>underlined</u> and normal text, as well as <a href="#">a link</a> are all displayed here.  You can see the different headers here as well.

<h2>Header2</h2>
Enjoy using figmint's layouts!  Remember, you can always come back for more. ;D

<p>

Please don't remove the credit.  That is cruel and is frowned upon globally. D:
<p>

Anyhow...<b>Happy Valentine's Day!</b>


</div>


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >

<title>Title here</title>

<style type="text/css">

body{
background:url(http://i44.tinypic.com/jsoguc.jpg) repeat;
color:#000000;
font-size:10px;
font-family:verdana;
}

a:link,a:active,a:visited{
color:#6C0A0A;
font-family:georgia;
text-decoration:none;
letter-spacing:2px;
}

a:hover{
color:#FFF;
font-family:georgia;
text-decoration:underline;
letter-spacing:2px;
}

u{
color:#7F2929;
font-family:georgia;
}

b{
font-weight:normal;
text-transform:uppercase;
color:#6C0A0A;
font-family:georgia;
}

i{
color:#fff;
font-family:georgia;
}

#img{
position:absolute;
top:0px;
left:0px;
}


h1{
font-family:century gothic, georgia;
color:#FFFFFF;
font-weight:normal;
text-transform:uppercase;
font-size:20px;
letter-spacing:-3px;
}


h2{
font-family:century gothic, georgia;
color:#6C0A0A;
font-weight:normal;
text-transform:uppercase;
text-align:left;
font-size:17px;
letter-spacing:-3px;
}


#content{
position:absolute;
top:420px;
left:70px;
width:445px;
height:auto;
overflow:auto;
}


</style>

<div ID="img">
<img src="http://i43.tinypic.com/iqim1z.jpg">
</div>
<div ID="content">

<p>

<h1>Header 1</h1>
<i>Italic</i>, <b>bold</b>, <u>underlined</u> and normal text, as well as <a href="#">a link</a> are all displayed here.  You can see the different headers here as well.  <i>Italic</i>, <b>bold</b>, <u>underlined</u> and normal text, as well as <a href="#">a link</a> are all displayed here.  You can see the different headers here as well  <i>Italic</i>, <b>bold</b>, <u>underlined</u> and normal text, as well as <a href="#">a link</a> are all displayed here.  You can see the different headers here as well.   <i>Italic</i>, <b>bold</b>, <u>underlined</u> and normal text, as well as <a href="#">a link</a> are all displayed here.  You can see the different headers here as well.

<h2>Header2</h2>
Enjoy using figmint's layouts!  Remember, you can always come back for more. ;D
  Enjoy using figmint's layouts!  Remember, you can always come back for more. ;D
 Enjoy using figmint's layouts!  Remember, you can always come back for more. ;D
Enjoy using figmint's layouts!  Remember, you can always come back for more. ;D  Please don't remove the credit.  That is cruel and is frowned upon globally. D:
Please don't remove the credit.  That is cruel and is frowned upon globally. D:


<p>

Please don't remove the credit.  That is cruel and is frowned upon globally. D:
<p>

Anyhow...<b>Happy Valentine's Day!</b>


</div>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >

<title>Your Site Title Here</title>

<style type="text/css">
#img{position:absolute;top:0px;left:0px;z-index:-1;}
#l{position:absolute;top:177px;width:188px;height:192px;left:7px;padding:2px;overflow:hidden;}
#m{position:absolute;top:177px;left:220px;width:473px;height:222px;padding:2px;overflow:auto;}
#w{position:absolute;top:105px;left:10px;width:690px;height:90px;overflow:hidden;font-family:Lucida Bright, georgia;font-size:67px;color:#9ED1EE;text-transform:lowercase;}
#b{position:absolute;top:415px;left:324px;width:369px;height:50px;overflow:hidden;}

body{color:#000;background-color:#31343B;}
body,table,td{font-family:lucida bright, georgia;font-size: 11px;}
a:link,a:active,a:visited{background:#9ED1EE;color:#31343B;text-decoration:none;}
a:hover{color:#9ED1EE;background:#31343B;}

h1{
color:#31343B;
font-family:lucida bright, georgia;
font-size:35px;
font-weight:normal;
text-transform:lowercase;
margin:10px 0px 10px 0px;
text-decoration:none;}

h2{font-family:helvetica neue;font-weight:100;color:#31343B;font-size:25px;}

h3{font-family: lucida bright, georgia;font-weight:normal;color:#9ED1EE;text-align:left;background:#CCE9FA;font-size:15px;}

h2,h3{text-transform:lowercase;margin:10px 0px 10px 0px;}

i{color:#9ED1EE;background:#31343B;letter-spacing:2px;}
u{color:#181E1D;}

blockquote {background:#CCE9FA; margin:10px 2px 10px 2px;padding:3px;border:2px dashed #31343B;text-align:center;}

a.nav{
color:#31343B;
background:#9ED1EE;
font-family:lucida bright, georgia;
font-size:25px;
font-weight:normal;
text-transform:lowercase;
padding:2px;
line-height:20px;
display:block;
width:120px;
text-decoration:none;
text-align:center;}

a.nav:hover{
color:#9ED1EE;
background:#31343B;}

</style>
</head><body><div id="w" name="Welcome Message">your title</div>
<div id="img"><img src="http://i107.photobucket.com/albums/m315/kubummer/figmint/img/winter.png" alt="layout by frisby at figmint"></div>
<div id="l" name="Left Column">

Welcome to my website!  Write a bit about it here, but not to much, or it'll get cut off at the bottom.
<p>
<center>
<a href="" class="nav">Home</a>
<a href="" class="nav">About Us</a>
<a href="" class="nav">Services</a>
<a href="" class="nav">Links</a>
<a href="http://figmint.zzl.org" class="nav">Credit</a>
</center>
</p>




</div><div id="m" name="Main Content">





<h1>Welcome!</h1>


Welcome to the humble website of the Cookie Co.!  We sell thousands of different types of cookies from all around the globe, and thats not all!  We also <a href="xxx">remodel homes</a> to mimic the cozy sensation our mouthwatering delights instill in you, and everything is available at a <b>reasonable price</b>!



<h2>Newsflash 8/5/09</h2>

New pictures of our most resent remodeling job are available under services at the left.  Our "cookie-houses" are becoming more popular than ever before, and as <i>Dessertmonger</i> reports, "in this economy, <u>now</u> is the time to deck out your house in delectable treats."


<h3>Newsflash 7/9/09</h3>

An example of overflow tidbits is below.  You could put your advertising, cbox, twitterage...All at the bottom! It works, and everything will look better.

<blockquote>
This is a blockquote.
</blockquote>

</div><div id="b" name="Bottom Link Space">
<center>
<a href="x"><img src="http://i107.photobucket.com/albums/m315/kubummer/figmint/img/sample.png"></a>
<a href="x"><img src="http://i107.photobucket.com/albums/m315/kubummer/figmint/img/sample.png"></a>
<a href="x"><img src="http://i107.photobucket.com/albums/m315/kubummer/figmint/img/sample.png"></a>
<a href="http://jigsaw.w3.org/css-validator/check/referer"><img src="http://jigsaw.w3.org/css-validator/images/vcss-blue"></a>
</center>
</div>

</body>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >

<title>Your Site Title Here</title>

<style type="text/css">
#hold{
padding-top:50px;
margin:0 auto;
width:616px;
height:auto;
}
#img{position:relative;top:0px;left:0px;z-index:-1;}
#overlay{position:relative;top:-466px;left:0px;z-index:2;}

#l{position:relative;top:-850px;width:188px;height:350px;left:32px;overflow:auto;z-index:3;overflow:auto;}

#m{position:relative;top:-1240px;left:240px;width:350px;height:373px;overflow:auto;padding-right:2px;z-index:3;}


body{color:#000;background-color:#530606;overflow:hidden;}
body,table,td{font-family:american typewriter, courier, tahoma,Trebuchet MS;font-size: 11px;}
a:link,a:active,a:visited{
color:#A00C0E}
a:hover{
color:#000;}

h1,h2,h3,a{
font-family:american typewriter, courier,tahoma;
font-weight:normal;
}
h1{
font-size:20px;
}
h2 {
font-size:15px;
}
h3 {
font-size:13px;
}

b{
font-family:american typewriter, courier,tahoma;
color:#A80D0F;
}
i{
color:#6F3512;
}
u{
color:#323232;
}

blockquote {
color:#6F3512;
border-top:1px dashed #6F3512;
border-bottom:1px dashed #6F3512;
padding:10px;margin:10px 2px 10px 2px;}


</style>
</head><body><div id="hold">
<div id="img"><img src="http://i107.photobucket.com/albums/m315/kubummer/figmint/img/bgg.png" alt="layout by frisby at figmint"></div>
<div id="overlay"><img src="http://i107.photobucket.com/albums/m315/kubummer/figmint/img/bloodol.png" alt="layout by frisby at figmint"></div>
<div id="l">


I am writing to you to inform you of a disconcerting incident that occurred last Friday in Winchestertown, at about eight o'clock in the evening...
<p>
Witnesses claimed large masses of partially decomposed people were migrating from the Willow Street Graveyard towards the North River.  They were described as unsettling and slightly unusual for the time of year.
<p>
The migration ended when one of the monsters toppled into the river, and the mindless others followed.  Remaining limbs and body parts were incinerated, and the graveyard fences were locked to prevent further corpse relocation.  No injuries were reported.

<center><a href="http://figmintdesigns.webs.com/">Layout by Figmint</a></center>
<center>Removing credit is stealing.  Don't you dare.</center>



</div><div id="m">




<h1>Header 1</h1>

Welcome to the humble website of the Cookie Co.!  We sell thousands of different types of cookies from all around the globe, and thats not all!  We also <a href="xxx">remodel homes</a> to mimic the cozy sensation our mouthwatering delights instill in you, and everything is available at a <b>reasonable price</b>!



<h2>Header 2</h2>

New pictures of our most resent remodeling job are available under services at the left.  Our "cookie-houses" are becoming more popular than ever before, and as <i>Dessertmonger</i> reports, "in this economy, <u>now</u> is the time to deck out your house in delectable treats."



<h2>Header 2</h2>

New pictures of our most resent remodeling job are available under services at the left.  Our "cookie-houses" are becoming more popular than ever before, and as <i>Dessertmonger</i> reports, "in this economy, <u>now</u> is the time to deck out your house in delectable treats."


<blockquote>
New pictures of our most resent remodeling job are available under services at the left.  Our "cookie-houses" are becoming more popular than ever before, and as <i>Dessertmonger</i> reports, "in this economy, <u>now</u> is the time to deck out your house in delectable treats."
</blockquote>

</div></div></body>

Music

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >

<title>Title Here</title>

<style type="text/css">

body{
background:#001F42;
font-family:verdana,arial;
line-height:15px;
font-size:10px;
color:#001F42;
}
b{
color:#1A1D32;
letter-spacing:2px;
}
i{
letter-spacing:-1px;
color:#29333A;
}
u{
text-decoration:none;
border-bottom:1px dotted #001F42;
}
#image{
position:absolute;
top:50px;
left:50px;
}
#text{
position:absolute;
top:180px;
left:680px;
width:480px;
height:420px;
overflow:auto;
}
a{
color:#1A1D32;
letter-spacing:1px;
font-size:10px;
text-decoration:none;
background:#B9CAD3;
}
a:hover{
text-transform:uppercase;
font-size:8px;
}
#navshape{
position:absolute;
top:109px;
left:681px;
width:250px;
height:68px;
}
.nav{
list-style:none;
margin: 0px; padding: 0px;
}
.nav li a {
   display: block;
   background: #001F42;
   width: 125px;
   text-align:center;
   color:#B9CAD3;
   margin-bottom:4px;
font-size:20px;
line-height:25px;
font-family:mistral;
text-transform:lowercase;
}
.nav li a:hover {
   background-color:#B9CAD3;
color:#001F42;
text-transform:lowercase;
}

h1{
background: #001F42;
color:#B9CAD3;
font-size:35px;
line-height:20px;
font-family:mistral;
font-weight:100;
padding-left:3px;
padding-top:3px;
padding-bottom:3px;
}

h2{
text-align:right;
background: #B9CAD3;
color:#001F42;
font-size:35px;
line-height:20px;
font-family:mistral;
font-weight:100;
padding-right:3px;
padding-top:3px;
padding-bottom:3px;
}

</style>
</head>
<body>
<div ID="image"><img src="http://img837.imageshack.us/img837/5833/webdream.png" alt="Layout by figmint.zzl.org"></div>
<div ID="navshape">
<table><tr><td>
<ul class="nav">
<li><a href="#">Home</a>
<li><a href="#">Blog</a>
</ul>
</td><td>
<ul class="nav">
<li><a href="#">Services</a>
<li><a href="#">More</a>
</ul>
</td></tr></table>
</div>
<div ID="text">





<p>Thanks for using this layout made by figmint.  Feel free to change the navigation links and the title of the page. Enjoy! (:
<br><br>

<h1>Level 1 header</h1>
<b>Bold text</b>, <i>italic text</i>, <u>underlined text</u>.  And, of course, a <a href="#">link</a> to no where.

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris tristique. Cras urna nulla, tincidunt ut, viverra dapibus, consectetur et, lacus. Integer vitae risus nec nunc faucibus tincidunt. Nulla nisi felis, bibendum ut, porta ac, hendrerit ut, quam. Phasellus rhoncus, metus ut adipiscing tincidunt, nulla lectus eleifend mauris, et imperdiet lacus magna sit amet metus. Aenean erat. Mauris gravida. Duis consequat, risus in convallis venenatis, sapien sem pharetra sapien, eget laoreet est est non lorem. In ultricies. Proin magna dolor, euismod a, varius in, semper et, ligula. Mauris eu justo. Donec justo ipsum, ultrices quis, placerat nec, auctor id, mi. Nunc aliquam est. Pellentesque ultrices molestie arcu. Duis ut est non nisl pretium ornare. Cras purus dui, tristique non, dictum placerat, rutrum et, metus. Morbi rhoncus erat. Morbi condimentum mauris a tortor.
</p>

<h2>Level 2 header</h2>


<p>
Donec egestas viverra odio. Pellentesque at quam at est feugiat accumsan. Quisque ultricies pulvinar lorem. Maecenas ac enim a leo ornare suscipit. Aliquam imperdiet. Nullam scelerisque velit at elit faucibus accumsan. Etiam nunc. Nullam sapien. Ut libero elit, porta nec, commodo sit amet, pellentesque ut, enim. Morbi a sem. Duis interdum venenatis neque. Etiam sapien diam, mollis vitae, iaculis nec, bibendum et, diam. In a arcu sed neque tempus commodo. Integer magna dui, commodo sed, laoreet ut, semper ac, lorem. In mattis dapibus elit. Nunc justo lacus, mollis id, convallis vel, convallis vel, leo. Nam fringilla sodales purus. Fusce luctus fringilla tortor.
</p><p>
Donec non metus a sapien dignissim sollicitudin. Curabitur vel erat. Morbi eget magna. Sed euismod pulvinar eros. Suspendisse viverra. Quisque in augue. Cras egestas pretium dui. Donec in quam sit amet justo dapibus dignissim. Aenean facilisis, dui ac commodo hendrerit, velit nunc fermentum turpis, ut iaculis felis dui sed est. Duis quis dolor. Nunc enim tellus, dictum mollis, aliquet vel, ornare vel, turpis. Nunc venenatis accumsan orci. Aenean ligula tortor, sollicitudin sit amet, faucibus ac, ultrices placerat, dui. Proin vitae erat rhoncus felis tempus hendrerit. Nunc sit amet lacus vel quam dictum consequat. Phasellus et odio. Donec aliquam, lacus pretium aliquam bibendum, sapien ligula sollicitudin massa, sit amet egestas tellus enim vel eros. Ut odio. Quisque tristique.
</p><p>
Ut elementum varius erat. In venenatis. Nunc sodales convallis nulla. Donec eleifend consequat neque. Fusce varius, magna a accumsan rhoncus, nibh augue aliquet est, ac sagittis ante leo ut tortor. Praesent lacinia. Vestibulum vitae diam. Donec sodales, sapien auctor posuere volutpat, eros neque consectetur erat, eget auctor neque libero in mauris. Nulla porta enim ut magna. Aliquam consectetur luctus eros. Mauris varius odio eu mauris. Fusce congue nulla sit amet leo. Integer ac velit vel risus convallis consectetur. Proin turpis dolor, imperdiet non, facilisis sed, consequat in, arcu. Cras elementum pretium lectus.
</p><p>
Praesent eget felis ac urna luctus commodo. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nulla a felis. Vestibulum felis sapien, scelerisque vel, porta sed, suscipit quis, lectus. Suspendisse potenti. Cras elit arcu, porttitor a, vestibulum nec, scelerisque in, elit. Quisque metus eros, mollis sed, faucibus nec, porttitor in, justo. Mauris vel augue sollicitudin massa mollis pellentesque. Aliquam id lorem. Donec eget dui.
</p>





</div>
</body>

Website Layouts

Set: Round Rects and Box Shadows

Set: 3 Part

Set: Fancy Backgrounds

Set: Simple and Clean

Set: Miniskins

Set: Distressed Vines

General Website Layouts

Graphics Site Only

Seasonal & Holiday

Music

Latest News:

ChatBox

Partners

Affiliates

Links

Change Skins