small-corporation
<!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>Small Corporation</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<style type='text/css'>
/*
project: small corporation
author: luka cvrk (www.solucija.com)
*/
*{ margin: 0; padding: 0; }*
body {
font: .75em "Trebuchet MS", Tahoma, Verdana, Arial, Helvetica, sans-serif;
line-height: 1.6em;
background: #fff;
color: #444;
}
a { color: #E60000; background: inherit; text-decoration: none; }
a:hover { color: #AA0001; background: inherit; text-decoration: underline; }
p { margin: 0 0 15px 0; }
h1 { margin: 20px 0 0; }
h1 a { background: inherit; }
img { border: 0; }
h2 { font: normal 1.6em "Trebuchet MS", Arial, Sans-Serif; margin: 0 0 12px; }
h3 a { font-size: 1em; }
#main h3 a { font-size: .84em; color: #808080; font-weight: normal; text-transform: uppercase; }
#content { width: 940px; margin: 0 auto; padding: 20px 0 0 0; border-top: 5px solid #eee; }
#top{ float: right; text-align: right; }
#top a { color: #808080; margin: 0 0 0 13px; background: #fff url(small-corporation-images/toparrow.png) no-repeat center left; padding: 0 0 0 12px; }
input.searchfield { width: 175px; padding: 6px; border: 2px solid #ccc; font-size: .9em; }
input.searchbutton { background: #E60000; border: 0; padding: 6px; color: #fff; font-weight: bold; font-size: .9em; }
#logo { float: left; color: #808080; line-height: 25px; }
#menu { height: 35px; padding: 7px 0 0 0; clear: both; margin: 0 0 18px; background: #fff url(small-corporation-images/menubg.gif) repeat-x; }
#menu li { font-size: 1.1em; display: inline; text-transform: uppercase; }
#menu li a { margin: 0 25px 0 10px; color: #808080; }
#menu li a:hover { color: #444; }
#left { background: #eee; clear: left; float: left; width: 260px; padding: 10px 15px; margin: 0 0 20px; }
#left img { margin: 0 0 8px; }
#left li { list-style: none; }
#left li a { color: #787A8F; font-weight: bold; background: url(small-corporation-images/arrow.gif) no-repeat center left; padding: 0 0 0 12px; }
#main { float: left; width: 655px; margin: 0 0 20px; }
#main img { float: left; border: 3px solid #eee; padding: 1px; margin: 0 15px 5px 0; }
#line { clear: both; padding: 3px; margin: 0 0 15px; background: #fff url(small-corporation-images/smalldot.gif) repeat-x; }
#ad { float: right; text-align: center; padding: 33px 0 0; width: 250px; border: 3px solid #eee; color: #ccc; height: 50px; margin: 0 0 15px; }
#shortnews { float: right; width: 250px; }
.news { border-bottom: 1px solid #eee; padding: 0 0 2px; margin: 0 0 10px;}
#right { margin: 0 15px 20px 0; padding: 0 0 0 15px; float: right; width: 620px; text-align: justify; }
.border { clear: both; border-left: 4px solid #ccc; padding: 0 0 0 15px; }
#rl { float: left; width: 290px; margin: 0 20px 30px 0; }
#rr { float: right; width: 290px; }
#rl li, #rr li { list-style: none; border-bottom: 1px solid #eee; padding: 4px; margin: 0; }
#rl li a, #rr li a { background: #fff url(small-corporation-images/arrow.gif) no-repeat center left; padding: 0 0 0 12px; color: #808080; }
#footer { clear: both; padding: 10px; margin: 0 0 15px; font-size: .9em; color: #808080; background: #eee; }
.links a { font-weight: bold; color: #787A8F; background: #fff; margin: 0 10px 0 0; background: url(small-corporation-images/dot.png) no-repeat center left; padding: 0 0 0 10px; }
.sponsor { color: red; background: #eee; }
#footer li { list-style: none; }
#fl { width: 600px; }
#fr { float: right; }
</style>
</head>
<body>
<div id="content">
<div id="top">
<p><a href="http://www.free-css.com/">Home</a><a href="http://www.free-css.com/">About</a><a href="http://www.free-css.com/">Archive</a><a href="http://www.free-css.com/">Sitemap</a></p>
<form id="search_engine" method="post" action="http://www.free-css.com/" accept-charset="UTF-8">
<p>
<input class="searchfield" name="search_query" type="text" id="keywords" value="Search Keywords" onfocus="document.forms['search_engine'].keywords.value='';" onblur="if (document.forms['search_engine'].keywords.value == '') document.forms['search_engine'].keywords.value='Search Keywords';" />
<input class="searchbutton" name="submit" type="submit" value="Search" />
</p>
</form>
</div>
<div id="logo">
<h1><a href="http://www.free-css.com/">Small Corporation</a></h1>
<p>CORPORATION YOU CAN TRUST</p>
</div>
<ul id="menu">
<li><a class="current" href="http://www.free-css.com/">Home</a></li>
<li><a href="http://www.free-css.com/">Services</a></li>
<li><a href="http://www.free-css.com/">Products</a></li>
<li><a href="http://www.free-css.com/">Client Testimonials</a></li>
<li><a href="http://www.free-css.com/">Services</a></li>
<li><a href="http://www.free-css.com/">About Us</a></li>
<li><a href="http://www.free-css.com/">Contact Us</a></li>
<li><a href="http://www.free-css.com/">Help</a></li>
</ul>
<div id="main">
<h3><a href="http://www.free-css.com/">Praesent accumsan metus</a></h3>
<h2><a href="http://www.free-css.com/">Aliquam metus turpis, luctus ac, sagittis eget</a></h2>
<p><img src="small-corporation-images/car.jpg" alt="" />Suspendisse egestas fringilla odio. Donec lacinia tristique ante. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Etiam blandit ultricies nisl. Nullam dapibus, mauris id scelerisque feugiat, sapien augue porta ipsum, ut blandit tellus enim vel mauris. Praesent accumsan metus vel ipsum. Maecenas aliquam blandit mi. Pellentesque dolor magna, posuere vel, condimentum id, accumsan ac, diam. Phasellus vel leo. Aenean velit nisl, hendrerit eget, rutrum quis, lobortis nec, libero. Nulla venenatis, turpis eu vestibulum tincidunt, felis diam luctus velit, facilisis cursus mi ligula vitae nunc.</p>
</div>
<div id="ad">
<p>Advertising</p>
</div>
<div id="shortnews">
<div class="news">
<h3><a href="http://www.free-css.com/">Suspendisse odio orci</a></h3>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Ut pretium mauris nec arcu.</p>
</div>
<h3><a href="http://www.free-css.com/">Nam tortor libero, dictum porta</a></h3>
<p>Aliquam lacus massa, pellentesque sit amet, feugiat et, cursus volutpat, massa. Integer nibh. Maecenas mattis ipsum a felis.</p>
</div>
<div id="line"></div>
<div id="left">
<h3>Previous Articles</h3>
<ul>
<li><a href="http://www.free-css.com/">Lorem ipsum dolor sit amet, consectetuer</a></li>
<li><a href="http://www.free-css.com/">Lorem ipsum dolor sit amet, consectetuer</a></li>
<li><a href="http://www.free-css.com/">Lorem ipsum dolor sit amet, consectetuer</a></li>
<li><a href="http://www.free-css.com/">Lorem ipsum dolor sit amet, consectetuer</a></li>
<li><a href="http://www.free-css.com/">Lorem ipsum dolor sit amet, consectetuer</a></li>
<li><a href="http://www.free-css.com/">Lorem ipsum dolor sit amet, consectetuer</a></li>
<li><a href="http://www.free-css.com/">Lorem ipsum dolor sit amet, consectetuer</a></li>
<li><a href="http://www.free-css.com/">Lorem ipsum dolor sit amet, consectetuer</a></li>
<li><a href="http://www.free-css.com/">Lorem ipsum dolor sit amet, consectetuer</a></li>
<li><a href="http://www.free-css.com/">Lorem ipsum dolor sit amet, consectetuer</a></li>
<li><a href="http://www.free-css.com/">Lorem ipsum dolor sit amet, consectetuer</a></li>
</ul>
</div>
<div id="right">
<div id="rl">
<ul>
<li><a href="http://www.free-css.com/">Lorem ipsum dolor sit amet, consectetuer</a></li>
<li><a href="http://www.free-css.com/">Lorem ipsum dolor sit amet, consectetuer</a></li>
<li><a href="http://www.free-css.com/">Lorem ipsum dolor sit amet, consectetuer</a></li>
<li><a href="http://www.free-css.com/">Lorem ipsum dolor sit amet, consectetuer</a></li>
<li><a href="http://www.free-css.com/">Lorem ipsum dolor sit amet, consectetuer</a></li>
</ul>
</div>
<div id="rr">
<ul>
<li><a href="http://www.free-css.com/">Lorem ipsum dolor sit amet, consectetuer</a></li>
<li><a href="http://www.free-css.com/">Lorem ipsum dolor sit amet, consectetuer</a></li>
<li><a href="http://www.free-css.com/">Lorem ipsum dolor sit amet, consectetuer</a></li>
<li><a href="http://www.free-css.com/">Lorem ipsum dolor sit amet, consectetuer</a></li>
<li><a href="http://www.free-css.com/">Lorem ipsum dolor sit amet, consectetuer</a></li>
</ul>
</div>
<p class="border">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Ut pretium mauris nec arcu. Integer at leo vel ipsum elementum sodales. Nam est quam, posuere non, feugiat nec, consectetuer ac, lectus. Aenean faucibus. Suspendisse euismod, leo ut pretium ornare, libero arcu malesuada ipsum, at convallis pede augue at arcu. Aliquam lacus massa, pellentesque sit amet, feugiat et, cursus volutpat, massa.</p>
</div>
<div id="footer">
<ul id="fr" class="links">
<li><a href="http://www.free-css.com/">RSS Articles</a></li>
<li><a href="http://www.free-css.com/">RSS Pages</a></li>
<li><a href="http://www.free-css.com/">RSS Comments</a></li>
</ul>
<div id="fl">
<p class="links"><a href="http://www.free-css.com/">Home</a><a href="http://www.free-css.com/">About</a><a href="http://www.free-css.com/">Archive</a><a href="http://www.free-css.com/">Sitemap</a></p>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Ut pretium mauris nec arcu. Integer at leo vel ipsum elementum sodales. Nam est quam, posuere non, feugiat nec, consectetuer ac, lectus. Aenean faucibus</p>
<p>© Copyright <strong>Small Corporation</strong><br />
Design: <a href="http://www.solucija.com/">Luka Cvrk</a> · Sponsored by <a class="sponsor" href="http://webpoint.wordpress.com/">B4Contact</a> · Released under a <a target="_blank" href="http://creativecommons.org/licenses/by-nc-sa/3.0/">Creative Commons Licence</a></p>
</div>
</div>
</div>
</body>
</html>
Related examples in the same category