/* @override 
	http://www.fleursflorist.co.uk/css/style.css
	http://localhost:8888/wessexnetworks/fleurs/templates/css/style.css
	http://localhost:8888/fleurs/templates/css/style.css
*/

body{
	font-size: 62.5%;
	font-family: Arial, Verdana, Helvetica, sans-serif;
	color: #332927;
}

/* @group general element styles */

*{
	margin: 0;
	padding: 0;
	font-size: 1.0em;
}

img{
	border: 0;
}

ul{
	list-style-position: outside;
	list-style: none;
}

li{
	list-style: none;
}

p{
	margin: 0.5em 0 1.0em 0;
}

a{
	color: #332927;
}

h1{
	font-size: 3.0em;
}

h2{
	font-size: 2.0em;
	margin: 0.5em 0;
}

h3{
	font-size: 1.4em;
	margin: 1.0em 0;
}

h4{
	font-size: 1.2em;
	margin: 0.5em 0;
}

textarea, input, select{
	font-size: 1.2em;
}

small{
	font-weight: normal;
}

h4 small{
	font-size: 0.833em;
}

h3 small{
	font-size: 0.714em;
}

textarea{
	height: 150px;
	width: 400px;
	overflow: auto;
	font-family: Arial, Verdana, Helvetica, sans-serif;
}

.clearboth{
	clear: both;
}

iframe{
	padding: 2px;
	border: 1px solid #d4d4d4;
	background: #fff;
}

/* @end */

/* @group Main Blocks */

#master{
	margin: 0px auto;
	width: 1000px;
}

/*have to include two extra divs for background image to display fully and be centralised to screen*/
#masterwrap{
	float:  left;
	background: #fff url(../images/back_gloriosafaded.png) no-repeat 300px 0px;
	padding: 20px 0 0 0;
	width: 100%;
}

#masterwraptwo{
	border: 1px solid #d6d6d6;
	padding: 30px 30px 12.0em 30px;
	float: left;
	width: 942px;
}

#homepage #masterwrap{
	background: NONE;
}

#homepage #masterwraptwo{
	background: #fff url(../images/back_gloriosahome.jpg) no-repeat 300px 0px;
}

#header{
	position: relative;
	width: 100%;
}

#content{
	padding: 3.0em 0 1.0em 0;
	width: 100%;
	clear: both;
}

#colleft{
	width: 190px;
	float: left;
}

#colmain{
	margin-left: 28px;
	float: left;
	width: 722px;
}

#footer{
	clear: both;
	padding: 1.0em 0 300px 0;
}

/* @end */

/* @group Header */

#header h1{
	width: 436px;
	float: left;
	height: 70px;
	background: url(../images/logo_fleurs.gif) no-repeat;
	text-indent: -9999em;
	margin: 0 0 3.0em 0;
	font-size: 1.0em;
}

#header #contactdetails{
	float: right;
	width: 240px;
	
}

#header address{
	font-style: normal;
}

#header address, #header p{
	margin: 0;
	line-height: 1.4em;
	text-align: right;
	font-size: 1.1em;
}

/*IE6: have to add height and not just float - spacing issues.*/
#header ul{
	width: 100%;
	height: 28px;
	background: url(../images/back_navline.gif) 360px 24px no-repeat; 
	clear: both;
}

#header li{
	float: left;
}

#header ul li a{
	width: 110px;
	height: 24px;
	float: left;
	border-bottom: 3px solid #d4d4d4;
	margin-right: 10px;
	text-indent: -9999em;
	background-position: top left;
}

#header ul li a:hover{
	border-color: #332927;
}

#header ul li.active a{
	border-color: #332927;
}

#header ul li.active a:hover{
	border-color: #332927;
	background-position: top left;
}

#header ul li.home a{
	background: url(../images/menu_home.gif) no-repeat;
}

#header ul li.shop a{
	background: url(../images/menu_shop.gif) no-repeat;
}

#header ul li.contact a{
	background: url(../images/menu_contact.gif) no-repeat;
}

#header ul.submenu{
	width: 100%;
	height: 21px;
	background: none; 
	clear: both;
	margin-top: 0.7em;	
}

#header ul.submenu li a{
	height: 21px;
	float: left;
	border-bottom: none;
	margin: 0 4px 0 0;
	text-indent: -9999em;
}

#header ul.submenu li.aboutus a{
	background: url(../images/menu_aboutus.gif) no-repeat top left;
	width: 69px;
}

#header ul.submenu li.bouquets a{
	background: url(../images/menu_bouquets.gif) no-repeat top left;
	width: 66px;
}

#header ul.submenu li.yearlyoccasions a{
	background: url(../images/menu_yearlyoccasions.gif) no-repeat;
	width: 114px;
}

#header ul.submenu li.romanticroses a{
	background: url(../images/menu_romanticroses.gif) no-repeat;
	width: 107px;
}

#header ul.submenu li.newbabyflowers a{
	background: url(../images/menu_newbabyflowers.gif) no-repeat;
	width: 120px;
}

#header ul.submenu li.funkyflowersandplants a{
	background: url(../images/menu_funkyflowersandplants.gif) no-repeat;
	width: 161px;
}

#header ul.submenu li.funeralflowers a{
	background: url(../images/menu_funeralflowers.gif) no-repeat;
	width: 102px;
}

#header ul.submenu li.weddingflowers a{
	background: url(../images/menu_weddingflowers.gif) no-repeat;
	width: 115px;
}

#header ul.submenu li.contractvases a{
	background: url(../images/menu_contractvases.gif) no-repeat;
	width: 93px;
}
#header ul.submenu li.active a, #header ul.submenu li a:hover{
	background-position: top right;
}

/* @end */

/* @group Col Left */

#colleft #shoppingcart, #colleft #featuredfleurs .wrap{
	background-color: #EEECEC;
	padding: 1.0em 9px 2.0em 10px;
	margin-bottom: 1.0em;
}

#colleft #shoppingcart{
	background: #EEECEC url(../images/back_sideboxbottom.gif) repeat-x bottom;
}

#colleft #shoppingcart.filled{
	padding-bottom: 0;
}

#colleft #shoppingcart h3, #colleft #featuredfleurs h3{
	background: url(../images/back_greyseparator01.gif) bottom repeat-x;
	margin: 0.25em 0 1.0em 0;
	padding-bottom: 1.0em;
	text-align: center;
	font-family: 'century gothic', arial, helvetica, sans-serif ;
	font-weight: normal;
}

#colleft p{
	font-size: 1.1em;
	line-height: 1.6em;
}

#colleft #shoppingcart{
	border: 1px solid #D4D1D1;
}

#colleft #cartdetails{
	border:  1px solid #dadada;
	padding: 10px;
	margin-bottom: 1.0em;
}

#colleft label, #colleft p.subtotal, #colleft p.total, #colleft #updatecart{
	font-size: 1.1em;
}

#colleft label{
	float: left;
	width: 110px;
	text-align: right;
}

#colleft .item input{
	width: 30px;
	float: right;
}

#colleft p.subtotal{
	text-align: right;
}

#colleft p.total{
	text-align: right;
	font-weight: bold;
}

#colleft p.total{
	text-align: right;
}

#colleft #updatecart{
	text-align: right;
}

#colleft #updatecart a{
	background: url(../images/button_updatecart.gif) right no-repeat;
	padding: 3px 20px 3px 0;
	text-decoration: none;
}

#colleft #featuredfleurs{
	background: url(../images/back_featuredsides.gif) repeat-y;	
}

#colleft #featuredfleurs .wrap{
	background: url(../images/back_featuredbottom.gif) no-repeat bottom;
	border-top: 1px solid #d4d4d4;
	padding-bottom: 7.0em;
}

#colleft #featuredfleurs img{
	width: 165px;
	padding: 2px;
	border: 1px solid #d4d4d4;
	background: #fff;
}

#colleft h4{
	font-size: 1.8em;
	font-weight: normal;
	text-align: center;
	margin: 0.75em 0;
}

#colleft a.buttonlight{
	font-size: 1.2em;
	text-decoration: none;
	padding: 0.65em 10px;
	text-align: right;
	background: #fff;
	border: 1px solid #b4b4b4;
	float: right;
	background: #fff url(../images/back_buttonlight.gif) bottom repeat-x;
}

/* @end */

#content.home #colmain{
	margin-top: 70px;
	width: 380px;
}

#colmain h2#flowerswithstyle{
	background: url(../images/text_flowerswithstyle.gif) no-repeat;
	text-indent: -9999em;
	height: 38px;
	width: 279px;
}

#colmain .optionbilling{
	width:25px; display:block; text-align:left; float:left;
}
#colmain .optionbilling2 {
	font-size:12px;display:block; text-align:left;
font-family: 'century gothic', arial, helvetica, sans-serif ;
}

#colmain h2#bouquets{
	background: url(../images/text_bouquets.gif) no-repeat;
	text-indent: -9999em;
	height: 38px;
	width: 151px;
}

#colmain h2.titlecat{
	text-indent: -9999em;
	height: 38px;
	margin-top: 0;
}

#colmain h2#romanticroses{
	background: url(../images/text_romanticroses.gif) no-repeat;
	width: 209px;
}

#colmain h2#yearlyoccasions{
	background: url(../images/text_yearlyoccasions.gif) no-repeat;
	width: 221px;
}

#colmain h2#funkyflowersandplants{
	background: url(../images/text_funkyflowersandplants.gif) no-repeat;
	width: 324px;
}

#colmain h2#newbabyflowers{
	background: url(../images/text_newbabyflowers.gif) no-repeat;
	width: 238px;
}

#colmain h2#funeralflowers{
	background: url(../images/text_funeralflowers.gif) no-repeat;
	width: 200px;
}

#colmain h2#weddingflowers{
	background: #fff url(../images/text_weddingflowers.jpg) no-repeat 6px 6px;
	text-indent: -9999em;
	height: 380px;
	width: 710px;
	padding: 6px;
	border: 1px solid #ededed;
	margin: 0;
}

#colmain h2#contractvases{
	background: url(../images/text_contractvases.jpg) no-repeat 6px 6px;
	text-indent: -9999em;
	height: 380px;
	width: 710px;
	padding: 6px;
	border: 1px solid #ededed;
	margin: 0;
}


#colmain h2#contactus{
	background: url(../images/text_contactus.gif) no-repeat;
	width: 145px;
}

#colmain h2#thankyou{
	background: url(../images/text_thankyou.gif) no-repeat;
	width: 163px;
}

#colmain h2#sorry{
	background: url(../images/text_sorry.gif) no-repeat;
	width: 86px;
}

#colmain p{
	font-family: 'century gothic', arial, helvetica, sans-serif ;
	font-size: 1.4em;
	line-height: 1.7em;
}

#colmain img.static{
	padding: 6px;
	border: 1px solid #ededed;
	margin: 0;
}

.exampleimg{
	width: 710px;
	border: 1px solid #ededed;
	float: left;
	padding: 5px 0 5px 5px;
	background: #fff;
}

.exampleimg img{
	float: left;
	margin-right: 5px;
}

/* @group Category */

#colmain ul#categoryitems{
	border-top: 1px solid #ededed;
	width: 500px;
}

#colmain ul#categoryitems li{
	clear: both;
	padding: 2.0em 0;
}

#colmain ul#categoryitems li a{
	text-decoration: none;
}

#colmain ul#categoryitems h3{
	margin:  0 0 0 20px;
	float: left;
	font-size: 1.8em;
	width: 270px;
	margin:  0 0 0 20px;
}

#colmain ul#categoryitems img{
	padding: 2px;
	border: 1px solid #ededed;
	background: #fff;
	float: left;
}

/* @end */

/* @group Product */

#colmain .bigimg{
	padding: 6px;
	border: 1px solid #ededed;
	background: #fff;
}

#colmain h2.producttitle{
	font-size: 3.0em;
	font-weight: normal;
	margin-bottom: 0;
}

#colmain form#product .section{
	padding-top: 1.5em;
	clear: both;
	width: 100%;
}

#colmain form#product .section.first{
	border-top:  1px solid #e3e3e3;
}

#colmain form#product .section .variations .divider{
	margin: 0;
	padding: 0;
}


#colmain form#product .left{
	margin: 0em 5px 0 0;
	width: 120px;
	text-align: right;
	font-weight: bold;
}

#colmain form#product .varations{
	width: 260px;
	float: left;
	font-family: 'century gothic', arial, helvetica, sans-serif ;
}

#colmain form#product .otheroptions{
	clear: both;
}

#colmain form#product .varations input{
	clear: both;
	float: left;
}

#colmain form#product .varations input, #colmain form#product .varations label{
	margin: 0em 5px 0em 0;
}

#colmain form#product .varations div{
	margin: 0 0 0.5em 0;
	float: left;
	clear: both;
	width: 280px;
}

#colmain form#product label{
	float: left;
	width: 250px;
}

#colmain form#product input{
	display: block;
}

#colmain form#product #quantity{
	width: 30px;
	float: left;
}

#colmain form#product p{
	color: #999;
	margin: 0 0 1.0em 0;
}

#colmain form#product #cards{
	float: left;
}

#colmain label p{
	font-size: 1.2em;
}

#colmain form#product p.giftcards{
	width: 390px;
	float: left;
	margin: 3px 0 0 5px;
	line-height: 1.1em;
	font-size: 1.2em;
	color: #332927;
}

#colmain form#product small{
	font-size: 0.9em;
}

#colmain form#product .specialcards{
	float: left;
	margin: 1.0em 0 0 125px;
	clear: both;
	display: inline;
	width: ;
}

#colmain form#product input.button{
	clear: both;
	margin: 2.0em 0 1.0em 122px;
	top: 2.0em;
	position: relative;
	float: none;
}

#colmain h2#orderdetails{
	background: url(../images/text_orderdetails.gif) no-repeat;
	text-indent: -9999em;
	height: 30px;
	width: 163px;
	margin: 0 0 1.0em 0;
}

#colmain .sectiondetails, #colmain #sectionoptions{
	border-top: 1px solid #ededed;
	margin-top: 1.0em;
	width: 600px;
	float: left;
}

#colmain .sectiondetails h2#recipientsdetails{
	background: url(../images/text_recipientsdetails.gif) no-repeat;
	text-indent: -9999em;
	height: 30px;
	width: 227px;
	margin: 1.5em 0 1.0em 0;
}

#colmain .sectiondetails h2#billingdetails{
	background: url(../images/text_billingdetails.gif) no-repeat;
	text-indent: -9999em;
	height: 30px;
	width: 186px;
	margin: 1.5em 0 1.0em 0;
}

#colmain #sectionoptions h2{
	background: url(../images/text_deliveryoptions.gif) no-repeat;
	text-indent: -9999em;
	height: 30px;
	width: 202px;
	margin: 1.5em 0 ;
}

#colmain #sectionoptions select{
	width: 70px;
}

/* @end */

/* @group Checkout */

#colmain table{
	font-size: 1.2em;
	border-collapse: collapse;
	text-align: left;
}

#colmain table tr.spacer{
	height: 0.5em;
	float: left;
	border: 0;
	
}


#colmain table tr td{
	background: #f9f9f9;
	border: 1px solid #d4d4d4;
	font-family: 'century gothic', arial, helvetica, sans-serif;
	padding: 4px;
	
}

#colmain thead .item{
	width: 250px;
	padding-bottom: 0.5em;
}

#colmain thead .variation{
	width: 340px;
}

#colmain table .giftcards{
	width: 100px;
}

#colmain table input{
	width: 30px;
}

#colmain table .quantity{
	width: 80px;
}

#colmain table .cost{
	width: 80px;
}

#colmain label{
	font-size: 1.2em;
}

#colmain #updatesubtotal p{
	float: left;
	font-family: Arial, Verdana, Helvetica, sans-serif;	
	background: url(../images/button_updatecart02.gif) no-repeat right;
	padding-right: 20px;
	margin: 1.0em 0;
}

#colmain #updatesubtotal h3{
	float: right;
	font-size: 2.0em;
}

#colmain .sectiondetails label{
	float: left;
	font-weight: bold;
	width: 90px;
	text-align: right;
	margin: 3px 5px 0 0 ;
}

#colmain .sectiondetails input{
	float: left;
	display: block;
	width: 200px;
}


#colmain .divider, #colmain .divider{
	clear: both;
	margin: 0.5em 0;
	float: left;
	width: 100%;
}

#colmain .sectiondetails .containerinput{
	float: left;
	width: 210px;
	clear: none;
	padding: 0;
}

#colmain .sectiondetails .containerinput{
}

#colmain .sectiondetails .containerinput input{
	margin: 0 0 0.5em 0;
	clear: left;
	float: left;
	width: 200px;
}

#colmain .sectiondetails .containerinput input.address.last{
	margin: 0;
}

#colmain #sectionoptions{
	font-family: 'century gothic', arial, helvetica, sans-serif;
}

#colmain #sectionoptions input{
	float: left;
	margin-right: 5px;
}

#colmain #sectionoptions label{
	float: left;
	width: 550px
}

#colmain #sectionoptions label small{
	font-size: 0.85em;
}

#colmain #sectionoptions p{
	margin: 1.5em 0 0.5em 0;
	float: left;
	width: 100%;
}

#colmain p.mandatory{
	clear: both;
	padding: 1.0em 0;
	font-size: 1.2em;
}

#colmain #sectionoptions textarea#extradetails{
	clear: both;

}

#colmain #datetime{
	margin: 1.0em 0 0 0;
	float: left;
	width: 100%;
}

#colmain #sectionoptions #datetime label{
	display: block;
	width: auto;
	margin-right: 5px;
	font-family: Arial, Verdana, Helvetica, sans-serif;	
	font-weight: bold;
	text-align: right;
}

#colmain #datetime select{
	margin: 0 2px;
}

#colmain h3#total{
	clear: both;
	width: 100%;
	float: left;
	font-size: 2.0em;
}

#colmain #checkout{
	float: left;
	clear: left;
}

#colmain address{
	font-size: 1.2em;
	font-style: normal;
	width: 100%;
}

/* @end */

/* @group Footer */

#footer{
	font-size: 1.2em;
}

#footer, #footer a{
	color: #767676;
}

#footer a:hover{
	color: #332927;
}


#footer ul{
	clear: both;
	display: inline;
	line-height: 1.6em;
}

#footer ul li{
	display: inline;
}

#footer ul li ul{
	display: inline;
}

#footer ul li ul li{
	margin: 0 2px;
}

/* @end */

/* @group Extrinfo */

#masterextra{
	margin: 10px 10px 400px 10px;
}

#masterextra h3{
	margin: 1.0em 0 0 0;
	}

#masterextra p{
	font-family: 'century gothic', arial, helvetica, sans-serif;
	font-size: 1.4em;
	}
	
#masterextra img{
	display: block;
	padding: 2px;
	margin: 5px;
	border: 1px solid #ededed;
	}

/* @end */