ondieting_blue
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!--
Created by: Reality Software | www.realitysoftware.ca
Released by: On Dieting | www.ondieting.co.uk
Note: This is a free template released under the Creative Commons Attribution 3.0 license,
which means you can use it in any way you want provided you keep links to authors intact.
Don't want our links in template? You can pay a link removal fee: www.realitysoftware.ca/templates/
You can also purchase a PSD-file for this template.
-->
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<style type='text/css'>
body {margin:0; background:url(ondieting_blue-images/body_bg.png) repeat-x #3885CC; font-family:Arial, Helvetica, sans-serif;}
#container {width:950px; margin:0 auto;}
#header {height:95px;}
#logo {float:left; padding:33px 0 0 45px; font-size:32px; font-family:"Comic Sans MS", cursive;}
#logo a {display:block; color:#FFFFFF; text-decoration:none;}
#slogan {float:right; padding:33px 45px 0 0; color:#FFFFFF; font-size:16px; text-align:center; font-family:"Comic Sans MS", cursive;}
#header_menu {text-align:center; color:#FFFFFF; font-size:14px; font-weight:bold; height:36px; background:url(ondieting_blue-images/header_bg.png) no-repeat; padding-top:31px;}
#header_menu a {color:#CC385E; text-decoration:none;}
#header_menu a:hover {color:#7F2138;}
#main {background:url(ondieting_blue-images/main_bg.png) repeat-y; font-size:13px; line-height:17px; color:#333333; float:left; width:100%;}
#main br {line-height:10px;}
#main a {color:#3885CC;}
#main a:hover {color:#21517F;}
#text {margin:30px 285px 30px 45px;}
#text h1 {font-size:28px; font-weight:normal; margin:24px 0 8px 0; color:#306DA8;}
#text h2 {font-size:24px; font-weight:normal; margin:24px 0 8px 0; color:#306DA8;}
#text ol, #text ul {padding:0; margin:10px 0;}
#text li {margin-left:40px;}
#sidebar {width:180px; float:right; margin:6px 45px 30px 30px; display:inline;}
#sidebar h3 {font-size:20px; font-weight:normal; margin:24px 0 8px 0; color:#306DA8;}
#sidebar ul {margin:0px; padding:0px;}
#sidebar li {list-style:none; padding:1px 0 1px 12px; background:url(ondieting_blue-images/li.png) 0px 8px no-repeat;}
#footer_menu {height:41px; background:url(ondieting_blue-images/footer_bg.png) no-repeat; clear:both; text-align:center; color:#FFFFFF; font-size:12px; padding-top:16px;}
#footer_menu a {color:#CC385E; text-decoration:none;}
#footer_menu a:hover {color:#7F2138;}
#footer {color:#D8E7F4; text-align:center; font-size:10px; margin:2px 0 15px 0;}
#footer a {color:#D8E7F4;}
#footer a:hover {color:#B0CEEA;}
</style>
</head>
<body>
<div id="container">
<!-- header -->
<div id="header">
<div id="logo"><a href="#">Website Name</a></div>
<div id="slogan">Your extremely cool & catchy slogan<br/>that will fascinate people.</div>
</div>
<div id="header_menu"><a href="#">Home</a> | <a href="#">About</a> | <a href="#">Products</a> | <a href="#">Services</a> | <a href="#">Contact</a></div>
<!--end header -->
<!-- main -->
<div id="main">
<div id="sidebar">
<h3>Vestibulum</h3>
Proin aliquet, sodales vel consequat eget, faucibus vitae lorem. Nunc rhoncus, dui quis pharetra tincidunt, magna augue <a href="#">faucibus elit</a>, sit amet gravida lacus turpis.
<h3>Suspendisse</h3>
<ul>
<li><a href="#">Vivamus pulvinar</a></li>
<li><a href="#">Pellentesque enim</a></li>
<li><a href="#">Donec tincidunt</a></li>
<li><a href="#">Quisque congue</a></li>
<li><a href="#">Cum sociis natoque</a></li>
</ul>
<h3>Proin Tempor</h3>
<ul>
<li><a href="#">Fusce ulamcorper</a></li>
<li><a href="#">Posuere porta</a></li>
<li><a href="#">Malesuada fames</a></li>
<li><a href="#">Faucibus ornare</a></li>
<li><a href="#">Condimentum null</a></li>
</ul>
</div>
<div id="text">
<h1>Welcome</h1>
<b>Ondieting Blue</b> is a free template created by <a href="http://www.realitysoftware.ca/">Reality Software</a> and released by <a href="http://www.ondieting.co.uk/">On Dieting</a> under the <a href="http://creativecommons.org/licenses/by/3.0/">Creative Commons Attribution 3.0</a> license, which means you can use it in any way you want provided you keep links to authors intact.<br/><br/>
Pellentesque tincidunt, tellus ac vehicula sodales, velit mi cursus nisl, a hendrerit justo purus quis odio. Curabitur eleifend blandit consequat. Quisque venenatis elementum ligula, nec molestie odio posuere at. Sed id metus eget mi porttitor pulvinar.
<h2>Lore Ipsum</h2>
Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Nulla lacus velit, adipiscing non elementum vel, facilisis in urna. Vestibulum elit tortor, fringilla eu molestie in, gravida tristique metus.
<ul>
<li>Aenean fringilla nisi a sem viverra ac cursus magna tempus.</li>
<li>Mauris egestas enim sed ligula iaculis sodales.</li>
<li>Cras condimentum nulla nec quam tempor vel volutpat lectus vulputate.</li>
</ul>
Donec nibh dolor, sodales vel consequat eget, faucibus vitae lorem. Nunc rhoncus, dui quis pharetra tincidunt, magna augue faucibus elit, sit amet <a href="#">gravida lacus</a> turpis quis ligula. Proin aliquet, sem at consequat auctor, nisl mauris euismod ante, a sollicitudin sapien odio et erat.
<h2>Dolor sit Amet</h2>
Aenean at dictum lacus. Nullam scelerisque adipiscing ligula a volutpat. Praesent pharetra elementum blandit. Vestibulum pharetra lectus id metus vehicula non ultricies lacus vestibulum.
<ol>
<li>Quisque lacinia sapien nec dui congue dignissim.</li>
<li>Nullam nec arcu sit amet orci vestibulum volutpat eu eget risus.</li>
<li>Vivamus rhoncus velit sit amet libero cursus consequat.</li>
</ol>
Pellentesque diam arcu, cursus eget tristique at, imperdiet sit amet metus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam elementum suscipit tempor. Aliquam vitae <a href="#">neque nibh</a>, in molestie nibh. Pellentesque ac risus tellus. Praesent enim purus, eleifend eu vehicula vel, adipiscing vitae dui.
</div>
</div>
<!-- end main -->
<!-- footer -->
<div id="footer_menu"><a href="#">Home</a> | <a href="#">About</a> | <a href="#">Products</a> | <a href="#">Services</a> | <a href="#">Terms</a> | <a href="#">Sitemap</a> | <a href="#">Contact</a></div>
<div id="footer">
Copyright 2009 Your Website.
<!-- Please do not change or delete this link. Read the license! Thanks. :-) -->
Design by <a href="http://www.ondieting.co.uk/">On Dieting</a>.
</div>
<!-- end footer -->
</div>
</body>
</html>
Related examples in the same category