ftdflowered
<!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>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>FlashTemplatesDesign.com Free Css Templates</title>
<meta name="keywords" content="" />
<meta name="description" content="" />
<style type='text/css'>
/*
Design by FlashTemplatesDesign.com
http://www.flashtemplatesdesign.com/
Released for free under a Creative Commons Attribution 2.5 License
*/
*
{
border: 0;
margin: 0;
}
img
{
border: 0px;
}
a{
color: #711419;
text-decoration:none;
}
a:hover{
text-decoration: underline;
}
body{
font: 12px Arial, Helvetica, sans-serif;
color: #000000;
background: url(ftdflowered-images/bg.jpg) top repeat-x #FBB7B7;
line-height:17px;
}
#menu{
background: url(ftdflowered-images/but.jpg) 0px 70px repeat-x;
height:100%;
}
#futer{
background: url(ftdflowered-images/fut.gif) bottom repeat-x;
height:100%;
}
#main{
width: 1001px;
margin: 0px auto;
padding: 0px 0px 0px 0px;
background:url(ftdflowered-images/bg_main.jpg) left top no-repeat;
float:left;
}
#left_bg {
background: url(ftdflowered-images/left_bg.gif) left repeat-y;
}
#header {
padding: 0px 0px 0px 0px;
height: 138px;
}
#logo{
text-align: right;
padding-top: 180px;
padding-right: 20px;
}
#logo a {
text-decoration: none;
text-transform: lowercase;
font-style: italic;
font-size: 16px;
color: #FFFFFF;
font-weight: bold;
}
#logo H2 a{
font-size: 10px;
}
#buttons{
width: 766px;
height: 60px;
text-align: left;
}
#buttons ul {
padding-left: 0px;
margin-left:0px;
}
#buttons li {
display: inline;
}
#buttons a {
font-family: Georgia, Arial, Helvetica, sans-serif;
font-size: 18px;
font-weight:normal;
display: block;
float: left;
width: 122px;
height: 40px;
text-decoration: none;
color: #FFFFFF;
padding-top: 20px;
text-align: left;
background: url(ftdflowered-images/fish_but.jpg) 0px 19px no-repeat;
margin-left:0px;
padding-left: 30px;
}
#buttons a:hover {
text-decoration: underline;
}
#left{
width: 213px;
padding: 8px 7px 0px 7px;
margin: 0px;
float:left;
}
#right_content {
width: 750px;
border: 1px solid #7D0101;
background:#FFFFFF;
padding: 6px 7px 7px 7px;
}
.text{
padding: 12px 0px 0px 0px;
}
.text2{
padding: 12px 6px 0px 6px;
}
.img { float:left;
margin: 2px 19px 0px 0px;
}
span { color:#B91B1B;
font-weight:bold;
}
.dat { text-decoration:underline;}
H1{
font-family: Georgia, Arial, Helvetica, sans-serif;
font-size:18px;
font-weight:normal;
color: #ffffff;
padding: 16px 0px 0px 0px;
background: url(ftdflowered-images/tit_left.jpg) left top no-repeat;
height: 35px;
text-align:center;
}
#left .read_left{
text-align:right;
padding-right:20px;
color:#FFFFFF;
}
#right .read_right{
text-align:right;
padding-right:20px;
color:#7D0101;
}
.wite { color:#FFFFFF}
#right{
float:right;
width: 766px;
padding-bottom: 0px;
}
H2{
font-family: Georgia, Arial, Helvetica, sans-serif;
font-size:24px;
font-weight:normal;
color: #ffffff;
padding: 12px 0px 0px 16px;
background: url(ftdflowered-images/tit_right.jpg) left top no-repeat;
height: 31px;
text-align: left;
width:753px;
}
#top { background:url(ftdflowered-images/top.jpg) right top no-repeat;
width:383px;
height: 52px;
font-family:Georgia, "Times New Roman", Times, serif;
font-style:italic;
font-size:18px;
color:#FFFFFF;
padding: 18px 0px 0px 383px;
}
#left ul
{
list-style: none;
padding-left:5px;
margin: 0px;
display:block;
padding-bottom: 0px;
color:#7D0101;
padding-top:10px;
line-height:normal;
}
#left li{
padding-top: 8px;
background: url(ftdflowered-images/left_fish.png) 0px 9px no-repeat;
padding-left: 30px;
}
#left .munth {
color:#FFFFFF;
}
.munth li {padding-top:0px;
}
.left_razd { background:url(ftdflowered-images/left_razd.png) center no-repeat;
height:28px;
width:213px;}
#footer{
height: 50px;
width: 774px;
font-size: 10px;
color: #FFFFFF;
padding-top: 8px;
text-align: center;
clear:both;
padding: 15px 0px 13px 0px;
float:right;
}
#footer a{
color: #FFFFFF;
font-size: 10px;
text-decoration: none;
}
#footer a:hover{
color: #FFFFFF;
font-size: 10px;
text-decoration: underline;
}
</style>
</head>
<body>
<div id="futer">
<div id="menu">
<div id="left_bg">
<div id="main">
<div id="left">
<h1>Categories</h1>
<ul class="munth">
<li><a href="" class="wite">January 2009</a></li>
<li><a href="" class="wite">February 2009</a></li>
<li><a href="" class="wite">March 2009</a></li>
<li><a href="" class="wite">April 2009</a></li>
<li><a href="" class="wite">May 2009</a></li>
<li><a href="" class="wite">June 2009</a></li>
<li><a href="" class="wite">July 2009</a></li>
<li><a href="" class="wite">August 2009</a></li>
<li><a href="" class="wite">September 2009</a></li>
<li><a href="" class="wite">October 2009</a></li>
<li><a href="" class="wite">November 2009</a></li>
<li><a href="" class="wite">December 2009</a></li>
</ul><br />
<div class="left_razd"></div><br />
<h1>Latest News</h1>
<ul>
<li>Sed a dui vel erat molestie elementum.
<div class="read_left"><a href="#" class="wite">read more</a></div></li>
<li>Integer euismod massa id est pretium feugiat.
<div class="read_left"><a href="#" class="wite">read more</a></div></li>
<li>Sed a dui vel erat molestie elementum.
<div class="read_left"><a href="#" class="wite">read more</a></div></li>
<li>Integer euismod massa id est pretium feugiat.
<div class="read_left"><a href="#" class="wite">read more</a></div></li>
<li>Nullam vel elit nec felis pharetra blandit et ac nunc.
<div class="read_left"><a href="#" class="wite">read more</a></div></li>
</ul><br />
<div class="left_razd"></div><br />
</div>
<div id="right">
<div id="header">
<div id="top">Company Name Goes Here</div>
<div id="buttons">
<ul>
<li><a href="#" title="">Home</a></li>
<li><a href="#" title="">Blog</a></li>
<li><a href="#" title="">Gallery</a></li>
<li><a href="#" title="">About Us</a></li>
<li><a href="#" title="">Contact Us</a></li>
</ul>
</div>
</div>
<div id="right_content">
<h2>Etiam vel risus vel lectus fringilla aliquam</h2>
<div class="text">
<img src="ftdflowered-images/img1.jpg" width="168" height="113" class="img" alt="" />
<span>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</span> <br />
Nulla at augue metus. Vivamus vel porta est. Proin ullamcorper sodales tellus ac tempor. Sed sed
neque enim, sed dictum eros. Etiam vel risus vel lectus fringilla aliquam. Aliquam volutpat ante vel
purus molestie mollis. In ut velit nulla, non ullamcorper tortor. Quisque vitae odio ac lorem blandit
molestie eget id dui. Sed fringilla orci vel lacus suscipit pharetra. Aenean rhoncus sapien sit amet leo
malesuada sed laoreet massa venenatis. Vivamus dictum iaculis odio, non tristique quam...<br />
<div class="read_right"><a href="#">read more</a></div>
</div>
<div class="text">
<img src="ftdflowered-images/img2.jpg" width="168" height="113" class="img" alt="" />
<span>Curabitur orci ligula, vehicula eget mattis ac, posuere ac leo.</span> <br />
Maecenas porta mi at dolor tempus vitae fermentum mi laoreet. Nulla sit amet magna nec dolor plac
erat viverra. Aliquam erat volutpat. Duis a erat sed augue sodales interdum. Pellentesque habitant
morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nulla sit amet dui odio, at
blandit nulla. Aenean pharetra quam at felis facilisis non aliquet mi venenatis. Cras lacinia tempor
diam et eleifend. Nam adipiscing ultricies risus, sit amet aliquet sapien vulputate eget.... <br />
<div class="read_right"><a href="#">read more</a></div>
</div>
<div class="text">
<img src="ftdflowered-images/img3.jpg" width="168" height="113" class="img" alt="" />
<span>Cras adipiscing fringilla dolor non tincidunt.</span> <br />
Maecenas ac nibh nulla, sit amet dictum erat. Aliquam ultricies imperdiet placerat. Aenean a convallis
magna. Integer ut auctor nisl. Nulla ac risus et leo rutrum venenatis. Morbi sit amet gravida diam. In
consequat, tellus et tempor condimentum, felis felis facilisis turpis, at varius risus mi sit amet sem.
Proin sodales tristique quam nec iaculis. Suspendisse ante justo, tempor vitae fringilla eu, tincidunt
id nulla. Curabitur vestibulum ipsum id leo fermentum sit amet adipiscing dolor pharetra.... <br />
<div class="read_right"><a href="#">read more</a></div>
</div><br />
<h2>Free Website Templates</h2>
<div class="text2">
<span>Integer molestie accumsan mauris sit amet placerat.</span> <br />
Quisque nec sem tortor, eu venenatis ante. Proin et interdum ipsum. Nullam sed arcu bibendum arcu consectetur mattis quis at felis. Quisque condimentum imperdiet ultricies. Donec sed eros erat. Sed diam nibh, adipiscing ornare bibendum non, pulvinar ut magna. Sed varius hendrerit auctor. Aenean orci sapien, feugiat in rutrum eu, volutpat eget nulla. Pellentesque nec risus arcu. Vestibulum hendrerit risus in ante luctus a interdum velit gravida. Sed vitae ipsum libero, in accumsan lectus. Cras non arcu tellus. Vivamus vel eros vel lacus commodo pulvinar ac sit amet orci. Mauris aliquam egestas accumsan. <br /><br/>
Lorem ipsum dolor sit amet, consectetur adipiscing elit.<br />
Vivamus scelerisque leo non tellus facilisis ut consectetur ante ornare.<br />
Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.<br />
Maecenas molestie, metus eu ultrices adipiscing, lectus metus consectetur elit, eu sodales urna enim nec orci. <br /><br />
</div>
</div>
</div>
<!-- content ends -->
<!-- footer begins -->
<div id="footer">
Copyright 2011. Designed by <a href="http://www.flashtemplatesdesign.com/" title="Free Flash Templates">Free Flash Templates</a><br />
<a href="#">Privacy Policy</a> | <a href="#">Terms of Use</a> | <a href="http://validator.w3.org/check/referer" title="This page validates as XHTML 1.0 Transitional"><abbr title="eXtensible HyperText Markup Language">XHTML</abbr></a> | <a href="http://jigsaw.w3.org/css-validator/check/referer" title="This page validates as CSS"><abbr title="Cascading Style Sheets">CSS</abbr></a></div>
<!-- footer ends -->
</div>
<div style="clear: both"></div>
</div>
</div>
</div>
</body>
</html>
Related examples in the same category