/* => CONTENTS
	1 Reset
	2 Typography
	3 Layout
	4 CSS Sprites
	5 Misc
	! About this document	
*/

/* 1=> RESET
	----------------------------------------------------*/
	/* reset styles based on work by Eric Meyer */
	html, body, div, span, applet, object, h1, h2, h3, h4, h5, h6, p, blockquote, a, abbr, acronym, address, cite, em, img, ins, strong, sub, sup, b, u, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent; }
	body { line-height:1; }
	blockquote, q { quotes:none; }
	blockquote:before, blockquote:after, q:before, q:after { content:''; content:none; }
	:focus { outline:0; } /* remember to define focus styles! */
	table { border-collapse:collapse; border-spacing:0; } /* tables still need 'cellspacing="0"' in the markup */
	html { overflow-y: scroll; } /* forced vertical scrollbar to be always visible -- thereby avoiding the horizontal "jump" when the page has to re-center */

/* 2=> TYPOGRAPHY
	----------------------------------------------------*/
	body { font:normal 16px Arial, Helvetica, sans-serif; }
	#header, #wrapper, #footer { vertical-align:top; }
	p.logo em { font-size:0.8125em; font-weight:bold; font-style:normal; }
	/* To calculate relative font sizes: (target font size) ÷ (context...here 16px)=(result) ... ex.: 13px ÷ 16px = 0.8125 */
	.globallinks, .globallinks a { font-size:0.8em; color:#888; }
	.globallinks { text-align:right; margin-right: 15px; }
	h1 { /*font-size:1.625em;*/ font-size:1.45em; line-height:1.625em; color:#fff; font-weight:normal; letter-spacing:0.0001em; }
	h1 em { font-weight:bolder; color:#E98923; font-style:normal; }
	.tagline { font-size:1.2em; line-height:1.25em; color:#DEE2E7; font-style:italic; font-weight:normal; }
	.searchform input { font-size:1em; font-weight:normal; color:#83909C; }
	input.searchbox {  }
	input.submitbutton { vertical-align:middle; }
	#quote h2 { font-size:1.25em; text-transform:uppercase; color:#EAECEF; }
	ol { list-style:none; color:#EAECEF; font-size:1em; }
	ol li em { font-size:1.25em; font-weight:bold; color:#EB9D4C; font-style:normal; }
	#cats p { color:#496E94; font-size:0.9em; font-weight:bold; /*text-transform:uppercase;*/ }
	.nav, .nav ul { list-style-type:none; }
	.nav { font-size:0.802em; font-weight:bold; }
	.nav a, .nav a:link, .nav a:visited { color:#557494; }
	.nav a:hover { text-decoration:none; color:#1C334A; /*padding-left:8px;*/ width:148px; }
	.nav ul { font-size:0.85em; }
	.nav li ul a, .nav li ul a:link, .nav li ul a:visited { color:#1C456E; font-weight:normal; }
	.nav li ul a:hover { color:#E98923; text-decoration:none; }
	.support h2 { font-size:0.8125em; color:#5F81A4; }
	#stats ul { list-style:none; }
	#stats ul li { font-size:0.75em; color:#45586B; }
	#stats ul li b { font-size:1.5em; font-weight:bold; color:#5F81A4; text-decoration:none; }
	#suppliers ul.logonav { text-align:center; list-style:none; } 
	#suppliers ul.logonav li a { text-decoration:none; font-size:1px; padding:4px; color:#f2f2f2; }
	#suppliers ul.logonav li a.selected { color:#D2E4D2; }
	.detail h3 { font-size:1.125em; color:#6F7D8C; }
	.section { font-size:0.8125em; }
	.section a { color:#ea8924; }
	.tabs { list-style:none; }
	.tabs li a { color:#5F81A4; font-size:0.75em; }
	.tabs li a:hover { font-weight:bold; }
	.tabs li a.selected { font-weight:bold; color:#E98823; }
	#buyerinfo .section h4 { color:#5F81A4; }
	.locallinks { font-size:0.85em; }
	.locallinks ul a, .locallinks ul a:link, .locallinks ul a:visited { color:#036; }
	.locallinks ul a:hover { color:#00f; }
	.locallinks ul a:active { color:#036; }
	#residential ul { font-size:0.85em; }
	#residential ul li a { color:#5F81A4; }
	#educational ul { font-size:0.85em; }
	#educational ul li a { color:#5F81A4; }
	#popcats ul { font-size:0.85em; }
	#popcats  ul li a { color:#5F81A4; }

	#supplierinfo h3 { color:#FFF6EC; }
	#supplierinfo .section h4 { color:#5E6E7F; }
	#footer { font-size:0.625em; text-align:center; color:#7d7d7d; }
	#footer a, #footer a:link, #footer a:visited, #footer a:hover, #footer a:active { color: #7d7d7d; }


/* 3=> LAYOUT
	----------------------------------------------------*/
	body { width:100%; background:#fff; }
	#header, #wrapper, #footer { clear:both; }
	#header, #wrapper, #footer, .container, #level2, #level3, #level4 { margin-left:auto; margin-right:auto; }
	#header, #footer { width:936px; }
	#header { margin-top:30px; height:43px; }
	p.logo { float:left; width:525px; }
	p.logo img { float:left; }
	p.logo em { display:block; padding-top:22px; }
	.globallinks { padding-top:21px; }
	.wrapper { width:100%; }
	#level1, #level4 { width:100%; }
	#level1 { height:402px; position:relative; z-index:100; background:url(/images/home/page-bg.png) repeat-x left -2px; }
	.container, #level2, #level3 { width:936px; }
	#quote, #cats { margin-top:auto; margin-bottom:auto; }
	#quote { width:780px; float:right; background:url(/images/home/quote-bg.jpg) no-repeat left -2px; }
	#quote span { display:block; margin:24px 0 24px 24px; }
	.searchform { margin-top:28px; margin-bottom:28px; }
	.searchform input { padding:7px 10px 8px; border:2px solid #C1C7CE; }
	input.searchbox { width:256px; margin-bottom:20px; margin-right:10px; }
	input.submitbutton { padding:0; border:none; }
	.badge { width:128px; height:80px; text-align:left; float:right; margin-top:-16px; }
	#quote h2 { margin-bottom:20px; }	
	ol { padding-bottom:10px; }
	ol li { background-repeat:no-repeat; background-position:left top; padding-top:6px; padding-left:45px; padding-bottom:10px; }
	ol li#stp1 { background-image:url(/images/home/ico-choose.png); }
	ol li#stp2 { background-image:url(/images/home/ico-share.png); }
	ol li#stp3 { background-image:url(/images/home/ico-connect.png); }
	#cats { width:156px; }
	#cats p { border-bottom:1px solid #9EAAB7; padding-top:38px; padding-bottom:2px; }
	.nav, .nav li { position:relative; }
	.nav li {  }
	.nav a { width:136px; display:block; padding:6px 5px 8px 15px; }
	.nav .nosub a:hover { width:135px; } 
	.nav ul { position:absolute; left:156px; top:-1px; display:none; width:195px; border:1px solid #9EAAB7; border-left:none; }
	.nav ul span { display:block; width:195px; padding-top:5px; }
	.nav li ul a { background:none; color:#1C456E; font-weight:normal; padding:3px 6px;  width:auto; }
	.nav li ul a:hover { background:none; color:#E98923; text-decoration:none; width:auto; }
	#level2 {  }
	.support { padding:10px; }
	.support h2 { font-size:0.8125em; color:#5F81A4; width:156px; float:left; margin-right:20px; clear:left; }
	#stats { position:relative; z-index:2; padding-top:45px; margin-top:-35px; }
	#stats ul { list-style:none; }
	#stats ul li { font-size:0.75em; color:#45586B; position:relative; width:225px; margin-right:30px; float:left; }
	#stats ul li.last { margin-right:0; }
	#stats ul li b { display:block; }
	#suppliers { position:relative; z-index:1; margin-top:-5px; }
	#suppliers ul.logonav { text-align:center; margin:0 auto 10px; list-style:none; } 
	#suppliers ul.logonav li { display:inline; }
	#suppliers ul.logonav li b i { visibility:hidden; }
	#suppliers ul.logonav li b { text-decoration:none; font-size:1px; padding:4px; color:#f2f2f2; }
	
	#suppliers ul.supplierlogos { list-style:none; }
	#suppliers ul.supplierlogos li { width:145px; display:inline; margin-right:55px; }
	#suppliers ul.supplierlogos li.last { margin-right:0; }
	
	#level3 { margin-top:20px; }
	.detail {  }
	.detail h3 { font-size:1.125em; color:#6F7D8C; padding:2px 4px 6px; }
	.section { height:250px; font-size:0.8125em; padding:7px 10px; }
	.section h4, .section p, .section ul { margin-bottom:6px; }
	.section ul, #residential ul.first { margin-left:10px; padding-left:15px; }
	.section ul, #popcats ul.first { margin-left:10px; padding-left:15px; }
	.section ul li { padding-bottom:8px; padding-top:4px; }
	.section a { color:#ea8924; }
	
	#buyerinfo { width:624px; margin-right:20px; float:left; }
	.tabs { width:158px; height:265px; float:left; list-style:none; }
	.tabs li {  }
	.tabs li a { display:block; padding:6px 2px 8px 19px; color:#5F81A4; font-size:0.75em; border-left:1px solid #ced3d8; }
	.tabs li a:hover { font-weight:bold; }
	.tabs li a.selected { font-weight:bold; color:#E98823; border:2px solid #EAECEF; border-top:none; border-right:none; background:#fff; padding-left:8px; }
	#buyerinfo .section { width:446px; margin-left:156px; border:2px solid #EAECEF; border-left:none; border-top:none; }
	#buyerinfo .section h4, #buyerinfo .section h4 a { color:#5F81A4; }
	p.contentimage { float:left; }
	.locallinks { width:156px; margin-left:295px; display:block; visibility:visible; /* off-sets hidden UL.TABS */ }
	.locallinks ul { height:140px; overflow:auto; margin-left:15px; padding-left:15px; }
	.locallinks ul li { padding-top:0; padding-bottom:2px; }
	.locallinks p.break { padding:10px 0; }
	#residential ul { width:105px; float:left; margin-left:18px; padding-left:18px; }
	#residential ul.first { width:110px; }
	#residential ul li { padding-bottom:4px; }
	#educational ul { width:105px; float:left; margin-left:18px; padding-left:18px; }
	#educational ul.first { width:110px; }
	#educational ul li { padding-bottom:4px; }
	
	#popcats ul { width:110px; float:left; margin-left:15px; padding-left:15px; }
	#popcats ul.first { width:125px; }
	#popcats ul li { padding-bottom:4px; }
	#popcats ul.last { clear:right; }
	form#catlist { padding-top:15px; text-align:center; }
	
	#supplierinfo { width:288px; float:left; border:2px solid #7EB27F; }
	#supplierinfo p { margin-bottom:10px; } 
	
	#level4 { background:#EAECEF; clear:both; margin-top:20px; }
	#footer { padding:10px 0 30px 0; }
	#footer p, #footer ul { margin:5px 0; }
	#footer p { padding:13px; }
	#footer ul, #footer ul li { display:inline; }
	#footer ul li { margin:0 2px 0 0; }
	#footer ul li a { margin-right:2px; }


/* 4=> CSS SPRITES
	----------------------------------------------------*/
	.nav a, .nav a:hover, .nav ul, .nav ul span, #stats, #suppliers, #suppliers ul.logonav li a, #suppliers ul.logonav li a.selected, .detail h3, .tabs, .tabs li a, #supplierinfo h3 { background-image:url(/images/home/bg-sprite2.png); background-repeat:no-repeat; }

	.nav a { background-position:0 0; }
	.nav a:hover { background-position:0 -32px; }
	.nav ul { background-position:-949px 0; background-color:#fff; }
	.nav ul span { background-position:-321px 0; }
	#stats { background-position:0 -485px; }
	#suppliers { background-position:0 -635px; }
	#suppliers ul.logonav li a { background-position:0 -125px; }
	#suppliers ul.logonav li a.selected { background-position:-15px -125px; }
	.detail h3 { background-position:-321px -363px; }
	.tabs { background-position:-160px -7px; }
	.tabs li a { background-position:-160px 0; }
	#supplierinfo h3 { background-position:-321px -395px; }


/* 5=> MISC
	----------------------------------------------------*/
	p.break { clear:both; font-size:1px; line-height:1px; margin: 0px; padding: 0px; }
	p.more { text-align:right; }


/* !=> ABOUT THIS DOCUMENT
	----------------------------------------------------*/
	/*
	BUYERZONE HOMEPAGE V2
	Created: March 2009
	Author: Amy Osborne
		LATEST EDITS
		By: Amy
		Date: 15 Sept 2009
		Description: adding educational tab & content
	----------------------------------------------------*/
