/* For the shopfront.php page only  */
.clearfix:after {   														/*  Clearfix added by Gregory May 7 */
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

body {
	font-family: Helvetica, Arial, 'Times New Roman',Times, Arial, serif; 
}

#link_menu2  {
	margin: 5px 0 0px 0;
	clear: both;
	font-size: 1em;
	font-weight: 500;
	padding: 5px 1% 0px 1%;
	}	
.menu2_item1, .menu2_item2, .menu2_item3 {
	text-align: center;
	float: left;
	font-size: 1.1em;
	background-color: white;
	margin: 0 4.5%;
	padding: .05em 1% 0em;
	border: 1px solid #CCCCCC;
	width: 16%;  /*  Centre is larger but set in the code */
	}
 .menu2_item2 {
 	width: 33%;
	}	
	
#link_menu2 a {		
	color: #CC3333;
	}

#welcome {		
	margin: 0 1% 0px;
	text-align: center;
	font-size: 95%; 
	color: #006A00;
	font-weight: normal;
	padding: 0;
}
#welcome h1{
	font-size: 1.35em;
}

#welcome h2{
	font-size: 1.35em;
}

#welcome h3{
	font-size: 1.2em;
	font-weight: 700;
	padding: 0 0px;
	margin: 10px;
	
}

#welcome ul{
	margin: 0;
	padding: 0 0 0 2%;
	text-align: left;
	}
#welcome ul li{
	margin: 0px 0;
	}


#news_flash {			/*  Not normally there, only for emergencies */
	margin: .9em 10%;
	text-align: center;
	font-size: 1.2em;
	color:#006633;
}
#news_flash h1{
	font-size: 120%;
}

#sub_header_content{
	padding: 0px ;
	border: none;
}

.whole_box a:link, .whole_box a:visited,  .quarter_box a:link, .quarter_box a:visited  {
	font-weight: bold;
	color: brown;
	}

.quarter_box, .whole_box {
	padding: 0px;
	margin: 0px;
	background-repeat: no-repeat;	
}


.quarter_box, .whole_box, .double_box {
	overflow: hidden; 
	float: left;
	cursor: pointer;
}

.whole_box {									/* The outer edge.  Border will go on the div _inside_ these outer ones.  */
	width: 230px;								/*  Update children too.  Don't forget that it'll be 232 if using 1px border. */
	}


.double_box, .whole_box {
	height: 210px;								/* The outer edge.  Border will go on the div _inside_ these outer ones.  */
	border: none;
	margin: 0 0 10px 10px;			/* Update .double box's size when changing l or r margins. */
	}

.quad_box{
	float: left;
	width: 230px;      /* 230 + borders of large_box. */
	height: 210px;		/* Adding height of borders top & bottom. */
}

.double_box {
	width: 230px;		/* .whole_box x 2 + margin + 2 x 1px border & update JS */
	}
.double_box img{
	margin:0;
	padding: 0;
	text-align:left;
}
.double_box p{
	padding: 0;
	margin: 18px 10px;
	text-align: center;
	vertical-align: middle;
	}

div.q1, div.q2, div.q3, div.q4 {
 margin: 0;
 padding: 0;
 
}
div.q1 {
	float: left;
	margin: 0 5px 10px 0;
}	
	
div.q2 {
	float: right;
	margin: 0 0 10px 0;
}	
	
div.q3 {
	margin: 0 5px 0 0;
	float: left;
}	
	
div.q4 {
	margin: 0 0px 0 5px;
	float: right;
}	

.whole_box table, .quarter_box table {
	border: none; 
	background-position: bottom; 
	border-collapse: collapse; 
	border-style: hidden; 
	border: 0px solid blue; 
}


.whole_box table {
	height: 210px;
	width: 230px;
}

.whole_box .quarter_box table {

	width: 110px;
	height: 100px;
}

.faded {
	background-position: bottom; 
	margin:0; 
	color: #000000;
	font-weight: bold;
	font-size: 100%;
}
.faded a:visited, .faded a:link {
	color: black;
	}

.quarter_box {
}

.whole_box td.cell, .quarter_box td.cell {
	margin:0; padding:0; border: none;
	text-align: center;
	vertical-align: bottom;
	font-size: 1em;
}

.whole_box td.cell {
	width: 230px;
}
.quarter_box td.cell {
	width: 110px;
	font-size: .8em;
}
.faded .txt_txt {
	padding: 4px 4px;
}

.whole_box td.cell { 
/*	border: 1px solid #006A00; 
*/
}

#for_home td.cell, #for_office td.cell{
	vertical-align: middle;
	border: 1px solid #006A00;
	width: 228px;
	height: 208px;
}
#for_office td.cell{
/*	border: 1px solid #006A00; */
}

#for_home td.cell .faded .txt_txt a, #for_office td.cell .faded .txt_txt a{
	font-size: 1em;
	margin: 0 6px;
	text-align: center;
	color: #333333;
	font-weight:200;
	}

#for_home td.cell .faded .txt_txt a h3, #for_office td.cell .faded .txt_txt a h3{
	margin: 0px 0 3px 0;
	padding: 0;
	color: #AE2417;
}	
#for_home {
/*	background-image: url( ../images/for_home_faded.jpg); */
	}

.whole_box #mixed_box td.cell {
	vertical-align: bottom;
	font-size: 1em;
}

.whole_box #mixed_box td.cell {
	vertical-align: bottom;
	font-size: 1em;
}

.testimonial {
	font-size: 1em;
	margin: 0 6px;
/*	font-style: italic; */
	text-decoration: none;
	font-weight: bolder;
	}



.whole_box .quarter_box #q_news1 {
	background-image:url(../images/dwarfed_golden_winner.jpg);
}	
.whole_box .quarter_box #q_news1 .faded {
	background-image:url(../images/dwarfed_golden_winner_faded.jpg);
}	

#delivery { 
	background-image: url(../images/delivery.jpg);
}
#delivery .faded {
	background-image: url(../images/delivery_faded.jpg); 	
}


#go_wild { 
	background-image: url(../images/WickerBasketSkyGrass.jpg);
}

#go_wild .faded {
	background-image: url(../images/WickerBasketSkyGrass_Faded.jpg); 
}

.whole_box #go_wild td.cell {
	vertical-align: bottom;
	font-size: 1em;
}


#seasonal { 
	background-image: url("../images/RedApple.jpg");
}
#seasonal .faded {
	background-image: url("../images/RedApple_Faded.jpg"); 
}

/*
#office {
	background-image: url(../images/office.jpg); 
}
#office .faded {
	background-image: url(../images/office_faded.jpg);  
}

.whole_box #office td.cell {
}

#office td.cell {
}
*/
#mixed_box {
	background-image: url("../images/MixedBox.jpg");
	background-position: bottom;
}		
#mixed_box .faded {
	background-image: url("../images/MixedBox_Faded.jpg");
	background-position: bottom;
}		

/*#slideshow {
	background-image: url("../images/Slideshow/Cabbage_Faded.jpg");
	background-position: bottom;
}		
#slideshow td.cell {
	vertical-align: middle;
}
#slideshow .txt_txt {	
}
*/
/*
#transient1 {
	background-image: url("../images/AppleBlackboard.jpg"); 
}		
#transient1 .faded {
	background-image: url("../images/AppleBlackboard_Faded.jpg") ; 
}		
*/

#transient2 {
	background-image: url("../images/Daffodill.jpg");
/*	background-position: center;
//*	background-image: url("../images/AutumnTreeTrunk_Faded.jpg");
	font-size: 2em; */
}		
#transient2 td.cell {
/*	vertical-align: middle;  */
}

#transient2 td.cell .txt_txt {
	color: #0066CC;
}
#transient2 .faded{
	background-image: url("../images/Daffodill_Faded.jpg");
}
#christmas {
	background-image: url("../images/FairTradeHamper.jpg");
}		

#christmas .faded {
	background-image: url("../images/FairTradeHamper_Faded.jpg") ; 
}		

#christmas td.cell {
}

#christmas td.cell .txt_txt{
}


/*  Quarter boxes    */
.quarter_box {				
/*	border: 1px solid gray;  Need to change as ie puts inside whilst the others put outside the box's dimensions */
	width: 110px;  /* Half of 230 (230 1xp border) is 116 which must include the inner margin & borders.  So avail space is 116-2=114. */
	height: 100px; /*   An inner margin of say 6 (3 r & 3 l) would be good, so width can be 111; */
	margin: 0;			/* Margins are set on named boxes. */
	padding: 0;
}

#new_products{
	background-image:url("../images/CoffeeBagCup.jpg");
}
#new_products .faded {
	background-image:url("../images/CoffeeBagCup_Faded.jpg"); 
}

#special_offers{
	background-image:url("../images/BodyWashesGroup.jpg");
}
#special_offers .faded{
	background-image:url("../images/BodyWashesGroup_Faded.jpg");
}
#special_offers td.cell {
	vertical-align: bottom;
}

#competition {
	background-image: url("../images/Ring.jpg");
}		
#competition .faded {
	background-image: url("../images/Ring_Faded.jpg");
}		

/*#mid_winter_holiday_7 {
	background-image: url("../images/SnowyOakTrees_Faded.jpg");
	background-position: center;
}		

#mid_winter_holiday_7 td.cell{
	vertical-align: middle;
	}

#mid_winter_holiday_7 td.cell .faded .txt_txt{
	font-size: 1.92em;
	color: #11AA44;
	vertical-align: middle;
	}

#mid_winter_holiday_7 .faded {
}
*/
/*  Other  */  /*  Other  */  /*  Other  */  /*  Other  */