happy_template
<!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>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<meta name="description" content="Happy template" />
<meta name="keywords" content="happy, template" />
<meta name="author" content="John"/>
<style type='text/css'>
/*
project: happy template
author: luka cvrk (www.solucija.com)
*/
*{margin:0;padding:0;}:focus,:active {outline:0}ul,ol{list-style:none}h1,h2,h3,h4,h5,h6,pre,code {font-size:1em;}a img{border:0}
body { font: .9em Georgia, "Times New Roman", Arial, Sans-Serif; background: #E8F7FC url(happy_template-images/bg.jpg) repeat-x; color: #306172; }
a { color: #3A65A8; text-decoration: none; }
h1 { font-size: 2.9em; font-weight: normal; }
h2 { float: left; text-transform: lowercase; clear: both; font-size: 2.4em; margin: 0 0 20px; font-weight: normal; color: #CB6F9C; background: url(happy_template-images/h2bg.jpg) repeat-x bottom; }
p { clear: both; margin: 5px 0 15px; line-height: 1.7em; }
.clear { clear: both; }
.wrap { margin: 0 auto; width: 900px; }
#logo { float: left; margin: 40px 0 0; }
#menu { text-transform: lowercase; float: right; height: 120px; padding: 73px 0 0 98px; width: 475px; background: url(happy_template-images/white_bubbles.jpg) no-repeat top right; }
#menu li { display: inline; }
#menu li a { float: left; padding: 3px 6px; margin: 0 20px 0 0; font-weight: bold; color: #B25281; }
#menu li a:hover, #menu li a.current { background: #EDD3E0; }
#text { clear: both; margin: 0 0 40px; }
#green_bubble { padding: 30px 0 68px 280px; height: 30px; background: url(happy_template-images/green_bubbles.jpg) no-repeat center left; }
#green_bubble a { color: #34AE61; font-weight: bold; margin: 0 30px 0 0; }
#footer { padding: 85px 0 5px 0; background: #FF99CB url(happy_template-images/bottom.jpg) repeat-x; }
#copyright { float: left; margin: 80px 0 0; color: #9D436F; font-size: .8em; }
#copyright p { margin: 0 0 5px; }
#copyright a { color: #60183B; }
#bubble { float: right; font-size: .9em; font-weight: bold; color: #D46FA0; background: url(happy_template-images/pink_bubbles.jpg) no-repeat; width: 220px; height: 145px; padding: 52px 30px 0 150px; text-align: right; }
</style>
<title>Happy Template - Free Template by Solucija.com</title>
</head>
<body>
<div class="wrap">
<h1 id="logo"><a href="#">happy<br />template</a></h1>
<ul id="menu">
<li><a href="#">Home</a></li>
<li><a href="#">Photography</a></li>
<li><a href="#">Video</a></li>
<li><a href="#">Locations</a></li>
<li><a href="#">Contact</a></li>
</ul>
<div id="text">
<h2>Nam tortor libero dictum porta</h2>
<p>Maecenas erat. Suspendisse odio orci, <a href="#">convallis ac, volutpat non, volutpat et, lectus</a>. In cursus rhoncus ante. Quisque nibh lacus, pellentesque sed, porttitor a, luctus blandit, mi. Nam tortor libero, dictum porta, vulputate nec, imperdiet sed, mauris. Maecenas libero neque, volutpat sit amet, varius et, pretium quis, purus. Nulla ut magna. Nunc nec dui eget erat vulputate sagittis. <a href="#">Suspendisse fermentum</a> odio. Mauris magna sem, pellentesque sit amet, nonummy vel, nonummy id, velit. Mauris facilisis, quam ut semper adipiscing, magna diam laoreet ante, ac varius massa dolor sit amet augue. Vivamus purus. Integer consequat. Nunc et nunc. Phasellus augue diam, vestibulum non, iaculis eget, tristique sed, lectus. Sed pede. Nullam egestas ante a mauris. Aliquam metus turpis, luctus ac, sagittis eget, <a href="#">elementum tincidunt</a>, massa. Aenean justo nisl, luctus sit amet, malesuada ac, dignissim ac, eros.</p>
</div>
<div id="green_bubble">
<p><a href="http://www.declips.com" title="serving your daily dose of interesting and relevant videos from all major video sites">Latest Project</a><a href="http://www.solucija.com/commercial-templates" title="Professional CSS Templates">Showcase</a><a href="#">Philosophy</a><a href="#">Vision</a></p>
</div>
</div>
<div id="footer">
<div class="wrap">
<div id="bubble"><p>Suspendisse egestas fringilla odio. Donec lacinia tristique ante. Cum sociis.</p></div>
<div id="copyright">
<p>Released under a <a href="http://creativecommons.org/licenses/by-nc-sa/3.0/">Creative Commons Licence</a></p>
<p>Copyright © Happy Template − by <a title="Free CSS Templates" href="http://www.solucija.com/">Solucija</a> - downloaded from <a href="http://css4free.com/" title="Free CSS template gallery">CSS 4 Free</a></p>
</div>
<div class="clear"></div>
</div>
</div>
</body>
</html>
Related examples in the same category