unqualified
<!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>
<title>Unqualified</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<style type='text/css'>
/*
Design by Free CSS Templates
http://www.freecsstemplates.org
Released for free under a Creative Commons Attribution 2.5 License
*/
body {
margin: 0;
padding: 0;
background: #FFFFFF url(unqualified-images/bg01.jpg) repeat-x top left;
font-size: 13px;
color: #7F7F7F;
}
body, th, td, input, textarea, select, option {
font-weight: normal;
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
}
h1, h2, h3 {
font-weight: normal;
color: #484848;
}
h1 {
text-transform: lowercase;
letter-spacing: -1px;
font-size: 24px;
}
h2 {
text-transform: lowercase;
letter-spacing: -1px;
font-size: 24px;
}
h3 {
font-size: 1em;
}
p, ul, ol {
line-height: 200%;
}
blockquote {
padding-left: 1em;
}
blockquote p, blockquote ul, blockquote ol {
line-height: normal;
font-style: italic;
}
a {
color: #7ACE11;
}
a:hover {
text-decoration: none;
color: #7ACE11;
}
/* Header */
#header {
width: 890px;
height: 190px;
margin: 0px auto;
}
/* Logo */
#logo {
float: left;
padding: 40px 0 0 0;
}
#logo h1 {
margin: 0;
text-transform: lowercase;
letter-spacing: -2px;
font-size: 3.6em;
font-weight: normal;
color: #FFFFFF;
}
#logo h1 a {
padding-right: 20px;
text-decoration: none;
color: #FFFFFF;
}
#logo p {
margin: -5px 0 0 0;
text-transform: uppercase;
font-size: 1.22em;
letter-spacing: -1px;
}
#logo a {
text-decoration: none;
color: #FFFFFF;
}
/* Menu */
#menu {
float: right;
}
#menu ul {
margin: 0px;
padding: 93px 0px 0px 0px;
list-style: none;
}
#menu li {
display: inline;
}
#menu a {
display: block;
float: left;
margin-left: 20px;
text-decoration: none;
text-transform: lowercase;
font-size: 1.36em;
color: #FFFFFF;
}
#menu a:hover, .active a {
border-bottom: 3px solid #FFFFFF;
}
/* Page */
#page {
width: 890px;
margin: 0 auto;
}
/* Content */
#content {
float: left;
width: 590px;
}
.post {
padding: 20px 20px;
background: url(unqualified-images/bg04.jpg) no-repeat top left;
}
.title {
margin: 0;
border-bottom: 2px solid #484848;
color: #484848;
}
.byline {
margin: 0;
color: #D79B00;
}
.meta {
text-align: left;
color: #646464;
}
.meta .more {
padding-left: 20px;
background: url(unqualified-images/img03.gif) no-repeat left center;
}
.meta .comments {
padding-left: 20px;
background: url(unqualified-images/img04.gif) no-repeat left center;
}
/* Sidebar */
#sidebar {
float: right;
width: 240px;
}
#sidebar ul {
margin: 0;
padding: 0;
list-style: none;
}
#sidebar li {
}
#sidebar li ul {
padding: 15px 0;
}
#sidebar li li {
padding-left: 20px;
border-bottom: 1px dotted #7B9418;
}
#sidebar h2 {
margin: 0;
padding: 5px 0 0 20px;
background: url(unqualified-images/img06.jpg) no-repeat left 80%;
}
#sidebar a {
text-decoration: none;
}
#sidebar a:hover {
}
/* Footer */
#footer {
clear: both;
margin: 0px;
height: 80px;
background: #F2F2F2 url(unqualified-images/bg02.jpg) repeat-x left top;
}
#footer p {
padding: 20px 0;
text-align: center;
font-size: smaller;
color: #717171;
}
</style>
</head>
<body>
<div id="header">
<div id="logo">
<h1><a href="http://www.free-css.com/">unqualified</a></h1>
<p><a href="http://www.free-css.com/">Free CSS Templates</a></p>
</div>
<div id="menu">
<ul>
<li class="active"><a href="http://www.free-css.com/">Home</a></li>
<li><a href="http://www.free-css.com/">Blog</a></li>
<li><a href="http://www.free-css.com/">Gallery</a></li>
<li><a href="http://www.free-css.com/">About</a></li>
<li><a href="http://www.free-css.com/">Contact </a></li>
</ul>
</div>
</div>
<div id="page">
<div id="content">
<div class="post">
<h1 class="title">Welcome to My Website</h1>
<p class="byline"><small>Posted on August 25th, 2007 by <a href="http://www.free-css.com/">admin</a> | <a href="http://www.free-css.com/">Edit</a></small></p>
<div class="entry">
<p><strong>Unqualified </strong>is a free, fully standards-compliant CSS template designed by Free CSS Templates. This free template is released under a <a target="_blank" href="http://creativecommons.org/licenses/by/2.5/">Creative Commons Attributions 2.5</a> license, so you're pretty much free to do whatever you want with it (even use it commercially) provided you keep the links in the footer intact. Aside from that, have fun with it :)</p>
<p>This template is also available as a WordPress theme at Free WordPress Themes.</p>
</div>
<p class="meta"><a href="http://www.free-css.com/" class="more">Read More</a> <a href="http://www.free-css.com/" class="comments">Comments (33)</a></p>
</div>
<div class="post">
<h2 class="title">Risus Pellentesque Pharetra</h2>
<p class="byline"><small>Posted on August 25th, 2007 by <a href="http://www.free-css.com/">admin</a> | <a href="http://www.free-css.com/">Edit</a></small></p>
<div class="entry">
<p>Maecenas pede nisl, elementum eu, ornare ac, malesuada at, erat. Proin gravida orci porttitor enim accumsan lacinia. Donec condimentum, urna non molestie semper, ligula enim ornare nibh, quis laoreet eros quam eget ante. Maecenas pede nisl, elementum eu, ornare ac, malesuada at, erat. </p>
</div>
<p class="meta"><a href="http://www.free-css.com/" class="more">Read More</a> <a href="http://www.free-css.com/" class="comments">Comments (33)</a></p>
</div>
</div>
<div id="sidebar">
<ul>
<li>
<h2>Categories</h2>
<ul>
<li><a href="http://www.free-css.com/">Aliquam libero</a></li>
<li><a href="http://www.free-css.com/">Consectetuer adipiscing elit</a></li>
<li><a href="http://www.free-css.com/">metus aliquam pellentesque</a></li>
<li><a href="http://www.free-css.com/">Suspendisse iaculis mauris</a></li>
<li><a href="http://www.free-css.com/">Urnanet non molestie semper</a></li>
<li><a href="http://www.free-css.com/">Proin gravida orci porttitor</a></li>
</ul>
</li>
<li>
<h2>Archives</h2>
<ul>
<li><a href="http://www.free-css.com/">September</a> (23)</li>
<li><a href="http://www.free-css.com/">August</a> (31)</li>
<li><a href="http://www.free-css.com/">July</a> (31)</li>
<li><a href="http://www.free-css.com/">June</a> (30)</li>
<li><a href="http://www.free-css.com/">May</a> (31)</li>
<li><a href="http://www.free-css.com/">April</a> (30)</li>
<li><a href="http://www.free-css.com/">March</a> (31)</li>
<li><a href="http://www.free-css.com/">February</a> (28)</li>
<li><a href="http://www.free-css.com/">January</a> (31)</li>
</ul>
</li>
</ul>
</div>
</div>
<div id="footer">
<p>©2007 All Rights Reserved. • Design by <a href="http://www.freecsstemplates.org/">Free CSS Templates</a> • Icons by <a href="http://www.famfamfam.com/">FAMFAMFAM</a>.</p>
</div>
</body>
</html>
Related examples in the same category