greenbusiness
<!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" xml:lang="en" lang="en">
<head>
<title>GreenBusiness</title>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-2" />
<style type='text/css'>
/*
Free Green-business design - CC2.5 license
http://www.free-css-templates.com
*/
* { padding:0; margin: 0 }
body {
background: #FFFFFF url(greenbusiness-images/topbg.jpg) repeat-x top;
font-family: Tahoma, Verdana, Arial, sans-serif;
font-size: 8pt;
color: #454545;
}
ul { padding-left: 30px; }
li { list-style-type: decimal; }
input, textarea { border: 1px solid #aaa }
input:hover, textarea:hover { border: 1px solid #888 }
img { border: 3px solid #e5e5e5; margin: 0 15px 5px 0; float: left; }
a { color: #2FB432; text-decoration: none; background: inherit }
a:hover { text-decoration: underline }
blockquote { margin: 0 0 15px 30px; border-left: 3px solid #8ADF88; padding: 0 0 0 8px }
input, textarea { border: 1px solid #aaa }
input:hover, textarea:hover { border: 1px solid #888 }
input.text { color: #000000; border: 1px solid #E6E6E6; background: inherit }
textarea.text { font-size: 8pt; border: 1px solid #E6E6E6 }
input.text:hover, textarea.text:hover { border: 1px solid #D6D6D6 }
form { display: inline; margin: 0; padding: 0 }
#content { padding: 0; margin: 0 auto; width: 765px; background: transparent }
#title { margin: 0; padding:0; height: 80px; width: 100%; background: transparent }
#title .green { color: #D9FFD8; line-height: 25px; background: inherit }
#title .pad { padding: 0px 0 }
#title h1 { font: bold 2.0em "Arial", Sans-Serif; margin: 0; letter-spacing: -1px; color: #fffffe; padding-top: 28px; background: inherit }
#title #slogan { font: 1.0em "Arial", Sans-Serif; margin: 0; color: #aaa; background: inherit}
#menu {
margin: 0px;
padding: 0px;
background: inherit;
line-height: 35px;
color: #81D7DF;
width: 100%;
height: 35px
}
#menu a, #menu a:visited { color: #81D7DF; text-decoration: none; background: inherit }
#menu .submit { float: right; vertical-align: bottom }
#menu .submit ul { margin:0; padding:0px 10px 0 50px; list-style:none }
#menu .submit li { display:inline; margin:0; padding:0 }
#menu .submit a { float:left; background: transparent url(greenbusiness-images/tableft.jpg) no-repeat left top; margin:0; padding:0 0 0 4px; text-decoration:none }
#menu .submit a span { float:left; background: inherit; display:block; background:url(greenbusiness-images/tabright.jpg) no-repeat right top; padding:0px 15px 0px 10px; margin-right: 2px; color:#FFF }
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#menu .submit a span {float:none;}
/* End IE5-Mac hack */
#menu .submit a:hover span { color:#fffffe; }
#menu .submit a:hover { background-position:0% -35px }
#menu .submit a:hover span { background-position:100% -35px }
#menu .submit a.selected { background-position:0% -35px }
#menu .submit a.selected span { background-position:100% -35px }
#subheader { width: 100%; margin:0; height: 87px }
#subheader .rside { float: right; width: 355px; height: 87px; background: transparent; margin-left: 20px }
#subheader .rside .padding { padding-top: 30px }
#subheader .rside input.text { background: transparent url(greenbusiness-images/input.gif) no-repeat; width: 290px; height: 27px; border:0; padding: 2px 0 0 5px }
#subheader .rside .btn1 { background: transparent url(greenbusiness-images/loupe.gif) no-repeat; width: 30px; height: 20px !important; height: 28px; border: 0; padding: 0; cursor: pointer }
#subheader .lside { background: inherit; color: #FFF; font-size: 120%; height: 87px}
#subheader .lside .padding { padding-top: 15px; font-family: Tahoma, Verdana, Arial, sans-serif }
#subheader .lside a, .lside a:hover { color: #FFF; text-decoration: underline; background: inherit }
#maincontent { width: 100%; background: transparent; padding-top: 15px }
#maincontent h2 { color: #3A3A3A; font-family: Tahoma, Verdana, Arial, sans-serif; font-size: 12px; text-decoration: none; line-height: 19px; margin: 0 0 5px 0; background: inherit }
#maincontent h2 a { color: #2FB432; font-family: Tahoma, Verdana, Arial, sans-serif; font-size: 12px; text-decoration: none; line-height: 19px; margin: 0 0 5px 0; background: inherit }
#maincontent h2 a:hover { color: #2FB432; text-decoration: underline; background: inherit }
#maincontent .underline { border-bottom: 1px dotted #aaa; margin-bottom: 10px }
#maincontent h3 { font-size: 130%; color: #6AA6AB; border-bottom: 1px dotted #aaa; background: inherit }
#maincontent p { padding: 0 0 20px 0; color: #454545; font: 1.0em "Arial", Sans-Serif; margin: 0; text-decoration: none; background: inherit }
#maincontent .mpnull { margin: 0; padding: 0 0 0 0; }
#maincontent .textbox { float: right; color: #454545; width: 40%; background: #fefefe; padding: 10px; margin: 5px 0 15px 15px; border: 1px solid #e8e8e8 }
#left_side { width: 545px; background: transparent; margin-bottom: 20px}
#right_side { width: 200px; background: transparent; float: right }
#right_side h3 {
height: 22px;
background: transparent url(greenbusiness-images/h3bg.gif) repeat-x;
color: #FFF;
border: 0;
font: bold 1.2em "Arial", Sans-Serif;
padding: 0px 0 0 5px;
line-height: 22px
}
#right_side .lcontent { background: #f8f8f8; border: 0px solid #e5e5e5; margin-bottom: 15px; color: #888 }
#right_side .lcontent p { padding: 8px; color: #777; background: inherit }
#right_side ul { padding-left: 10px; background: inherit; color: #454545 }
#right_side li { list-style: square }
#right_side img { border: 1px solid #B6D6BB }
#footer {
bottom:0;
clear:both;
text-align: left;
border-top: 1px solid #e5e5e5;
padding: 3px 0 0 0;
margin-top: 0px;
margin-bottom: 15px;
color: #888;
background: #FFF;
}
#footer .right { float: right }
</style>
</head>
<body>
<div id="content">
<div id="title">
<h1>Your <span class="green">Company</span></h1>
<span id="slogan">The Best Slogan here</span> </div>
<div id="menu">
<div class="submit">
<ul>
<li><a href="http://www.free-css.com/"><span>Home</span></a></li>
<li><a href="http://www.free-css.com/"><span>Products</span></a></li>
<li><a href="http://www.free-css.com/"><span>Affiliates</span></a></li>
<li><a href="http://www.free-css.com/" class="selected"><span>About us</span></a></li>
<li><a href="http://www.free-css.com/"><span>Contact</span></a></li>
</ul>
</div>
</div>
<div id="subheader">
<div class="rside">
<div class="padding">
<div id="search">
<form action="http://www.free-css.com/" method="get">
<p>
<input type="text" name="search" size="20" maxlength="250" class="text" value="" />
<input type="submit" value="" class="btn1" />
</p>
</form>
</div>
</div>
</div>
<div class="lside">
<div class="padding"> <strong>Lorem ipsum</strong> dolor sit amet, consectetuer adipiscing elit. Morbi elementum, ipsum nec auctor condimentum, magna odio aliquet elit, non bibendum lorem ligula at nisi. <a href="http://www.free-css.com/">Proin sapien</a>. </div>
</div>
</div>
<div id="maincontent">
<div id="right_side">
<h3>Latest news</h3>
<div class="lcontent">
<p><strong>Lorem ipsum</strong> dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Quis nostrud <a href="http://www.free-css.com/">exerci</a> tation ullamcorper suscipit. <br />
<a href="http://www.free-css.com/">Read more...</a></p>
</div>
<h3>Latest Products</h3>
<div class="lcontent">
<p><img src="greenbusiness-images/img2.gif" alt="" /> <strong>Lorem ipsum</strong> dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad <a href="http://www.free-css.com/">minim veniam</a>. </p>
<p><img src="greenbusiness-images/img2.gif" alt="" /> Quis nostrud exerci tation <strong>ullamcorper suscipit</strong> lobortis nisl ut aliquip ex ea commodo consequat. Dolor in hendrerit in <a href="http://www.free-css.com/">vulputate</a> velit esse molestie consequat.</p>
<p><img src="greenbusiness-images/img2.gif" alt="" /> <strong>Lorem ipsum</strong> dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad <a href="http://www.free-css.com/">minim veniam</a>. </p>
</div>
</div>
<div id="left_side">
<h2 class="underline">Abous us</h2>
<img src="greenbusiness-images/img.jpg" alt="image" />
<p><strong>Lorem ipsum dolor</strong> sit amet, consectetuer adipiscing elit. Morbi elementum, ipsum nec auctor condimentum, magna odio aliquet elit, non bibendum lorem ligula at nisi. Proin sapien. In hac <a href="http://www.free-css.com/">habitasse platea dictumst</a>. Nunc non magna. Duis pharetra laoreet dolor. Mauris tristique interdum turpis. Praesent sed pede. Aenean porttitor ultrices tortor. Aenean a purus. Praesent eu sapien.</p>
<p>Nulla posuere, sapien sit amet euismod suscipit, magna diam sodales magna, nec semper eros tortor et nulla. Nunc nec mauris. Aenean tincidunt. Nam sem. Etiam quis justo. Donec pellentesque pellentesque tellus. <strong>Integer bibendum</strong> massa sed diam. In in elit. Ut blandit arcu sed ligula. Aenean interdum. Suspendisse adipiscing suscipit nisl. In non leo et justo posuere placerat. In tincidunt cursus turpis. Maecenas suscipit tempor ante. Vestibulum pretium aliquam metus.</p>
<blockquote>
<p class="mpnull">Sapien sit amet euismod suscipit, magna diam sodales magna, nec semper eros tortor et nulla. Nunc nec mauris. Aenean tincidunt. Nam sem. Etiam quis justo. Donec pellentesque pellentesque tellus. <strong>Integer bibendum</strong> massa sed diam. In in elit.</p>
</blockquote>
<p>Nulla posuere, sapien sit amet euismod suscipit, magna diam sodales magna, nec semper eros tortor et nulla. Nunc nec mauris. Aenean tincidunt. Nam sem. Etiam quis justo. Donec pellentesque pellentesque tellus. <strong>Integer bibendum</strong> massa sed diam. </p>
<div class="textbox">
<h2><a href="http://www.free-css.com/">Register now!</a></h2>
<p>Nulla posuere, sapien sit amet euismod suscipit, magna diam sodales magna, nec semper eros tortor et nulla. Nunc nec mauris.</p>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Morbi <a href="http://www.free-css.com/">elementum</a>, ipsum nec auctor condimentum, magna odio aliquet elit, non bibendum lorem ligula at nisi. Proin sapien. In hac habitasse platea dictumst.</p>
</div>
<h2>Our Assets</h2>
<p>In hac habitasse platea dictumst. Nunc non magna. Duis pharetra laoreet dolor. Mauris tristique interdum turpis. Praesent sed pede. Aenean porttitor ultrices tortor. Aenean a purus. Praesent eu sapien.</p>
<p>In hac habitasse platea dictumst. Nunc non magna. Duis pharetra laoreet dolor.</p>
<ul>
<li>In hac <strong>habitasse</strong> platea dictumst</li>
<li>Lorem ipsum dolor <a href="http://www.free-css.com/">sit amet</a></li>
<li>habitasse platea dictumst</li>
<li>sapien sit amet euismod</li>
</ul>
</div>
</div>
<div id="footer">
<p class="right">Copyright © 2006 Your Company, Design: <a href="http://www.free-css-templates.com" title="Designed by free-css-templates.com">free-css-templates.com</a></p>
<p><a href="http://www.free-css.com/">Home</a> · <a href="http://www.free-css.com/">Contact</a> · <a href="http://www.free-css.com/">Accessibility</a> · <a href="http://www.free-css.com/">Products</a> · <a href="http://www.free-css.com/">Disclaimer</a> · <a href="http://jigsaw.w3.org/css-validator/check/referer">CSS</a> and <a href="http://validator.w3.org/check?uri=referer">XHTML</a><br />
</p>
</div>
</div>
</body>
</html>
Related examples in the same category