onteethwhitening_olive : White « Templates « HTML / CSS



<!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 Teeth Whitening | www.onteethwhitening.com
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">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type='text/css'>
body {margin:0; background:url(onteethwhitening_olive-images/body_bg.png); font-family:Arial, Helvetica, sans-serif;}

#container {width:946px; margin:0 auto;}

#header {height:102px;}
#logo {float:left; padding:33px 0 0 33px; font-size:32px; font-family:"Comic Sans MS", cursive;}
#logo a {color:#FFFFFF; text-decoration:none;}
#slogan {float:right; color:#FFFFFF; font-size:16px; text-align:center; font-family:"Comic Sans MS", cursive; padding:33px 33px 0 0;}

#text {margin-right:250px;}
#text_top {background:url(onteethwhitening_olive-images/text_top.png) no-repeat; height:8px; font-size:1px;}
#text_bottom {background:url(onteethwhitening_olive-images/text_bottom.png) no-repeat; height:8px; font-size:1px; margin-bottom:4px;}
#text_main {background:url(onteethwhitening_olive-images/text_bg.png) repeat-y; padding:26px 34px;}
#text br {line-height:10px;}
#text h1 {font-size:28px; font-weight:normal; margin:0 0 8px 0; color:#C3CC91; font-family:Georgia, "Times New Roman", Times, serif; font-style:italic;}
#text h2 {font-size:24px; font-weight:normal; margin:24px 0 8px 0; color:#BAC480; font-family:Georgia, "Times New Roman", Times, serif; font-style:italic;}
#text ol, #text ul {padding:0; margin:10px 0;}
#text li {margin-left:40px;}

#text, #sidebar {font-size:13px; line-height:17px; color:#444444;}
#text a, #sidebar a {color:#D0AF86;}
#text a:hover, #sidebar a:hover {color:#BB8B50;}

#sidebar {width:246px; float:right; margin-left:4px;}
.sidebar_top {background:url(onteethwhitening_olive-images/sidebar_top.png) no-repeat; height:8px; font-size:1px;}
.sidebar_main {background:url(onteethwhitening_olive-images/sidebar_bg.png) repeat-y; padding:10px 24px 16px 24px;}
.sidebar_bottom {background:url(onteethwhitening_olive-images/sidebar_bottom.png) no-repeat; height:8px; font-size:1px; margin-bottom:4px;}
#sidebar h3 {font-size:20px; font-weight:normal; margin:0 0 8px 0; color:#BAC480; font-family:Georgia, "Times New Roman", Times, serif; font-style:italic;}
#sidebar ul {margin:0px; padding:0px;}
#sidebar li {list-style:none; padding:1px 0 1px 12px; background:url(onteethwhitening_olive-images/li.png) 0px 8px no-repeat;}

#footer {color:#FDFEFC; clear:both; text-align:center; font-size:11px; line-height:17px; height:45px; padding-top:18px;}
#footer a {color:#FDFEFC;}
#footer a:hover {color:#F3F5EB;}



<div id="container">
<!-- header -->
<div id="header">

<div id="logo"><a href="#">Website Name</a></div>

<div id="slogan">Your extremely cool &amp; catchy slogan<br/>that will fascinate people.</div>

<!--end header -->
<!-- main -->
<div id="sidebar">

<div class="sidebar_top"></div>
<div class="sidebar_main">
Proin aliquet, sodales vel consequat eget, faucibus vitae lorem. Nunc rhoncus, magna augue <a href="#">faucibus elit</a>, sit amet gravida lacus turpis.
<div class="sidebar_bottom"></div>

<div class="sidebar_top"></div>
<div class="sidebar_main">
<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>
<div class="sidebar_bottom"></div>

<div class="sidebar_top"></div>
<div class="sidebar_main">
<h3>Proin Tempor</h3>
<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>
<div class="sidebar_bottom"></div>


<div id="text">
<div id="text_top"></div>

<div id="text_main">
<b>Onteethwhitening Olive</b> is a free template created by <a href="http://www.realitysoftware.ca/">Reality Software</a> and released by <a href="http://www.onteethwhitening.com/">On Teeth Whitening</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.
<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>
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.
<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>
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 id="text_bottom"></div>
<!-- end main -->
<!-- footer -->
<div id="footer">
&copy; Your Website &nbsp;|&nbsp; <a href="#">Home</a> &nbsp;|&nbsp; <a href="#">About</a> &nbsp;|&nbsp; <a href="#">Terms</a> &nbsp;|&nbsp; <a href="#">Contact</a><br/>
<!-- Please do not change or delete this link. Read the license! Thanks. :-) -->
Design by <a href="http://www.onteethwhitening.com/">On Teeth Whitening</a>.
<!-- end footer -->


Related examples in the same category