greenway
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>GreenWay</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<style type='text/css'>
/*
StyleSheet by David Herreman
http://www.free-css-templates.com
*/
body {
padding : 0;
margin : 0;
font : 0.74em Arial, sans-serif;
line-height : 1.5em;
background : #fff url(greenway-images/bg.jpg) repeat-x top;
color : #454545;
}
a {
color : #7a9833;
background : inherit;
text-decoration : none;
}
a:hover {
color : #7a9833;
background : inherit;
text-decoration : underline;
}
p {
margin : 5px 0;
}
h1 {
font : bold 1.8em Arial, Sans-Serif;
padding : 8px 0 4px 0;
margin : 0;
letter-spacing : -1px;
}
h2 {
font : bold 1.6em Arial, Sans-Serif;
letter-spacing : -1px;
}
h3 {
padding : 4px 0;
margin : 0;
}
ul {
margin : 0;
padding : 0;
list-style : none;
}
img {
border : 0;
}
hr {
height : 1px;
border-style : none;
color : #d0d0d0;
background-color : #c0c0c0;
margin : 10px 0;
}
.content {
margin : 0 auto;
width : 900px;
}
#top {
padding-top : 0;
background : transparent;
height : 80px;
}
#top h1 {
font : bold 1.8em Arial, Sans-Serif;
padding : 20px 0 0 0;
margin : 0;
letter-spacing : 1px;
color : #616161;
}
#top h2 {
font : 0.9em Arial, Sans-Serif;
letter-spacing : 0;
color : #868686;
margin : 0;
padding : 0;
}
#top #icons {
float : right;
margin : 25px 15px 0;
padding : 0;
}
#top #icons img {
padding-right : 2px;
border : 0;
}
#menu {
margin : 0;
height : 34px;
padding-top : 0;
}
#menu li {
list-style : none;
display : inline;
line-height : 34px;
}
#menu li a {
text-decoration : none;
margin : 0;
padding : 9px 15px 10px 15px;
font-weight : bold;
color : #fff;
}
#menu li a:hover {
color : #fff;
background : #a7cc44;
margin : 0;
}
#menu li a.current {
background : #616161 url(greenway-images/trcorner.gif) no-repeat top right;
color : #fff;
}
#main {
width : 900px;
margin : 0;
padding : 0;
}
#right_side {
float : right;
width : 230px;
background : #ffffff url(greenway-images/topr.jpg) no-repeat top right;
overflow : hidden;
}
#right_side .pad {
padding : 35px 10px 10px 17px;
}
#right_side ul {
padding : 3px 0 8px 0;
}
#right_side li {
line-height : 18px;
background : #fff;
list-style : square;
padding-left : 0;
margin-left : 15px;
color : #b4e04a;
}
#right_side a {
background : inherit;
text-decoration : none;
}
#right_side h3 {
color : #949494;
font : bold 1.2em Arial, Sans-Serif;
margin-top : 10px;
}
#left_side {
background : inherit;
margin-bottom : 10px;
width : 650px;
}
#left_side .intro {
height : 80px;
background : #616161;
color : #fff;
overflow : hidden;
}
#left_side .intro .pad {
padding : 18px 0 0 0;
}
#left_side .intro a {
color : #b4e04a;
text-decoration : none;
}
#left_side .intro a:hover {
color : #cdff56;
text-decoration : underline;
}
#left_side .mpart {
padding : 40px 0 0 0;
}
#left_side h3 {
background : inherit;
padding : 0;
margin : 0;
font : bold 1.4em Arial, Sans-Serif;
}
#left_side .mpart h2 {
background : url(greenway-images/lrline.gif) no-repeat bottom left;
height : 20px;
padding : 0;
margin : 0 0 15px 0;
font : 0.9em verdana, Arial, Sans-Serif;
}
#left_side p {
color : #454545;
padding : 0;
text-align : justify;
}
#left_side img {
float : left;
padding : 0 10px 5px 0;
}
#left_side blockquote {
padding-left : 10px;
border-left : 3px solid #a7cc44;
margin : 10px 0 10px 25px;
}
.date {
border-top : 1px dotted #ccc;
padding : 5px 0;
margin : 10px 0 25px 0;
text-align : right;
}
#left_side .rs {
float : right;
margin : 0 10px;
border : 1px solid #ddd;
padding : 5px;
background : #f5f5f5;
}
#left_side ul {
list-style-position : inside;
margin-left : 2px;
}
#left_side ul li {
list-style-type : square;
margin-left : 15px;
}
#left_side ul ul li {
list-style : none;
margin-left : 10px;
list-style-type : lower-alpha;
list-style-position : inside;
}
#left_side .greybox {
border : 1px solid #ccc;
background : #f5f5f5;
width : 628px;
padding : 10px;
}
#footer {
clear : both;
width : 900px;
margin : 0 0 6em 0;
color : #777;
background : #fff url(greenway-images/rlline.gif) no-repeat top right;
}
#footer .right {
float : right;
text-align : right;
background : inherit;
padding-top : 10px;
width : 900px;
}
#footer a {
text-decoration : none;
background : #fff;
}
</style>
</head>
<body>
<div class="content">
<div id="top">
<div id="icons"> <a href="http://www.free-css.com/"><img src="greenway-images/home.gif" alt="Home" /></a> <a href="http://www.free-css.com/"><img src="greenway-images/contact.gif" alt="Contact" /></a> <a href="http://www.free-css.com/"><img src="greenway-images/sitemap.gif" alt="Sitemap" /></a> </div>
<h1>GreenWay</h1>
<h2>Your Best Slogan here</h2>
</div>
<div id="menu">
<ul>
<li><a class="current" href="http://www.free-css.com/">HOME</a></li>
<li><a href="http://www.free-css.com/">ARTICLES</a></li>
<li><a href="http://www.free-css.com/">GALLERY</a></li>
<li><a href="http://www.free-css.com/">AFFILIATES</a></li>
<li><a href="http://www.free-css.com/">ARTICLES</a></li>
<li><a href="http://www.free-css.com/">ABOUTS US</a></li>
<li><a href="http://www.free-css.com/">CONTACT</a></li>
</ul>
</div>
<div id="main">
<div id="right_side">
<div class="pad"> <img src="greenway-images/pic.jpg" alt="" />
<h3>Categories</h3>
<ul>
<li><a href="http://www.free-css.com/">Templates (15)</a></li>
<li><a href="http://www.free-css.com/">Internet (10)</a></li>
<li><a href="http://www.free-css.com/">Tutorials (23)</a></li>
<li><a href="http://www.free-css.com/">Photoshop (11)</a></li>
<li><a href="http://www.free-css.com/">sNews (16)</a></li>
<li><a href="http://www.free-css.com/">Personal (5)</a></li>
</ul>
<h3>Directory</h3>
<p>Links4se.com is a seo-friendly and human-edited general directory. Featured links need to be paid only $4.95 for unlimited time and regular links only $1.95!</p>
<h3>Creative News</h3>
<p><a href="http://www.free-css.com/">Creative News</a> is a place for web developers searching for fresh news on web development with one goal - to put their creativity into action.</p>
<h3>Css Heaven</h3>
<p><a href="http://www.free-css.com/">CSS Heaven</a> has one objective to provide you with a central resource to view a wide range of eye catching and innovative web design plus inspire you to create new and exciting web designs. </p>
</div>
</div>
<div id="left_side">
<div class="intro">
<div class="pad">sNews is a completly free PHP and MySQL driven content management system for managing web content. Consisting of only one file, sNews is extremely lightweight, easy to install, and easy to use via a simple web interface. <br />
<a href="http://www.free-css.com/">Download</a> | <a href="http://www.free-css.com/">Read more...</a> </div>
</div>
<div class="mpart">
<h3>Get. Watch. Do What You Want</h3>
<h2>Download this Design for Free!</h2>
<p> Phasellus quis est eget metus blandit lacinia. Quisque molestie, diam a dignissim mattis, lectus felis placerat lectus, eget sollicitudin neque nunc eleifend metus. <a href="http://www.free-css.com/">Curabitur ullamcorper</a> sem ac pede gravida sagittis. Sed et felis. Vestibulum placerat, ipsum nec congue auctor, ante massa placerat felis, sit amet <strong>consectetuer</strong> elit arcu vitae metus. In commodo, risus sed tristique luctus, ipsum diam dapibus eros, et vehicula dui augue tempus quam. In laoreet. Suspendisse et pede volutpat lacus interdum consequat. Cras dui. Quisque ac turpis nec ligula rutrum pulvinar. Quisque lectus ligula, vehicula nec, fringilla eu, dignissim ut, nisl. Vestibulum non turpis. Maecenas urna. </p>
<blockquote>
<p>Sed et felis. Vestibulum placerat, ipsum nec congue auctor, ante massa placerat felis, sit amet consectetuer elit arcu vitae metus. </p>
</blockquote>
<div class="date"><a href="http://www.free-css.com/">Comments (5)</a> . 05 Jan 2007 . 10:37</div>
<h3>It's all Inside</h3>
<h2>Expect Great Things</h2>
<div class="rs"> <strong>List example</strong>:
<ul>
<li>list line 1</li>
<li>list line 2
<ul>
<li>sublist line a</li>
<li>sublist line b</li>
</ul>
</li>
</ul>
</div>
<p> Sed odio tortor, rhoncus ac, auctor a, volutpat sed, diam. Quisque imperdiet. Maecenas quis nisl. Fusce sed nibh eget odio faucibus lobortis. Fusce sagittis est sed elit. Sed venenatis elit ut urna. Etiam varius imperdiet leo. Integer rhoncus venenatis arcu. Donec sollicitudin lectus. Cras ac est. Fusce odio. Donec posuere fermentum dolor. Sed a lacus tristique tellus ultrices mattis. Sed adipiscing urna a orci. Maecenas pharetra volutpat sem. </p>
<p> Vestibulum placerat, ipsum nec congue auctor, ante massa placerat felis, sit amet consectetuer elit arcu vitae metus. In commodo, risus sed tristique luctus, ipsum diam dapibus eros, et vehicula dui augue tempus quam. In laoreet. </p>
<div class="date"><a href="http://www.free-css.com/">Comments (11)</a> . 07 Jan 2007 . 02:56</div>
</div>
<div class="greybox"> Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Sed non risus. Suspendisse lectus tortor, dignissim sit amet, adipiscing nec, ultricies sed, dolor. Cras elementum ultrices diam. Maecenas ligula massa, varius a, semper congue, euismod non, mi. Duis semper. </div>
</div>
</div>
<div id="footer">
<div class="right">© Copyright 2006, Your Website - Design: <a href="http://www.free-css-templates.com">Free Css Templates</a><br />
<a href="http://www.free-css.com/">Home</a> - <a href="http://validator.w3.org/check?uri=referer" title="Validate">XHTML</a> - <a href="http://jigsaw.w3.org/css-validator/check/referer" title="Validate">CSS</a> </div>
</div>
</div>
</body>
</html>
Related examples in the same category