firming
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!--
Design by Free CSS Templates
http://www.freecsstemplates.org
Released for free under a Creative Commons Attribution 2.5 License
Name : Firming
Description: A two-column, fixed-width design suitable for small websites and blogs.
Version : 1.0
Released : 20080129
-->
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Firming by Free CSS Templates</title>
<meta name="keywords" content="" />
<meta name="description" content="" />
<style type='text/css'>
/*
Design by Free CSS Templates
http://www.freecsstemplates.org
Released for free under a Creative Commons Attribution 2.5 License
*/
html, body {
height: 100%;
}
body {
margin: 0;
padding: 0;
background: #EDFBD2 url(firming-images/img01.jpg) repeat-x left top;
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
color: #2B4E15;
}
form {
margin: 0;
padding: 0;
}
input, textarea {
font-family: Arial, Helvetica, sans-serif;
font-size: 1em;
color: #000000;
}
h1, h2, h3 {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
}
h1 {
font-size: 3em;
}
h2 {
font-size: 2em;
}
h3 {
font-size: 1em;
}
p, ul, ol {
margin-bottom: 1.8em;
line-height: 160%;
}
ul, ol {
}
blockquote {
}
a {
color: #71AB48;
}
a:hover {
text-decoration: none;
}
hr {
display: none;
}
/* Wrapper */
#wrapper {
height: 100%;
min-height: 100%;
background: url(firming-images/img02.jpg) repeat-x left bottom;
}
html>body #wrapper {
height: auto;
}
/* Menu */
#menu {
width: 778px;
height: 57px;
padding-top: 10px;
margin: 0 auto;
}
#menu ul {
float: right;
margin: 0;
padding: 0;
list-style: none;
}
#menu li {
display: inline;
}
#menu a {
float: left;
height: 20px;
padding: 10px 15px;
text-decoration: none;
text-transform: uppercase;
font-size: smaller;
font-weight: bold;
color: #000000;
}
#menu a:hover {
background: #949684;
color: #FFFFFF;
}
#menu .current_page_item a {
background: #949684;
color: #FFFFFF;
}
/* Logo */
#logo {
width: 778px;
height: 180px;
margin: 0 auto;
color: #FFFFFF;
}
#logo h1, #logo h2 {
float: left;
margin: 0;
}
#logo h1 {
padding: 25px 0 0 20px;
letter-spacing: -2px;
text-transform: lowercase;
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 50px;
}
#logo h2 {
padding: 36px 0 0 10px;
letter-spacing: -1px;
text-transform: uppercase;
font-weight: normal;
font-size: 14px;
}
#logo a {
text-decoration: none;
color: #FFFFFF;
}
/* Page */
#page {
width: 778px;
margin: 0 auto;
padding: 20px 0;
}
/* Content */
#content {
float: left;
width: 494px;
}
.post {
padding-bottom: 20px;
}
.post .title {
margin: 0;
padding: 5px 20px;
letter-spacing: -2px;
}
.post .title a {
text-decoration: none;
color: #57A122;
}
.post .entry {
padding: 10px 20px 0 20px;
}
.post .meta {
height: 26px;
border-top: 1px solid #3E5C0E;
border-bottom: 2px solid #3E5C0E;
font-size: smaller;
font-weight: bold;
}
.post .posted {
float: left;
height: 16px;
padding: 5px 20px;
}
.post .permalink, .post .comments {
float: right;
height: 16px;
padding: 5px 20px;
}
.post .permalink {
}
/* Sidebar */
#sidebar {
float: right;
width: 260px;
}
#sidebar ul {
margin: 0;
padding: 0;
list-style: none;
}
#sidebar li {
margin-bottom: 20px;
}
#sidebar li ul {
padding: 20px;
}
#sidebar li li {
margin: 0;
}
#sidebar p {
padding: 0 20px;
}
#sidebar h2 {
height: 29px;
margin: 0;
padding: 9px 0 0 20px;
background: #B6E074;
border: 1px dotted #4D7C2B;
text-transform:lowercase;
font-size: 1.4em;
font-weight: normal;
color: #000000;
}
/* Search */
#search form {
padding: 20px;
}
#search br {
display: none;
}
#search #s {
width: 135px;
}
/* Footer */
#footer {
clear: both;
padding: 10px 0;
font-size: smaller;
}
#footer p {
margin: 0;
text-align: center;
line-height: normal;
}
</style>
</head>
<body>
<div id="wrapper">
<div id="menu">
<ul>
<li><a href="#">Homepage</a></li>
<li class="current_page_item"><a href="#">Gallery</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Resources</a></li>
<li><a href="#">Contact</a></li>
</ul>
</div>
<div id="logo">
<h1><a href="#">firming</a></h1>
<h2>By Free CSS Templates</h2>
</div>
<hr />
<div id="page">
<div id="content">
<div class="post">
<h2 class="title"><a href="#">Welcome to Firming</a></h2>
<div class="entry">
<p>This is <strong>Firming</strong>, a free, fully standards-compliant CSS template designed by <a href="http://www.freecsstemplates.org/">Free CSS Templates</a>, released for free under the <a href="http://creativecommons.org/licenses/by/2.5/">Creative Commons Attribution 2.5</a> license. You're free to use this template for anything as long as you link back to <a href="http://www.freecsstemplates.org/">my site</a>. Enjoy :)</p>
<p>This template is also available as a <a href="http://www.nodethirtythree.com/">WordPress theme</a> at <a href="http://www.freewpthemes.net/">Free WordPress Themes</a>.</p>
</div>
<p class="meta"><span class="posted">Posted by <a href="#">Someone</a> on January 2, 2007</span> <a href="#" class="permalink">Read more</a> <a href="#" class="comments">Comments (18)</a> </p>
</div>
<div class="post">
<h2 class="title"><a href="#">Sapien sed varius</a></h2>
<div class="entry">
<p>Morbi sit amet mauris. Nam vitae nibh eu sapien dictum pharetra. Vestibulum elementum neque vel lacus. Proin auctor dolor et massa. Phasellus sit amet velit. Vestibulum vel lacus vitae tortor consectetuer sapien semper dictum. Integer est felis, facilisis quis, lacinia sed, lacinia et, augue. Vivamus ultrices lacinia urna. Proin varius sollicitudin nunc. Vivamus condimentum, dui nec imperdiet porta, odio risus molestie nisl, nec laoreet purus sapien a massa.</p>
</div>
<p class="meta"><span class="posted">Posted by <a href="#">Someone</a> on December 13, 2007</span> <a href="#" class="permalink">Read more</a> <a href="#" class="comments">Comments (18)</a> </p>
</div>
</div>
<!-- end #content -->
<div id="sidebar">
<ul>
<li id="search">
<h2>Search</h2>
<form id="searchform" method="get" action="">
<div>
<input type="text" name="s" id="s" size="15" />
<br />
<input name="submit" type="submit" value="Search" />
</div>
</form>
</li>
<li>
<h2>Veroeros etiam</h2>
<p><strong>Morbi sit amet</strong> mauris Nam vitae nibh eu sapien dictum pharetra. Vestibulum elementum neque vel lacus. Proin auctor dolor loremmassa. Phasellus sit. <a href="#">More…</a></p>
</li>
<li>
<h2>Blandit Volutpat</h2>
<ul>
<li><a href="#">Morbi sit amet sed magna</a></li>
<li><a href="#">Lacus dapibus interdum</a></li>
<li><a href="#">Donec pede nisl dolore sed</a></li>
<li><a href="#">Lacus dapibus et interdum</a></li>
<li><a href="#">Morbi sit amet magna etiam</a></li>
<li><a href="#">Maecenas sed sem lorem</a></li>
<li><a href="#">Lacus dapibus interdum</a></li>
<li><a href="#">Donec pede nisl dolore</a></li>
</ul>
</li>
</ul>
</div>
<!-- end #sidebar -->
</div>
<!-- end #page -->
<div id="footer">
<p>(c) 2007 Website Name. Designed by <a href="http://www.freecsstemplates.org/">Free CSS Templates</a> | <a href="http://free-templates.ru/">Free CSS Templates</a>.</p>
</div>
</div>
</body>
</html>
Related examples in the same category