simpleandsleak
?<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name="description" content="description of page" />
<meta name="keywords" content="keywords of site" />
<meta name="author" content="name of author - Manjeet Singh Sawhney www.manjeetss.com" />
<style type='text/css'>
/* This website template was created by myself Manjeet Singh Sawhney (http://www.manjeetss.com)
You are free to copy, distribute and adapt any of the work under the following condition:
You must attribute the work by keeping the "Designed by Manjeet Singh Sawhney" link in the footer.
If you wish, you can remove the footer link by paying a small fee of only $5. For this please drop me an e-mail to manjeetss@gmail.com with your details and I will then send you my PayPal account details. Thanks.
*/
body
{
margin: 15px;
font: normal 12px Helvetica, Arial, Verdana;
background: #006699 url('simpleandsleak-images/bg.jpg') repeat-x;
color: #555;
}
a
{
text-decoration: none;
color: #1164cf;
}
a:hover
{
color: #777;
}
h1
{
margin: 0;
font-size: 22px;
font-weight: bold;
}
h2
{
margin: 0 0 15px 0;
font-size: 16px;
font-weight: normal;
}
h3
{
margin: 20px 0 10px 0;
font-size: 14px;
font-weight: bold;
}
p
{
margin: 0 0 15px 0;
line-height: 18px;
}
#container
{
padding: 20px 20px 20px 20px;
background: #ffffff;
width: 800px;
}
.tablist
{
margin: 0px 0 12px 0;
text-align: right;
padding: 35px 0 0 0;
}
.tablist ul
{
margin: 0 0px 7px 0;
}
.tablist li
{
list-style: none;
display: inline;
margin: 0 5px 0 0;
}
.tablist li a
{
text-decoration: none;
padding: 4px 10px;
color: #1164cf;
font: bold 13px Tahoma, Verdana, Helvetica;
text-transform: uppercase;
}
.tablist li a:hover
{
border-bottom: 3px solid #1164cf;
padding: 4px 10px;
color: #aaa;
}
.tablist li a.selected
{
border-bottom: 3px solid #aaa;
padding: 4px 10px;
color: #1164cf;
}
#logo
{
margin: 10px;
float: left;
}
#logo h1 a
{
color: #1164cf;
text-decoration: none;
}
#logo .slogan
{
font-style: italic;
padding: 2px 0 0 10px;
color: #999;
}
#header_text
{
color: #ffffff;
padding: 0;
background: #505050 url(simpleandsleak-images/header.jpg) top left no-repeat;
clear: both;
margin: 4px 0 0 0;
height: 200px;
}
#header_text p
{
width: 400px;
font-size: 12px;
line-height: 18px;
padding: 0 0 0 15px;
font-style: italic;
}
#header_text h2
{
padding: 15px 15px 0 15px;
color: #ffffff;
font-weight: bold;
}
#header_text a
{
color: #aaa;
font-weight: bold;
}
#left
{
width: 180px;
float: left;
}
#left p
{
font-size: 11px;
line-height: 15px;
margin: 0 0 5px 0;
}
.leftmenu
{
text-align: left;
font: bold 11px Tahoma, Verdana, Helvetica;
margin: 5px 10px 5px 0;
text-decoration: none;
}
.leftmenu a
{
background: #ddd;
display: block;
padding: 5px 5px 5px 8px;
}
.leftmenu a:hover
{
background: #ccc;
color: #fff;
}
#main
{
width: 590px;
float: right;
padding: 0 15px 0 10px;
border-left: 1px solid #ddd;
}
.note
{
background: #eee;
padding: 15px;
border: 3px solid #bbb;
}
#footer
{
clear: both;
background: #eee;
line-height: 18px;
color: #777;
font-size: 11px;
border-top: 2px solid #ccc;
border-bottom: 2px solid #ccc;
text-align: center;
}
#footer a
{
color: #777;
font-weight: bold;
}
</style>
<title>Business Name - www.manjeetss.com</title>
</head>
<body>
<div id="container">
<div id="logo">
<h1><a href="index.html">Business Name</a></h1>
<div class="slogan">Some Slogan</div>
</div>
<div class="tablist">
<ul>
<li><a class="selected" href="index.html">Home</a></li>
<li><a href="http://www.manjeetss.com/websitetemplates.html">Website Templates</a></li>
<li><a href="http://www.manjeetss.com/fitnessnutrition.html">Fitness & Nutrition</a></li>
</ul>
</div>
<div id="header_text">
<h2>My first website template</h2>
<p>You are free to copy, distribute and adapt any of the work under the condition that you must attribute the work by keeping the "Designed by Manjeet Singh Sawhney" link in the footer.</p>
<p>If you wish, you can remove the footer link by paying a small fee of only $5. For this please drop me an e-mail to <a href="mailto:manjeetss@gmail.com">manjeetss@gmail.com</a> with your details and I will then send you my PayPal account details. Thanks.</p>
</div>
<div id="left">
<h3>Navigation Menu</h3>
<div class="leftmenu"><a href="#">Link 1</a></div>
<div class="leftmenu"><a href="#">Link 2</a></div>
<div class="leftmenu"><a href="#">Link 3</a></div>
<h3>News</h3>
<p>Donec tortor purus, ornare vel, tincidunt at, lacinia ac, leo. <a href="#">...read more</a></p>
</div>
<div id="main">
<h3>H3 Title</h3>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Morbi quis ligula. Donec tortor purus, ornare vel, tincidunt at, lacinia ac, leo. Nunc fermentum congue odio. Mauris cursus, pede vitae sagittis luctus, dolor felis aliquam arcu, ac pulvinar lacus massa non ipsum. Praesent volutpat, felis in consectetuer lobortis, nibh orci nonummy quam, nec lobortis tellus purus eget turpis. Vestibulum placerat sagittis lorem. Praesent interdum ultricies massa. Morbi dolor. Donec sit amet ligula ut ipsum ullamcorper imperdiet. Aliquam id lorem. Quisque elit elit, tincidunt vitae, tempus et, venenatis eget, turpis. Suspendisse porttitor volutpat justo. Etiam bibendum, diam quis nonummy malesuada, tortor sapien laoreet metus, quis varius augue velit eget ligula. Praesent massa felis, pulvinar quis, fringilla eget, suscipit in, diam. Curabitur dapibus rhoncus eros.</p>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Morbi quis ligula. Donec tortor purus, ornare vel, tincidunt at, lacinia ac, leo. Nunc fermentum congue odio. Mauris cursus, pede vitae sagittis luctus, dolor felis aliquam arcu, ac pulvinar lacus massa non ipsum. Praesent volutpat, felis in consectetuer lobortis, nibh orci nonummy quam, nec lobortis tellus purus eget turpis. Vestibulum placerat sagittis lorem. Praesent interdum ultricies massa. Morbi dolor. Donec sit amet ligula ut ipsum ullamcorper imperdiet. Aliquam id lorem. Quisque elit elit, tincidunt vitae, tempus et, venenatis eget, turpis. Suspendisse porttitor volutpat justo. Etiam bibendum, diam quis nonummy malesuada, tortor sapien laoreet metus, quis varius augue velit eget ligula. Praesent massa felis, pulvinar quis, fringilla eget, suscipit in, diam. Curabitur dapibus rhoncus eros.</p>
<p class="note">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Morbi quis ligula. Donec tortor purus, ornare vel, tincidunt at, lacinia ac, leo. Nunc fermentum congue odio. Mauris cursus, pede vitae sagittis luctus, dolor felis aliquam arcu, ac pulvinar lacus massa non ipsum. Praesent volutpat, felis in consectetuer lobortis, nibh orci nonummy quam, nec lobortis tellus purus eget turpis. Vestibulum placerat sagittis lorem. Praesent interdum ultricies massa. Morbi dolor. Donec sit amet ligula ut ipsum ullamcorper imperdiet. Aliquam id lorem. Quisque elit elit, tincidunt vitae, tempus et, venenatis eget, turpis. Suspendisse porttitor volutpat justo. Etiam bibendum, diam quis nonummy malesuada, tortor sapien laoreet metus, quis varius augue velit eget ligula. Praesent massa felis, pulvinar quis, fringilla eget, suscipit in, diam. Curabitur dapibus rhoncus eros.</p>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Morbi quis ligula. Donec tortor purus, ornare vel, tincidunt at, lacinia ac, leo. Nunc fermentum congue odio. Mauris cursus, pede vitae sagittis luctus, dolor felis aliquam arcu, ac pulvinar lacus massa non ipsum. Praesent volutpat, felis in consectetuer lobortis, nibh orci nonummy quam, nec lobortis tellus purus eget turpis. Vestibulum placerat sagittis lorem. Praesent interdum ultricies massa. Morbi dolor. Donec sit amet ligula ut ipsum ullamcorper imperdiet. Aliquam id lorem. Quisque elit elit, tincidunt vitae, tempus et, venenatis eget, turpis. Suspendisse porttitor volutpat justo. Etiam bibendum, diam quis nonummy malesuada, tortor sapien laoreet metus, quis varius augue velit eget ligula. Praesent massa felis, pulvinar quis, fringilla eget, suscipit in, diam. Curabitur dapibus rhoncus eros.</p>
</div>
<div id="footer">
<!--
This website template was created by myself Manjeet Singh Sawhney (http://www.manjeetss.com)
You are free to copy, distribute and adapt any of the work under the following condition:
You must attribute the work by keeping the "Designed by Manjeet Singh Sawhney" link in the footer.
If you wish, you can remove the footer link by paying a small fee of only $5. For this please drop
me an e-mail to manjeetss@gmail.com with your details and I will then send you my PayPal account details.
Thanks.
-->
Copyright © 2011 Your Site
<br />
Designed by <a href="http://www.manjeetss.com">Manjeet Singh Sawhney</a>
</div>
</div>
</body>
</html>
Related examples in the same category