hot-coffee : Coffee « Templates « HTML / CSS






hot-coffee

    

<!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">
<head>
<title>Hot Coffee</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<style type='text/css'>
/*
Theme Name: Hot Coffee
Description: 3-column Wordpress theme.
Author: Anna
Author URI: http://ww-recipes.net
*/


body {
 font: 12px Arial, Tahoma, Verdana, Sans-serifs;
 background: url('hot-coffee-images/background.png') repeat-x #90491e;
 text-align: justify;
 padding: 0px;
 margin: 0px;
 }
#container {
width: 100%
}
#wrap {
 width: 960px;
 padding: 0px;
 margin: auto;
 }
#header {
 height: 100px;
 margin: auto;
 padding: 30px 410px 0px 0px;
 text-align: right;
 color: #FFFFFF;
 }
#header h1 {
 color: #FFFFFF;
 font: 36px Georgia, "Times New Roman", Times, serifs;
 margin: 0px;
 padding: 0px;
 }
#navigation {
 clear: both;
 height: 30px;
 font-weight: bold;
 color: #FFFFFF;
 font-size: 12px;
 text-transform: uppercase;
 }
#navigation ul {
 float: left;
 list-style: none;
 margin: 8px 0px 0px 10px;
 padding: 0px;
 }
#navigation li {
 float: left;
 padding: 0px 20px 0px 0px;
 }
#content {
 float: left;
 width: 550px;
 padding: 0px;
 margin: 0px 0px 20px 0px;
 display: block;
 background: url('hot-coffee-images/content_bottom.png') no-repeat bottom #FFFFFF;
 }
#content_top {
 background: url('hot-coffee-images/content_top.png') no-repeat center;
 height: 30px;
 }
.entry_body {
 padding: 10px 20px;
 margin: 0px 0px 30px 0px;
 line-height: 18px;
 }
#content h1 {
 font: 26px Georgia, "Times New Roman", Times, serifs;
 border-bottom: 2px dotted #F8994C;
 color: #6E1F2E;
 padding: 0px;
 margin: 0px;
 }
.entry_date {
 clear: both;
 padding: 5px 0px;
 color: #636467;
 }
.entry_body blockquote {
 padding: 5px 15px;
 margin: 10px 30px;
 border-left: 4px solid #6E1F2E;
 color:  #6D6F71;
 text-align: justify;
 }
.entry_footer {
 clear: both;
 margin: 0px;
 padding: 5px;
 height: 15px;
 border-top: 2px dotted #F8994C;
 }
#footer_link {
 clear: both;
 padding: 10px 20px;
 height: 30px;
 }
.footerleft {
 float: left;
 }
.footerright {
 float: right;
 }
#content_break {
 clear: both;
 }
#sidebar {
 width: 410px;
 padding: 380px 0px 50px 0px;
 float: right;
 margin: -100px 0px 0px 0px;
 background: url('hot-coffee-images/header.png') no-repeat center top #cd6829;
 color: #FFFFFF;
 }
#sidebar_left {
 float: left;
 padding: 5px;
 width: 190px;
 }
#sidebar_right {
 float: right;
 padding: 5px;
 width: 190px;
 }
#sidebar h2 {
 font: 20px Georgia, "Times New Roman", Times, serifs;
 color: #FFFFFF;
 border-bottom: 2px dotted #FFFFFF;
 padding: 5px;
 margin: 0px;
 }
#sidebar ul {
 list-style: none;
 margin: 0px;
 padding: 5px;
 }
#sidebar li {
 padding: 3px 0px;
 }
#footer {
width: 100%;
 clear: both;
 height: 10px;
 padding: 10px;
 background: #682e27;
 color: #FFFFFF;
 font-size: 10px;
 }
#footer_text {
 margin: auto;
 width: 960px;
 }
.powered {
 float: left;
 }
.sponsors {
 float: right;
 }

.wp-smiley {
  padding: 0px;
  margin: 0px;
  border: 0px;
  background: transparent;
  }
#content img {
  border: 1px solid #F8994C;
  }
.wp-caption-text {
  display: block;
  font-size: 10px;
  text-align: center;
  padding: 0px;
  margin: 0px;
  }
.aligncenter {
  display: block;
  margin-left: auto;
  margin-right: auto;
  }
.alignright {
  float: right;
  padding: 4px;
  margin: 0px 0px 2px 7px;
  display: inline;
  }
.alignleft {
  float: left;
  padding: 4px;
  margin: 0px 7px 2px 0px;
  display: inline;
  }
.pagetitle {
  margin: 0px;
  padding: 10px;
  }
.postmetadata {
  clear: both;
  padding: 10px;
  border: 1px solid #CCCCCC;
  }
.alt {
 background: #FFF8F9;
  }
#comment_box {
 margin: 5px 20px;
 }
#comment_box ol {
  padding: 0px;
  list-style: none;
  }
#comment_box li {
  padding: 10px;
  list-style: none;
  }
.textwidget {
  padding: 5px 0px 5px 5px;
  margin: 0px 0px 10px 0px;
  }
#wp-calendar {
  width: 100%;
  margin: 2px 0px 20px 0px;
  }
#wp-calendar caption {
  font-weight: bold;
  padding: 5px 0px;
  }
#wp-calendar a {
  text-decoration: underline;
  }
#wp-calendar td {
  text-align: center;
  }
#content a {
  text-decoration: none;
  color: #a8442b;
  }
#content a:hover {
  text-decoration: underline;
  color: #682e27;
  }
a {
  text-decoration: none;
  color: #FFFFFF;
  }
a:hover {
  text-decoration: underline;
  color: #FFFFFF;
  }

</style>


</head>
<body>
<div id="container">
  <div id="wrap">
    <div id="navigation">
      <ul>
        <li><a href="http://www.free-css.com/">Home</a></li>
        <li><a href="http://www.free-css.com/">About</a></li>
        <li><a href="http://www.free-css.com/">Contact</a></li>
        <li><a href="http://www.free-css.com/">Resources</a></li>
      </ul>
    </div>
    <div id="header">
      <h1><a href="http://www.free-css.com/">Hot Coffee</a></h1>
      Free CSS Template</div>
    <div id="content">
      <div id="content_top"></div>
      <div class="entry_body">
        <h1><a href="http://www.free-css.com/">Image Inside a Post</a></h1>
        <div class="entry_date">28th January, 2009 by admin</div>
        <p><img src="hot-coffee-images/coffee1.jpg" alt="" width="300" height="340" class="alignleft" />Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent volutpat, tortor vel ultricies placerat, dui massa vestibulum sem, vitae porta mauris nibh ac felis. Nullam posuere semper neque. Suspendisse potenti. Morbi non felis. Nullam lorem sem, iaculis eget, rutrum sed, malesuada eu, nulla. Nunc nibh tortor, bibendum nec, congue vitae, viverra eu, pede. Phasellus imperdiet feugiat nisl. Donec felis orci, venenatis in, mattis porta, egestas nec, quam. Praesent est. Fusce malesuada pede id mauris. Vestibulum nisi nunc, interdum non, mollis at, aliquet non, ipsum. Nunc mi augue, consectetur eu, ullamcorper lacinia, commodo quis, arcu. Aliquam sit amet lectus. Aenean adipiscing, mi ac lobortis volutpat, diam eros placerat nibh, in cursus diam eros a nisl.</p>
        <div class="entry_footer">Filed under <a href="http://www.free-css.com/">Uncategorized</a> | <a href="http://www.free-css.com/">No Comments</a></div>
      </div>
      <div class="entry_body">
        <h1><a href="http://www.free-css.com/">Lorem Ipsum</a></h1>
        <div class="entry_date">28th January, 2009 by admin</div>
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent volutpat, tortor vel ultricies placerat, dui massa vestibulum sem, vitae porta mauris nibh ac felis. Nullam posuere semper neque. Suspendisse potenti. Morbi non felis. Nullam lorem sem, iaculis eget, rutrum sed, malesuada eu, nulla. Nunc nibh tortor, bibendum nec, congue vitae, viverra eu, pede. Phasellus imperdiet feugiat nisl. Donec felis orci, venenatis in, mattis porta, egestas nec, quam. Praesent est.</p>
        <blockquote>
          <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent volutpat, tortor vel ultricies placerat, dui massa vestibulum sem, vitae porta mauris nibh ac felis. Nullam posuere semper neque. Suspendisse potenti. Morbi non felis. Nullam lorem sem, iaculis eget, rutrum sed, malesuada eu, nulla. </p>
        </blockquote>
        <div class="entry_footer">Filed under <a href="http://www.free-css.com/">Uncategorized</a> | <a href="http://www.free-css.com/">No Comments</a></div>
      </div>
      <div class="entry_body">
        <h1><a href="http://www.free-css.com/">Hello world!</a></h1>
        <div class="entry_date">28th January, 2009 by admin</div>
        <p>Welcome to WordPress. This is your first post. Edit or delete it, then start blogging!</p>
        <div class="entry_footer">Filed under <a href="http://www.free-css.com/">Uncategorized</a> | <a href="http://www.free-css.com/">1 Comment</a></div>
      </div>
      <div id="footer_link"> <span class="footerleft"><!-- --></span> <span class="footerright"><!-- --></span></div>
    </div>
    <div id="sidebar">
      <div id="sidebar_left">
        <h2>Archives</h2>
        <ul>
          <li><a href="http://www.free-css.com/">January 2009</a></li>
        </ul>
        <h2>Categories</h2>
        <ul>
          <li class="cat-item"><a href="http://www.free-css.com/">Uncategorized</a> (3) </li>
        </ul>
        <h2>Links</h2>
        <ul>
          <li><a href="http://www.free-css.com/">Documentation</a></li>
          <li><a href="http://www.free-css.com/">Development Blog</a></li>
          <li><a href="http://www.free-css.com/">Suggest Ideas</a></li>
          <li><a href="http://www.free-css.com/">Support Forum</a></li>
          <li><a href="http://www.free-css.com/">Plugins</a></li>
          <li><a href="http://www.free-css.com/">Themes</a></li>
          <li><a href="http://www.free-css.com/">WordPress Planet</a></li>
        </ul>
      </div>
      <div id="sidebar_right">
        <h2>Meta</h2>
        <ul>
          <li><a href="http://www.free-css.com/">Log in</a></li>
          <li><a target="_blank" href="http://validator.w3.org/check/referer">Valid <abbr title="eXtensible HyperText Markup Language">XHTML</abbr></a></li>
          <li><a href="http://www.free-css.com/"><abbr title="XHTML Friends Network">XFN</abbr></a></li>
        </ul>
      </div>
    </div>
  </div>
  <div id="footer">
    <div id="footer_text"><span class="powered">Designed by Anna: <a href="http://ww-recipes.net/">Weight Watchers Recipes</a></span> <span class="sponsors">Brought to you by <a href="http://dietrecipesblog.com/">Diet Recipes Blog</a> and <a href="http://freemexicanrecipes.org/">Mexican Recipes</a></span> </div>
  </div>
</div>
</body>
</html>

   
    
    
    
  








Related examples in the same category

1.coffe
2.coffee-maker
3.COFFEE 2
4.coffeeblossom
5.coffeecup
6.coffeencream
7.coffee_stain
8.metamorph_coffee
9.metamorph_coconut
10.ftdcoffeehouse
11.ftd_coffeecup
12.thecoffeeshop