Savethetrees
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>title</title>
<style type='text/css'>
/* CSS RESET */
html{color:#000;background:#333333;}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym {border:0;font-variant:normal;}sup {vertical-align:text-top;}sub {vertical-align:text-bottom;}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;}legend{color:#000;}
body {font:13px/1.231 arial,helvetica,clean,sans-serif;}table{font-size:inherit;font-size:100%;}pre,code,kbd,samp,tt{font-family:monospace;line-height:100%;}
/* CSS RESET */
body {
text-align:center;
color:#FFFFFF
}
a {
text-decoration:none;
color:#acd600
}
a:hover {
text-decoration: underline;
}
#bg{background:url(Savethetrees-images/bg.jpg) 1px; width:800px;
margin:0 auto;
}
#wrap {
width:647px;
text-align:left;
margin:0 auto;
}
.fl{ float:left}
.fr{ float:right}
.clearfix{ clear:both}
/* header */
#header { height:120px ; background:url(Savethetrees-images/hd.jpg) no-repeat top}
#header h1 { font-size:36px; padding:10px 0 0 30px}
#nav { position:absolute; top:70px;width:647px; background:url(Savethetrees-images/nav.jpg); line-height:50px; }
#nav li {float:left; font-weight:700; }
#nav a {text-decoration:none; display:block; text-align:center; color:#acd600}
#nav a:hover {background: #DDED06 url(Savethetrees-images/hover.jpg); color:#000000 }
li.h {width:107px}
li.a {width: 128px; padding-left: 2px;}
li.p {width: 129px; padding-left: 2px; }
li.c {width:128px; padding-left: 2px;}
li.d {width:144px; padding-left: 2px;}
/* content */
#content,#footer { margin:0 20px}
#content h2{font-size:24px; margin:15px 0}
#content p{margin:10px 0}
/* footer */
#footer { border-top:#FFFFFF 1px solid; padding:15px 0 }
</style>
</head>
<body>
<div id="bg">
<div id="wrap">
<div id="header">
<h1>Savethetrees</h1>
<ul id="nav">
<li class="h"><a href="#">HOME</a></li>
<li class="a"><a href="#">ABOUT</a></li>
<li class="p"><a href="#">CONTACT</a></li>
<li class="c"><a href="#">STORE</a></li>
<li class="d"><a href="#">DONATE</a></li>
</ul>
</div>
<!-- /header -->
<div id="content">
<h2>Free CSS Templates</h2>
<p> Savethetrees is a CSS template that is free and fully standards compliant. <a href="http://www.free-css-templates.com/">Free CSS Templates</a> designed this template. </p>
<p> This template is allowed for all uses, including commercial use, as it is released under the Creative Commons Attributions 2.5 license. The only stipulation to the use of this free template is that the links appearing in the footer remain intact. Beyond that, simply enjoy and have fun with it!</p>
<p> Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse pretium commodo lorem. Cras gravida, mauris pellentesque aliquet posuere, sapien eros interdum orci, et sagittis sem dolor eu est. Curabitur et urna. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Mauris laoreet egestas tortor. Donec sit amet ante sit amet velit bibendum interdum. Curabitur vitae enim. Curabitur sapien. Nullam sit amet urna ac velit tincidunt dapibus. Maecenas iaculis, orci eu hendrerit vehicula, turpis nunc vestibulum velit, quis tristique pede mauris eu arcu. Morbi fringilla, orci malesuada lobortis sollicitudin, magna odio interdum sem, sit amet ultricies metus dolor non nunc. In odio tortor, suscipit sit amet, placerat vel, vulputate nec, turpis. Morbi dictum nibh in est. Proin luctus malesuada odio. Praesent ut ipsum a nibh lobortis semper. </p>
<p> Maecenas adipiscing. Quisque rhoncus malesuada erat. Mauris pellentesque suscipit leo. Maecenas eget risus. Vivamus ullamcorper dolor ac ipsum. Nulla rhoncus feugiat massa. Donec molestie dapibus enim. Nunc lobortis ipsum at sem. In hac habitasse platea dictumst. Vestibulum blandit quam in mi. Nulla sit amet urna ut tellus dignissim feugiat. In at leo quis tellus mollis viverra. Integer eleifend. Maecenas sed augue quis orci mollis molestie. Integer congue ipsum vel justo. Nullam sollicitudin diam non metus. Nam venenatis massa at orci. Quisque malesuada mauris quis massa. Ut id neque. </p>
<p> In eget nisl bibendum metus scelerisque tempor. Integer eget sem. Nam et orci. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Etiam ipsum ipsum, varius non, nonummy at, pulvinar eu, nunc. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Aenean consequat magna nec quam. Vivamus turpis est, ullamcorper vel, porttitor eget, pulvinar at, risus. Vestibulum vitae nunc vel libero bibendum imperdiet. Mauris bibendum blandit leo. Nulla aliquet. Ut id est sit amet erat volutpat malesuada. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec sed nisl a justo eleifend dictum. Suspendisse nec enim a eros consequat sodales. Suspendisse fermentum nisi ac elit. Quisque dapibus pede ut nisi. In id ipsum id purus tristique porta. Aliquam pede felis, ullamcorper non, commodo id, pellentesque sit amet, tortor. </p>
</div>
<!-- /content -->
<div id="footer">
<div id="ftinner">
<div class="ftlink ">
<p id="copyright"> 2008. All Rights Reserved. <br/>
<a href="http://www.templatesold.com/" target="_blank">Website Templates</a> by <a href="http://www.free-css-templates.com/" target="_blank">Free CSS Templates</a></p>
</div>
</div>
</div>
<!-- /footer -->
</div>
</div>
</body>
</html>
Related examples in the same category