flower-shop
<!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>Flower Shop - About</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252" />
<style type='text/css'>
body
{
background-color:#c0c0c0;
font-family:Arial, Helvetica, sans-serif;
padding:0;
font-size:12px;
margin:0px auto auto auto;
color:#000000;
}
a{
color:#990000;
}
.clear{
clear:both;
}
p{
padding:5px 0 5px 0;
margin:0px;
text-align:justify;
line-height:19px;
}
p.details{
padding:5px 15px 5px 15px;
font-size:11px;
}
p.details_cart{
clear:both;
padding:25px 30px 5px 0px;
font-size:11px;
font-style:italic;
}
p.more_details{
padding:25px 20px 0px 20px;
font-size:11px;
}
#wrap{
width:900px;
height: auto;
margin:auto;
background-color:#FFFFFF;
}
.header{
width:900px;
height:181px;
background:url(flower-shop-images/header.jpg) no-repeat center;
}
.logo{
padding:0 0 0 30px;
}
/*-----------------------------menu-------------------*/
#menu{
width:628px;
height:41px;
margin:55px 0 0 26px;
background:url(flower-shop-images/menu_bg.jpg) no-repeat center;
}
#menu ul{
display:block;
list-style:none;
padding:9px 0 0 10px;
margin:0px;
}
#menu ul li{
display:inline;
padding:0px;
margin:0px;
height:27px;
}
#menu ul li a{
height:27px;
display:block;
padding:0px 10px 0 10px;
margin:0 4px 0 4px;
_margin:0 2px 0 2px;
float:left;
text-decoration:none;
text-align:center;
color:#fff;
font-size:13px;
line-height:27px;
}
#menu ul li.selected a{
height:27px;
display:block;
padding:0px 10px 0 10px;
margin:0 5px 0 5px;
float:left;
text-decoration:none;
text-align:center;
color:#fff;
font-size:13px;
line-height:27px;
background:url(flower-shop-images/menu_bt_bg.gif) repeat-x center;
}
#menu ul li a:hover{
background:url(flower-shop-images/menu_bt_bg.gif) repeat-x center;
}
/*----------------crumb_nav------------------*/
.crumb_nav{
padding:5px 0 10px 0px;
}
.crumb_nav a{
color:#990000;
}
span.red{
color:#990000;
}
.price{
font-size:14px;
padding:0 0 0 15px;
margin:2px 0 5px 0;
}
span.colors{
padding:2px 2px 0 2px;
}
/*------------------------------------center content--------------------*/
.center_content{
width:900px;
padding:0px 0 0 0;
background:url(flower-shop-images/center_bg.gif) repeat-y center;
}
.left_content{
width:490px;
float:left;
padding:20px 0 20px 20px;
}
.right_content{
width:370px;
float:left;
padding:20px 0 20px 20px;
}
.title{
color:#a81f22;
padding:0px;
float:left;
font-size:19px;
margin:10px 0 10px 0;
}
span.title_icon{
float:left;
padding:0 5px 0 0;
}
.prod_title{
color:#a81f22;
padding:5px 0 0 15px;
font-size:13px;
}
a.more{
font-style:italic;
color:#a81f22;
float:right;
text-decoration:none;
font-size:11px;
padding:0px 15px 0 0 ;
}
.about{
width:337px;
clear:both;
background:url(flower-shop-images/border.gif) no-repeat bottom center;
padding:0 0 20px 0;
}
img.right{
float:right;
padding:0 0 0 10px;
}
.right_box{
width:170px;
float:left;
padding:10px 0 0 0;
}
/*--------feat_prod_box-----------*/
.feat_prod_box{
padding:10px 0 10px 0;
margin:0 20px 20px 0;
border-bottom:1px #b2b2b2 dashed;
clear:both;
}
.feat_prod_box_details{
padding:10px 0 10px 0;
margin:0 20px 10px 0;
clear:both;
}
.prod_img{
float:left;
padding:0 5px 0 0;
text-align:center;
}
.prod_det_box{
width:295px;
float:left;
padding:0 0 0 15px;
position:relative;
}
.box_top{
width:295px;
height:9px;
background:url(flower-shop-images/box_top.gif) no-repeat center bottom;
}
.box_center{
width:295px;
height:auto;
background:url(flower-shop-images/box_center.gif) repeat-y center;
}
.box_bottom{
width:295px;
height:9px;
background:url(flower-shop-images/box_bottom.gif) no-repeat center top;
}
.new_prod_box{
float:left;
text-align:center;
padding:10px;
}
.new_prod_box a{
padding:5px 0 5px 0;
color:#b5b5b6;
text-decoration:none;
display:block;
}
.new_prod_bg{
width:132px;
height:119px;
text-align:center;
background:url(flower-shop-images/new_prod_box.gif) no-repeat center;
position:relative;
}
.new_icon{
position:absolute;
top:0px;
right:0px;
z-index:200;
}
.special_icon{
position:absolute;
top:0px;
_top:6px;
right:2px;
z-index:250;
}
img.thumb{
padding:10px 0 0 0;
}
.new_products{
clear:both;
padding:0px;
}
ul.list{
clear:both;
padding:10px 0 0 20px;
margin:0px;
}
ul.list li{
list-style:none;
padding:2px 0 2px 0;
}
ul.list li a{
list-style:none;
text-decoration:none;
color:#000000;
background:url(flower-shop-images/left_menu_bullet.gif) no-repeat left;
padding:0 0 0 17px;
}
ul.list li a:hover{
text-decoration:underline;
}
/* demo */
div.demolayout {
width:460px;
margin: 0 0 20px 0;
}
ul.demolayout {
list-style-type: none;
float: left;
margin:0px;
padding:0px;
}
ul.demolayout li {
margin: 0 10px 0 0;
float: left;
}
.tab{
border:1px #DFDFDF solid;
padding:0 0 25px 0;
}
ul.demolayout a {
float: left;
display: block;
padding: 5px 25px;
border: 1px solid #DFDFDF;
border-bottom: 0;
color: #666;
background: #eee;
text-decoration: none;
font-weight: bold;
}
ul.demolayout a:hover {
background: #fff;
}
ul.demolayout a.active {
background: #fff;
padding-bottom: 5px;
cursor: default;
color:#931A1D;
}
.tabs-container {
clear: left;
padding:0px;
}
/*-----------------------languages_box---------*/
.languages_box{
padding:0 0 5px 0;
float:left;
}
.languages_box a{
padding:0 2px 0 2px;
}
.languages_box a.selected{
padding:2px 2px 0 2px;
border:1px #CCCCCC solid;
}
.currency{
float:left;
padding:0 0 0 20px;
}
.currency a{
text-decoration:none;
color:#333333;
padding:3px;
border:1px #eeedee solid;
}
.currency a.selected{
text-decoration:none;
color:#fff;
padding:3px;
border:1px #eeedee solid;
background-color:#FF9900;
font-weight:bold;
}
.currency a:hover{
border:1px #990000 solid;
}
/*------------------------cart---------------------*/
.cart{
width:337px;
float:left;
height:40px;
margin:10px 0 10px 0;
background:url(flower-shop-images/border.gif) no-repeat bottom center;
padding:0 0 20px 0;
}
.home_cart_content{
float:left;
padding:3px;
border:1px #eeedee solid;
margin:10px 0 0 15px;
}
a.view_cart{
display:block;
float:left;
margin:12px 0 0 10px;
color:#990000;
}
/*---------------contact_form------------------*/
.contact_form{
width:355px;
float:left;
padding:25px;
margin:20px 0 0 15px;
_margin:20px 0 0 5px;
border:1px #DFD1D2 dashed;
position:relative;
}
.form_row{
width:335px;
_width:355px;
clear:both;
padding:10px 0 10px 0;
_padding:5px 0 5px 0;
color:#a53d17;
}
label.contact{
width:75px;
float:left;
font-size:12px;
text-align:right;
padding:4px 5px 0 0;
color: #333333;
}
input.contact_input{
width:253px;
height:18px;
background-color:#fff;
color:#999999;
border:1px #DFDFDF solid;
float:left;
}
textarea.contact_textarea{
width:253px;
height:120px;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color: #999999;
background-color:#fff;
border:1px #DFDFDF solid;
float:left;
}
input.register{
width:71px;
height:25px;
border:none;
cursor:pointer;
text-align:center;
float:right;
color:#FFFFFF;
background:url(flower-shop-images/register_bt.gif) no-repeat center;
}
a.contact{
width:53px;
height:24px;
display:block;
float:right;
margin:0 0 0 10px;
background:url(flower-shop-images/contact_bt.gif) no-repeat center;
text-decoration:none;
text-align:center;
line-height:24px;
color:#fff;
}
a.checkout{
width:71px;
height:25px;
display:block;
float:right;
margin:10px 30px 0 10px;
background:url(flower-shop-images/register_bt.gif) no-repeat center;
text-decoration:none;
text-align:center;
line-height:25px;
color:#fff;
}
a.continue{
width:71px;
height:25px;
display:block;
float:left;
margin:10px 0 0 0px;
background:url(flower-shop-images/register_bt.gif) no-repeat center;
text-decoration:none;
text-align:center;
line-height:25px;
color:#fff;
}
.terms{
padding:0 0 0 80px;
}
.form_subtitle{
position:absolute;
top:-11px;
left:7px;
width:auto;
height:20px;
background-color:#990000;
text-align:center;
padding:0 7px 0 7px;
color:#FFFFFF;
font-size:11px;
line-height:20px;
}
/*--------------cart_table-------------*/
.cart_table{
width:440px;
border:1px #CCCCCC solid;
text-align:center;
}
tr.cart_title{
background-color:#DFDFDF;
}
td{
padding:3px;
}
td.cart_total{
text-align:right;
padding:5px 15px 5px 0;
}
img.cart_thumb{
border:1px #b2b2b2 solid;
padding:2px;
}
/*--------------*/
div.pagination {
width:420px;
padding:5px;
margin:5px;
text-align:center;
float:left;
clear:both;
font-size:10px;
}
div.pagination a {
padding: 2px 5px 2px 5px;
margin-right: 2px;
border: 1px solid #ddd;
text-decoration: none;
color: #990000;
}
div.pagination a:hover, div.pagination a:active {
border:1px solid #990000;
color: #fff;
background-color: #990000;
}
div.pagination span.current {
padding: 2px 5px 2px 5px;
margin-right: 2px;
border: 1px solid #990000;
font-weight: bold;
background-color: #990000;
color: #FFF;
}
div.pagination span.disabled {
padding: 2px 5px 2px 5px;
margin-right: 2px;
border: 1px solid #f3f3f3;
color: #ccc;
}
/*---------------footer------------------------*/
.footer{
height:100px;
border-top:1px #b2b2b2 dashed;
background:url(flower-shop-images/footer_bg.gif) no-repeat bottom;
}
.left_footer{
float:left;
padding:10px 0 0 10px;
}
.right_footer{
float:right;
padding:10px 10px 0 0;
}
.footer a{
text-decoration:none;
padding:0 5px 0 5px;
color:#afaeaf;
}
</style>
</head>
<body>
<div id="wrap">
<div class="header">
<div class="logo"><a href="http://www.free-css.com/"><img src="flower-shop-images/logo.gif" alt="" border="0" /></a></div>
<div id="menu">
<ul>
<li><a href="http://www.free-css.com/">home</a></li>
<li class="selected"><a href="about.html">about us</a></li>
<li><a href="category.html">flowers</a></li>
<li><a href="specials.html">specials gifts</a></li>
<li><a href="myaccount.html">my accout</a></li>
<li><a href="register.html">register</a></li>
<li><a href="details.html">prices</a></li>
<li><a href="contact.html">contact</a></li>
</ul>
</div>
</div>
<div class="center_content">
<div class="left_content">
<div class="title"><span class="title_icon"><img src="flower-shop-images/bullet1.gif" alt="" /></span>About us</div>
<div class="feat_prod_box_details">
<p class="details"> <img src="flower-shop-images/about.gif" alt="" class="right" /> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud. <br />
<br />
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud.<br />
<br />
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud. </p>
</div>
<div class="clear"></div>
</div>
<!--end of left content-->
<div class="right_content">
<div class="languages_box"> <span class="red">Languages:</span> <a href="http://www.free-css.com/"><img src="flower-shop-images/gb.gif" alt="" border="0" /></a> <a href="http://www.free-css.com/"><img src="flower-shop-images/fr.gif" alt="" border="0" /></a> <a href="http://www.free-css.com/"><img src="flower-shop-images/de.gif" alt="" border="0" /></a> </div>
<div class="currency"> <span class="red">Currency: </span> <a href="http://www.free-css.com/">GBP</a> <a href="http://www.free-css.com/">EUR</a> <a href="http://www.free-css.com/"><strong>USD</strong></a> </div>
<div class="cart">
<div class="title"><span class="title_icon"><img src="flower-shop-images/cart.gif" alt="" /></span>My cart</div>
<div class="home_cart_content"> 3 x items | <span class="red">TOTAL: 100$</span> </div>
<a href="http://www.free-css.com/" class="view_cart">view cart</a> </div>
<div class="title"><span class="title_icon"><img src="flower-shop-images/bullet3.gif" alt="" /></span>About Our Shop</div>
<div class="about">
<p> <img src="flower-shop-images/about.gif" alt="" class="right" /> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud. </p>
</div>
<div class="right_box">
<div class="title"><span class="title_icon"><img src="flower-shop-images/bullet4.gif" alt="" /></span>Promotions</div>
<div class="new_prod_box"> <a href="http://www.free-css.com/">product name</a>
<div class="new_prod_bg"> <span class="new_icon"><img src="flower-shop-images/promo_icon.gif" alt="" /></span> <a href="http://www.free-css.com/"><img src="flower-shop-images/thumb1.gif" alt="" class="thumb" border="0" /></a> </div>
</div>
<div class="new_prod_box"> <a href="http://www.free-css.com/">product name</a>
<div class="new_prod_bg"> <span class="new_icon"><img src="flower-shop-images/promo_icon.gif" alt="" /></span> <a href="http://www.free-css.com/"><img src="flower-shop-images/thumb2.gif" alt="" class="thumb" border="0" /></a> </div>
</div>
<div class="new_prod_box"> <a href="http://www.free-css.com/">product name</a>
<div class="new_prod_bg"> <span class="new_icon"><img src="flower-shop-images/promo_icon.gif" alt="" /></span> <a href="http://www.free-css.com/"><img src="flower-shop-images/thumb3.gif" alt="" class="thumb" border="0" /></a> </div>
</div>
</div>
<div class="right_box">
<div class="title"><span class="title_icon"><img src="flower-shop-images/bullet5.gif" alt="" /></span>Categories</div>
<ul class="list">
<li><a href="http://www.free-css.com/">accesories</a></li>
<li><a href="http://www.free-css.com/">flower gifts</a></li>
<li><a href="http://www.free-css.com/">specials</a></li>
<li><a href="http://www.free-css.com/">hollidays gifts</a></li>
<li><a href="http://www.free-css.com/">accesories</a></li>
<li><a href="http://www.free-css.com/">flower gifts</a></li>
<li><a href="http://www.free-css.com/">specials</a></li>
<li><a href="http://www.free-css.com/">hollidays gifts</a></li>
<li><a href="http://www.free-css.com/">accesories</a></li>
<li><a href="http://www.free-css.com/">flower gifts</a></li>
<li><a href="http://www.free-css.com/">specials</a></li>
</ul>
<div class="title"><span class="title_icon"><img src="flower-shop-images/bullet6.gif" alt="" /></span>Partners</div>
<ul class="list">
<li><a href="http://www.free-css.com/">accesories</a></li>
<li><a href="http://www.free-css.com/">flower gifts</a></li>
<li><a href="http://www.free-css.com/">specials</a></li>
<li><a href="http://www.free-css.com/">hollidays gifts</a></li>
<li><a href="http://www.free-css.com/">accesories</a></li>
<li><a href="http://www.free-css.com/">flower gifts</a></li>
<li><a href="http://www.free-css.com/">specials</a></li>
<li><a href="http://www.free-css.com/">hollidays gifts</a></li>
<li><a href="http://www.free-css.com/">accesories</a></li>
</ul>
</div>
</div>
<!--end of right content-->
<div class="clear"></div>
</div>
<!--end of center content-->
<div class="footer">
<div class="left_footer"><img src="flower-shop-images/footer_logo.gif" alt="" /><br />
<a href="http://csscreme.com"><img src="flower-shop-images/csscreme.gif" alt="" border="0" /></a></div>
<div class="right_footer"> <a href="http://www.free-css.com/">home</a> <a href="http://www.free-css.com/">about us</a> <a href="http://www.free-css.com/">services</a> <a href="http://www.free-css.com/">privacy policy</a> <a href="http://www.free-css.com/">contact us</a> </div>
</div>
</div>
</body>
</html>
Related examples in the same category