@charset "utf-8";
/* 
= CSS Document  ===========================================
	
	Site: 			Beacon Purchasing
	Author: 		Steven Gibbons | Union Room
	Created: 		20th January 2009
	Updated: 	
	Copyright: 	(c) 2009, www.beaconpurchasing.co.uk
	
===========================================================
*/

/* =============================== START Tags & Global Elements =============================== */
* { margin: 0; padding: 0; }
html { font-size: 100%; }
body { width: 100%; min-width: 880px; font-size: 62.5%; font-family: Verdana, Arial, Helvetica, sans-serif; margin: 0 0 30px 0; }
a { }
a:hover {  }
a.external {}
a#unionroom {}
a#unionroom:hover {}
a img { border: none; }
acronym { border-bottom: 1px dotted; cursor: help; }
p { font-size: 1.2em; color: #999; margin: 0; line-height: 1.5; margin: 0; padding: 0 0 10px 0; text-align: left; }
/* =============================== END Tags & Global Elements =============================== */


/* =============================== START Structure Elements =============================== */

a#twitter { position: absolute; top: -47px; right: -5px; width: 213px; height: 54px; background: url('../img/iR/twitter.png') no-repeat; }


div.wrapper { width: 880px; margin: 0; padding: 0 0 20px 0; }

div#hdr { width: 100%; height: 82px; background: #0085C4; padding: 13px 0; }
	div#hdr h1 { float: left; margin: 0 0 0 24px; width: 82px; height: 82px; background: url('../img/h1_logo.gif') no-repeat; }
	div#hdr p { float: right; color: #FFF300; margin: 15px 0 0 0; }
	div#hdr p a { color: #FFF300; font-weight: bold; }
		div#hdr p a:hover { text-decoration: none; }

div#main_hdr { width: 880px; height: 180px; padding: 0; position: relative; }
	div#main_hdr h2 { float: left; margin: 0 0 0 24px; width: 196px; height: 180px; background: url('../img/h2_logo.gif') no-repeat; }
	div#main_hdr h3 { float: left; margin: 0 0 0 24px; width: 540px; height: 132px; background: url('../img/h3_heading.gif') no-repeat; }
	div#main_hdr ul { float: left; margin: 26px 0 0 24px; width: 620px; list-style: none; }
		div#main_hdr ul li span.spacer { padding: 0 5px; color: #999; }
		div#main_hdr ul li { float: left; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 1.2em; padding: 4px 0 0 0; }
		div#main_hdr ul li a { text-decoration: none; padding: 2px 0 0 0; border: 2px solid #fff; border-width: 2px 0 0 0; color: #999; }
			div#main_hdr ul li a.active,
			div#main_hdr ul li a:hover { border: 2px solid #7FC531; border-width: 2px 0 0 0; color: #7FC531; }

div#ftr { width: 600px; height: 85px; padding: 0 0 20px 0; }
	div#ftr ul { float: left; margin: 15px 0 5px 24px; width: 600px; list-style: none; }
		div#ftr ul li span.spacer { padding: 0 5px; color: #999; }
		div#ftr ul li { float: left; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 1.1em; color: #999; }
		div#ftr ul li a { text-decoration: none; padding: 2px 0 0 0; color: #7FC531; }
			div#ftr ul li a.active,
			div#ftr ul li a:hover { text-decoration: underline; color: #7FC531; }
			
	div#ftr p { float: left; margin: 0 0 0 24px; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 1.1em; color: #999; padding: 0; }
	div#ftr p a { text-decoration: none; color: #7FC531; }
		div#ftr p a.active,
		div#ftr p a:hover { text-decoration: underline; }
		
	div#ftr div#green_tourism { position: relative; z-index: 9; left: 774px; top: 13px; margin: 0; width: 46px; height: 59px; background: url('../img/green_tourism.gif') top; }
	* + html div#ftr div#green_tourism { position: relative; z-index: 9; left: 280px; top: -36px; width: 46px; height: 59px; background: url('../img/green_tourism.gif') top; }
		div#ftr div#green_tourism:hover { width: 46px; height: 59px; background: url('../img/green_tourism.gif') bottom; }
		div#ftr div#green_tourism a { width: 46px; height: 59px; }
		
div#grass { margin: 60px 0 0 0; width: 100%; height: 88px; background: url('../img/grass.gif') repeat-x; }	
	div#grass div#flower { width: 56px; height: 68px; background: url('../img/flower.gif'); position: relative; left: 285px; bottom: 35px; }
/* =============================== END Structure Elements =============================== */


/* =============================== START Content Elements =============================== */
div#content { width: 100%; margin: 0; padding: 0; }
/* =============================== END Content Elements =============================== */


/* =============================== START Index Page =============================== */
	div#homepage_content { margin-left: 30px; margin-top: 20px; width: 830px; float: left; }
		div#homepage_content #topblock { width: 830px; clear: both; }
		div#homepage_content #topblock h4 { font-size: 2.2em; color: #7FC531; font-weight: normal; padding-bottom: 10px; }
		
		div#homepage_content #topblock a { color: #7FC531; }
		
			div#homepage_content #topblock #flash_hotel { width: 400px; height: 240px; float: right; margin-left: 30px; }
			
		div#homepage_content #bottomblock { width: 830px; clear: both; margin-top: 25px; }
 	
	div#content ul { float: left; margin: 40px 0 0 30px; width: 800px; list-style: none; }
	div#content ul li { float: left; margin: 0 10px 10px 0; }
		div#content ul li a { width: 190px; height: 190px; cursor: pointer!important; }
		div#content ul li #block1 { width: 190px; height: 190px; background: url('../img/block1.gif'); }
			div#content ul li #block1:hover { width: 190px; height: 190px; background: url('../img/block1.gif') bottom; }
		div#content ul li #block2 { width: 190px; height: 190px; background: url('../img/block2.jpg'); }
			div#content ul li #block2:hover { width: 190px; height: 190px; background: url('../img/block2.jpg') bottom; }
		div#content ul li #block3 { width: 190px; height: 190px; background: url('../img/block3.gif'); }
		div#content ul li #block4 { width: 190px; height: 190px; background: url('../img/block4.jpg'); margin: 0 -10px 0 0; }
			div#content ul li #block4:hover { width: 190px; height: 190px; background: url('../img/block4.jpg') bottom; }
		div#content ul li#block5 { width: 365px; height: 145px; margin: 0 10px; padding: 20px 15px 25px 0; }
			div#content ul li#block5 p { font-size: 1.2em; color: #999; margin: 0; line-height: 1.50; margin: 0; padding: 0 0 5px 0; text-align: left; }
		div#content ul li #block6 { width: 190px; height: 190px; background: url('../img/block6.jpg'); }
			div#content ul li #block6:hover { background: url('../img/block6.jpg') bottom; }
		div#content ul li #block7 { width: 190px; height: 190px; background: url('../img/block7.jpg'); margin: 0 -10px 0 0; }
			div#content ul li #block7:hover { width: 190px; height: 190px; background: url('../img/block7.jpg') bottom; }
			
	p.findOutMore { float: left; margin: 40px 0 0 0; width: 800px; font-size: 1.5em; }
		p.findOutMore a { color: #7FC531; text-decoration: none; }
			p.findOutMore a:hover { text-decoration: underline; }
/* =============================== END Green Goals Page =============================== */


/* =============================== START Green Hotel Page =============================== */	
div.green_hotel { width: 850px; height: 425px; margin: 15px 0; background: url('../img/green_hotel_bg.jpg') no-repeat; border: 1px solid #999; }
	img.icon { padding: 0 10px 0 5px; margin: 0 0 -7px 0; }
	p.green_hotel { width: 850px; }
/* =============================== END Green Hotel Page =============================== */		


/* =============================== START Suppliers Logo Page =============================== */		
	div#content ul.suppliers { float: left; margin: 0 0 40px 0; width: 851px; list-style: none; }
	div#content ul.suppliers li { float: left; margin: 0; border: 1px solid #E5E5E5; border-width: 1px 1px 0 0; }
	div#content ul.suppliers li.first_row { border-top: none; }
	div#content ul.suppliers li.end_column { border-right: none; }
	div#content ul.suppliers li.empty { border: 1px solid #E5E5E5; border-width: 1px 0 0 0; width: 212px; height: 134px; }
		div#content ul.suppliers li a { width: 212px; height: 134px; cursor: pointer!important; }
		div#content ul.suppliers li a:hover { background-position: bottom; }

/* =============================== END Suppliers Logo Page =============================== */	


/* =============================== START Supplier Overview Page & Products =============================== */
div.container .column_left { float: left; width: 190px; }
	div.container .column_left p { font-weight: bold; padding: 0 10px 0 0; }
	div.container .column_left img { float: left; margin: 10px 10px 0 0; clear: both; }
	div.container .column_left a.beacon { background: none!important; margin: 0!important; padding: 0!important; }

	div.container .column_left a { float: left; margin: 10px 0 0 0; width: 132px; height: 25px; background: url('../img/suppliers_page/back_to_suppliers.gif') top; }
		div.container .column_left a:hover { background: url('../img/suppliers_page/back_to_suppliers.gif') bottom; }
	div.container .column_left a.back { float: right; margin: 10px 16px 0 0; width: 52px; height: 25px; background: url('../img/suppliers_page/back.gif') top; }
		div.container .column_left a.back:hover { background: url('../img/suppliers_page/back.gif') bottom; }
	div.container .column_left .hints_tips { float: right; margin: 20px 15px 0 0; width: 133px; height: 131px; background: url('../img/suppliers_page/hints_tip.gif'); }
	div.container .column_left .hints_tips:hover { background: url('../img/suppliers_page/hints_tip.gif') bottom; }
		div.container .column_left .hints_tips a { width: 133px; height: 131px; background: none; }	
	div.container .column_left .products_tip { float: right; margin: 20px 15px 0 0; width: 133px; height: 131px; background: url('../img/suppliers_page/products_tip.gif'); }
	div.container .column_left .products_tip:hover { background: url('../img/suppliers_page/products_tip.gif') bottom; }
		div.container .column_left .products_tip a { width: 133px; height: 131px; background: none; }
div.container .column_right { float: right; width: 639px; padding: 0 25px; border: 1px solid #E5E5E5; border-width: 0 0 0 1px; }
	div.container .column_right img {  }
	div.container .column_right .products { float: left; margin: 15px 10px 15px 0; width: 186px; height: 186px; background: url('../img/suppliers_page/products.gif'); }
	div.container .column_right .products:hover { background: url('../img/suppliers_page/products.gif') bottom; }
		div.container .column_right .products a { width: 186px; height: 186px; background: none; }
	div.container .column_right .hints_tips { float: left; margin: 15px 0; width: 186px; height: 186px; background: url('../img/suppliers_page/hints.gif'); }
	div.container .column_right .hints_tips:hover { background: url('../img/suppliers_page/hints.gif') bottom; }
		div.container .column_right .hints_tips a { width: 186px; height: 186px; background: none; }
div.container .column_right ul { margin: 0 0 10px 0!important; }
div.container .column_right ul li.product ul { margin: 0!important; }


	div.container .column_right h4.none { font-size: 1.8em; width: 650px; font-weight: bold; color: #7FC531; line-height: 1.5; margin: 10px 0 20px 0; padding: 0; text-align: left; }
div.container .column_right h4.heading { 
	color:#999999;
	font-size:1.4em;
	font-weight:bold;
	line-height:1.5;
	list-style-image:none;
	list-style-position:outside;
	list-style-type:none;
	margin:0;
	padding:0 0 10px;
	text-align:left;
}


* + html div.container .column_right ul li.product ul { margin: 0 0 0 30px!important; list-style: disc!important; }
* + html div.container .column_right ul li.product ul li { margin: 0 0 0 20px!important; list-style: disc!important; float: none!important; }

/* =============================== END Supplier Overview Page & Products =============================== */


/* =============================== START Green Goals Page =============================== */
div.summary h5 { font-size: 1.4em; color: #999!important; margin: 0; line-height: 1.5; margin: 0; padding: 0 0 10px 0; text-align: left; font-weight: bold; list-style: none;!important }
div.information h5 { font-size: 1.4em; color: #999!important; margin: 0; line-height: 1.5; margin: 0; padding: 0 0 10px 0; text-align: left; font-weight: bold; list-style: none;!important }



p.moreinfo a.more { text-decoration: none; padding: 0 15px 0 0; color: #7FC531; background: url('../img/read_more.gif') no-repeat right top; }
p.moreinfo a.more.open { text-decoration: none; padding: 0 15px 0 0; color: #7FC531; background: url('../img/read_more.gif') no-repeat right bottom; }


div.container { width: 880px; margin: 0; padding: 40px 0 0 30px; }	
	div.container h3 { font-size: 4.0em; font-weight: bold; color: #7FC531; line-height: 1.0; margin: 0 0 20px 0; padding: 0; text-align: left; }
	div.container h4 { font-size: 2.8em; width: 750px; font-weight: bold; color: #7FC531; line-height: 1.0; margin: 10px 0 20px 0; padding: 0; text-align: left; }
		div.container h4.sIFR-replaced { margin: 10px 0; }
	div.container ul { list-style: none; }

div.summary { margin: 0; padding: 0; }
	div.summary ul { margin: 0!important; padding: 0; list-style: disc!important; color: #999; }
		div.summary ul li { font-size: 1.2em; color: #999; margin: 0 0 0 30px!important; line-height: 1.5; margin: 0; padding: 0 0 10px 0; text-align: left; }

div.information { margin: 0; padding: 0 }
div.information img { margin: 10px 0; padding: 0; }
	div.information ul { margin: 0!important; padding: 0; list-style: disc!important; color: #999; }
		div.information ul li { font-size: 1.2em; color: #999; margin: 0 0 0 30px!important; line-height: 1.5; margin: 0; padding: 0 0 10px 0; text-align: left; }
div.information.hide { display: none; }


div.summary ul li { float: none!important; }
/* =============================== END Green Goals Page ================================== */


/* =============================== START News Page ================================== */
ul#newsList {}
ul#newsList li { padding: 0 0 30px 0; }
	ul#newsList li h4.flashReplace { margin: 0 0 10px 0; padding: 0 !important; }
	ul#newsList li p.meta { font-size: 1.1em; color: #7FC531; }
	ul#newsList li div.content { display: none; }
	ul#newsList li div.content.show { display: block; }
	ul#newsList li div.summary.hide { display: none; }
/* =============================== END News Page ================================== */


/* =============================== START Generic Styles =============================== */
div.container ul.generic { margin: 0!important; padding: 0; list-style: disc!important; color: #999; }
div.container ul.generic li { font-size: 1.2em; color: #999; margin: 0 0 0 30px!important; line-height: 1.5; margin: 0; padding: 0 0 5px 0; text-align: left; }
/* =============================== END Generic Styles =============================== */

div.container ul.contact { margin: 0!important; padding: 0; list-style: none; color: #999; }
	div.container ul.contact li { font-size: 1.2em; color: #999; margin: 0!important; line-height: 1.5; margin: 0; padding: 0 0 5px 0; text-align: left; }
	div.container ul.contact li a { text-decoration: none; padding: 0 15px 0 0; color: #7FC531; }
		div.container ul.contact li a:hover { text-decoration: underline; }
div.container ul.address { margin: 25px 0 0 0!important; padding: 0; list-style: none; color: #999; }
	div.container ul.address li { font-size: 1.2em; color: #999; margin: 0!important; line-height: 1.5; margin: 0; padding: 0 0 5px 0; text-align: left; }

	div.container a { text-decoration: none; padding: 0; color: #7FC531; }
		div.container a:hover { text-decoration: underline; }
		
	div.container ul.sitemap { margin: 0!important; padding: 0; list-style: disc!important; color: #999; }
		div.container ul.sitemap li { font-size: 1.2em; color: #999; margin: 0 0 0 30px!important; line-height: 1.5; margin: 0; padding: 0 0 10px 0; text-align: left; }

/* =============================== START Feedback Form =============================== */

form#feedback {}
form#feedback ul { width: auto; }
form#feedback input.text { width: 300px; margin: 0 10px 0 0; padding: 2px 3px; border: 1px solid #B0B0B2; color: #7FC531; }
form#feedback a { width: 170px; height: 25px; padding: 0 !important; background: url('../img/sendComments.gif'); }
form#feedback a:hover { width: 170px; height: 25px; padding: 0 !important; background: url('../img/sendComments.gif') bottom; }
/* =============================== END Feedback Form =============================== */

form#newsletter table {}
form#newsletter table th, form#newsletter table td { padding: 5px; color: #7FC531; font-size: 1.2em; }
form#newsletter table thead td { text-align: center !important; }
form#newsletter table input.text { width: 210px; padding: 2px 3px; color: #7FC531; border: 1px solid #B0B0B2; }
form#newsletter table input.postcode { width: 115px; padding: 2px 3px; color: #7FC531; border: 1px solid #B0B0B2;}

* + html form#newsletter table input.postcode { width: 115px; padding: 2px 3px; color: #7FC531; border: 1px solid #B0B0B2; margin: 0!important;}
* + html form#newsletter table input.postcodeButton { width: 92px; margin: 0!important;}

form#newsletter table select { width: 100px; padding: 2px 3px; color: #7FC531; border: 1px solid #B0B0B2; }
form#newsletter table select option.alt { background-color: #F7FBF0; }

form#newsletter table select#newsTypeBusiness { width: 218px; padding: 2px 3px; color: #7FC531; border: 1px solid #B0B0B2; }
form#newsletter table select#newsTypeBusiness option.alt { background-color: #F7FBF0; }

form#newsletter table select#newsPurchasingResponsibility { width: 218px; padding: 2px 3px; color: #7FC531; border: 1px solid #B0B0B2; }
form#newsletter table select#newsPurchasingResponsibility option.alt { background-color: #F7FBF0; }

form#newsletter table a.btnReplace { width: 116px; height: 25px; background: url('../img/joinNow.gif'); }
	form#newsletter table a.btnReplace:hover { width: 116px; height: 25px; background: url('../img/joinNow.gif') bottom; }
	
div#maincontentspan { margin: 0!important; width: 218px; }
* + html div#maincontentspan { margin: 0 0 -10px 0;!important; width: 218px; }
div#maincontentspan select#yell4postcode_drpAddress { border: 1px solid #B0B0B2; margin: 10px 0 0 0; width: 218px;!important }
* + html div#maincontentspan select#yell4postcode_drpAddress { border: 1px solid #B0B0B2; margin: 10px 0 0 0!important; width: 218px;!important }


div.addressSelect { font-size: 1.2em; color: #999; margin: 0; line-height: 1; margin: 15px 0 0 0!important; padding: 0; text-align: left; }
* + html div.addressSelect { font-size: 1.1em!important; color: #999; margin: 0; line-height: 1; margin: 5px 0 -10px 0!important; padding: 0; text-align: left; }


.btnReplace { background-position: top; background-repeat: no-repeat; display: block; }
.btnReplace span { width: 0px; height: 0px; overflow: hidden; display: block; }
a.btnReplace { visibility: hidden; }
a.btnReplace:hover { background-position: bottom; }

form#newsletter table .error { border: 1px solid #C00 !important; color: #C00 !important; background-color: #FFEEEE; }
form#newsletter table td.error { border: none !important; background-color: #FFF; }

.hide { display: none; }


/* =============================== START Important Stuff =============================== */
/*input.btnReplace { visibility: hidden; }*/
img.btnReplace { cursor: pointer; }


h3.supplierName { font-size: 1.2em; font-weight: bold; color: #7D7C7D; margin: 0 0 10px 0; }
-
.fLeft { float: left; }
.fRight { float: right; }
.tLeft { text-align: left; }
.tRight { text-align: right; }
.tCentre { text-align: center; }
.vTT { vertical-align: text-top; }
.bold { font-weight: bold; }
p.fade { color: #CCC; font-style: italic; }
	p.fade a { color: #B3DF82; text-decoration: none; }
	p.fade a:hover { color: #7FC531; text-decoration: underline; }
.noBold { font-weight: normal; }
.noBorder { border: none; }
.error { color: #DF0000; }
.hide { display: none; }
.green { color: #7FC531; }
.width { width: 600px!important; }
.upper { text-transform: uppercase!important; }
.marginLeft { margin: 20px 0 0 30px!important; }

div#unionroom { 
font-family: Verdana,Arial,Helvetica,sans-serif;
font-size: 1.1em;
color: #999;
padding: 0; 
width: 150px; 
float: right; 
text-align: right;
position: relative;
top: -15px;
left: 220px;
}
div#unionroom a { z-index: 100; color: #7FC531; text-decoration: none; }
div#unionroom a:hover { text-decoration: underline; background-position: top!important; }

.padding { margin: 10px 0 0 0; }

.imgReplace { background-position: top; background-repeat: no-repeat; display: block; }
.imgReplace span { width: 0px; height: 0px; overflow: hidden; display: block; }

.clearfix:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }
.clearfix { display: inline-block; }
html[xmlns] .clearfix { display: block; }
* html .clearfix { height: 1%; }
/* =============================== END Important Stuff =============================== */