conceptnova
<!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">
<head>
<title>Conceptnova</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<style type='text/css'>
/*
project: Conceptnova (free CSS template)
author: luka cvrk (www.solucija.com)
*/
*{ margin: 0; padding: 0; }*
body { background: #fff url(conceptnova-images/bodybg.gif) repeat-x; font: 74% Arial, Helvetica, Sans-Serif; color: #454545; line-height: 1.6em; }
a { text-decoration: none; color: #C40000; background: inherit; }
a:hover { color: #808080; background: inherit; }
a:focus { outline: 0; }
h1 { font-size: 2.8em; line-height: 35px; }
h2 { color: #000; font: bold 170% Arial, Sans-Serif; letter-spacing: -1px; padding: 0; margin: 0 0 10px; }
img { border: 0; }
.grey { color: #484848; }
#wrap { width: 900px; margin: 10px auto 0; }
#logo { float: left; width: 400px; margin: 0 0 7px; }
#header_top { background: url(conceptnova-images/top.gif) no-repeat top right; border-right: 2px solid #fff; color: #454545; padding: 10px 0 0 7px; clear: both; margin: 0 0 0px 0; height: 74px; }
#header_top p { padding: 0; margin: 0; }
#header_top ul { float: right; padding: 12px 160px 0 0; margin: 0 0 5px 0; }
#header_top ul li { list-style-type: none; display: inline; font-weight: bold; }
#header_top ul li a { padding-left: 7px; background: #FFF url(conceptnova-images/bullet.gif) no-repeat center left; margin-right: 5px; color: #C40000; }
#header_top ul li a:hover { padding-left: 7px; background: #FFF url(conceptnova-images/bullet.gif) no-repeat center left; margin-right: 5px; color: #808080; }
#header_bottom { background: #454545 url(conceptnova-images/bottom.gif) no-repeat top right; color: #EBEBEB; padding: 20px 240px 20px 10px; clear: both; border-left: 2px solid #fff; border-right: 2px solid #fff; margin: 0 0 1px 0; height: 90px; }
#header_bottom h2 { color: #F3F2BF; width: 250px; margin: 0 0 10px; background: #454545; }
#slogan { clear: left; width: 730px; border-top: 1px solid #eee; margin: 0; padding: 5px 0 0 0; }
#maincontent { padding: 20px 0; clear: both; background: url(conceptnova-images/bg.gif) repeat-x; }
#left { float: left; width: 630px; padding: 5px 15px 0 5px; margin: 0 0 25px 0; }
#left p { margin: 0 0 15px; }
#right { width: 220px; float: right; }
#info { border: 1px solid #ccc; padding: 7px; font-size: .9em; background: #f4f4f4; }
#searchform { background: url(conceptnova-images/searchform.gif) no-repeat; padding: 8px 4px 10px 4px; height: 27px; font: bold 0.9em Arial, Sans-Serif; margin: 0 0 20px; }
#searchform p { padding: 0; margin: 0; }
input.search { width: 127px; border: none; background: url(conceptnova-images/input.gif) no-repeat; padding: 7px; margin: 0 4px 0 5px; }
input.submit { width: 53px; height: 29px; border: none; background: #FFF url(conceptnova-images/submit.gif) no-repeat; font: bold 1.2em Arial, Sans-Serif; padding: 0px; color: #FFF; }
#footer { clear: both; padding: 10px; margin: 10px 0 0 0; border-top: 1px solid #ccc; line-height: 2em; }
</style>
</head>
<body>
<div id="wrap">
<div id="header_top">
<h1 id="logo"><a href="http://www.free-css.com/" title="Conceptnova">concept<span class="grey">nova</span></a></h1>
<ul>
<li><a 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/">portfolio</a></li>
<li><a href="http://www.free-css.com/">site map</a></li>
<li><a href="http://www.free-css.com/">contact</a></li>
</ul>
<div id="slogan">
<p>Helping you to bring your <b>concepts</b> and <b>ideas</b> to life.</p>
</div>
</div>
<div id="header_bottom">
<h2>Think outside of the box!</h2>
<p>Praesent accumsan metus vel ipsum. Nulla venenatis, turpis eu vestibulum tincidunt, felis diam luctus velit, facilisis cursus mi ligula vitae nunc. Curabitur libero. Fusce felis. Nam gravida nulla non eros. Donec non nisl. Nulla ut odio. Curabitur sollicitudin nonummy est. Nullam molestie lectus quis nibh.</p>
</div>
<div id="maincontent">
<div id="left">
<h2><a href="http://www.free-css.com/">Bring your concepts and ideas to life!</a></h2>
<p>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, <a href="http://www.free-css.com/">sapien augue porta ipsum</a>, 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, <a href="http://www.free-css.com/">rutrum quis</a>, lobortis nec, libero. Nulla venenatis, turpis eu vestibulum tincidunt, felis diam luctus velit, facilisis cursus mi ligula vitae nunc. Curabitur libero. Fusce felis. Nam gravida nulla non eros. Donec non nisl. Nulla ut odio. Curabitur sollicitudin nonummy est. Nullam molestie lectus quis nibh.</p>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla facilisi. Fusce condimentum varius metus. Mauris lacus. Vivamus egestas facilisis eros.</p>
</div>
<div id="right">
<div id="searchform">
<form method="post" action="http://www.free-css.com/">
<p>
<input type="text" name="search" class="search" value="Search Keywords" />
<input type="submit" value="GO" class="submit" />
</p>
</form>
</div>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla facilisi. Fusce condimentum varius metus. Mauris lacus. Vivamus egestas facilisis eros.</p>
<br />
<p id="info">If you liked this template, you might like some other Free or Commercial CSS templates from Solucija!</p>
</div>
</div>
<div id="footer">
<p>Design: <a href="http://www.solucija.com/">Luka Cvrk</a> · Sponsored by <a href="http://webpoint.wordpress.com/">B4Contact</a> · Released under a <a href="http://creativecommons.org/licenses/by-nc-sa/3.0/">Creative Commons Licence</a></p>
<p>© Copyright 2008 <a href="http://www.free-css.com/">Conceptnova</a></p>
</div>
</div>
</body>
</html>
Related examples in the same category