/**
 * HCL Screen Style Sheet
 *
 * @author: Stuart Davis (stuart@hcl.uk.com)
 * @date: April 06
 */

/* -------------- THE MENU --------------- */

#menuwrapper {
	margin: 0px;
	padding: 0px;
	height: 46px;
	width: 800px;
	background-color: #FFF;
	overflow: hidden;
}

	/* ----- About Us & Contact menu start ------ */

	#menuwhiteAboutUs, #menuwhiteContact {
	margin: 0px;
	padding: 0px;
	height: 20px;
	width: 800px;
	position: relative;
	overflow: hidden;
	background: #FFF;
	}
	
	/* ----- About Us & Contact menu end ------ */

			/* ----- Work menu start ------ */

	#menuwhiteAdvertising, #menuwhitePrint, #menuwhiteWebMultimedia, #menuwhitePromotions, #menuwhiteEvents, #menuwhiteFilmTV, #menuwhitePR {
	margin: 0px;
	padding: 0px;
	height: 20px;
	width: 800px;
	position: relative;
	overflow: hidden;
	background: #FFF;
	}
			
		#sitewrapperWork #menuwhiteAdvertising {background: transparent url(../_images/menu-white-work.png) 0px 0px no-repeat;}
		#sitewrapperWork #menuwhitePrint {background: transparent url(../_images/menu-white-work.png) 0px -20px no-repeat;}
		#sitewrapperWork #menuwhiteWebMultimedia {background: transparent url(../_images/menu-white-work.png) 0px -40px no-repeat;}
		#sitewrapperWork #menuwhitePromotions {background: transparent url(../_images/menu-white-work.png) 0px -60px no-repeat;}
		#sitewrapperWork #menuwhiteEvents {background: transparent url(../_images/menu-white-work.png) 0px -80px no-repeat;}
		#sitewrapperWork #menuwhiteFilmTV {background: transparent url(../_images/menu-white-work.png) 0px -100px no-repeat;}
		#sitewrapperWork #menuwhitePR {background: transparent url(../_images/menu-white-work.png) 0px -120px no-repeat;}
		
			#menuwhite li, #menuwhiteAdvertising li, #menuwhitePrint li, #menuwhiteWebMultimedia li, #menuwhitePromotions li, #menuwhiteEvents li, #menuwhiteFilmTV li, #menuwhitePR li {margin: 0; padding: 0; list-style: none; position: absolute; top: 0;}

			#menuwhite li, #menuwhiteAdvertising li, #menuwhitePrint li, #menuwhiteWebMultimedia li, #menuwhitePromotions li, #menuwhiteEvents li, #menuwhiteFilmTV li, #menuwhitePR li, 
			#menuwhite a, #menuwhiteAdvertising a, #menuwhitePrint a, #menuwhiteWebMultimedia a, #menuwhitePromotions a, #menuwhiteEvents a, #menuwhiteFilmTV a, #menuwhitePR a {height: 20px; display: block;}
			
			#panel-w-1b {left: 0; width: 106px;}
			#panel-w-2b {left: 107px; width: 58px;}
			#panel-w-3b {left: 164px; width: 164px;}
			#panel-w-4b {left: 328px; width: 122px;}
			#panel-w-5b {left: 450px; width: 80px;}
			#panel-w-6b {left: 530px; width: 80px;}
			#panel-w-7b {left: 610px; width: 47px;}
			
			#panel-w-1b a:hover {background: transparent url(../_images/menu-white-work.png) 0px 0px no-repeat;}
			#panel-w-2b a:hover {background: transparent url(../_images/menu-white-work.png) -107px -20px no-repeat;}
			#panel-w-3b a:hover {background: transparent url(../_images/menu-white-work.png) -164px -40px no-repeat;}
			#panel-w-4b a:hover {background: transparent url(../_images/menu-white-work.png) -328px -60px no-repeat;}
			#panel-w-5b a:hover {background: transparent url(../_images/menu-white-work.png) -450px -80px no-repeat;}
			#panel-w-6b a:hover {background: transparent url(../_images/menu-white-work.png) -530px -100px no-repeat;}
			#panel-w-7b a:hover {background: transparent url(../_images/menu-white-work.png) -610px -120px no-repeat;}
			
			/* ----- Work menu end ------ */
			
			/* ----- Results menu start ------ */
		
		#menuwhiteAccelerate, #menuwhiteAWM, #menuwhiteThrillHopper, #menuwhiteExtraCare, #menuwhiteLaybond, #menuwhiteLSC, #menuwhiteMustard {
		margin: 0px;
		padding: 0px;
		height: 20px;
		width: 800px;
		position: relative;
		overflow: hidden;
		background: #FFF;
		}
		
		#sitewrapperResults #menuwhiteAccelerate {background: transparent url(../_images/menu-white-results.png) 0px -20px no-repeat;}
		#sitewrapperResults #menuwhiteAWM {background: transparent url(../_images/menu-white-results.png) 0px -40px no-repeat;}
		#sitewrapperResults #menuwhiteThrillHopper {background: transparent url(../_images/menu-white-results.png) 0px -60px no-repeat;}
		#sitewrapperResults #menuwhiteExtraCare {background: transparent url(../_images/menu-white-results.png) 0px -80px no-repeat;}
		#sitewrapperResults #menuwhiteLaybond {background: transparent url(../_images/menu-white-results.png) 0px -100px no-repeat;}
		#sitewrapperResults #menuwhiteLSC {background: transparent url(../_images/menu-white-results.png) 0px -120px no-repeat;}
		#sitewrapperResults #menuwhiteMustard {background: transparent url(../_images/menu-white-results.png) 0px -140px no-repeat;}
		
			#menuwhiteAccelerate li, #menuwhiteAWM li, #menuwhiteThrillHopper li, #menuwhiteExtraCare li, #menuwhiteLaybond li, #menuwhiteLSC li, #menuwhiteMustard li {margin: 0; padding: 0; list-style: none; position: absolute; top: 0;}

			#menuwhiteAccelerate li, #menuwhiteAWM li, #menuwhiteThrillHopper li, #menuwhiteExtraCare li, #menuwhiteLaybond li, #menuwhiteLSC li, #menuwhiteMustard li, 
			#menuwhiteAccelerate a, #menuwhiteAWM a, #menuwhiteThrillHopper a, #menuwhiteExtraCare a, #menuwhiteLaybond a, #menuwhiteLSC a, #menuwhiteMustard a {height: 20px; display: block;}
			
			#panel-r-1b {left: 0; width: 103px;}
			#panel-r-2b {left: 104px; width: 72px;}
			#panel-r-3b {left: 177px; width: 125px;}
			#panel-r-4b {left: 303px; width: 104px;}
			#panel-r-5b {left: 408px; width: 237px;}
			#panel-r-6b {left: 646px; width: 161px;}
			#panel-r-7b {left: 0px; width: 0px;}
			
			#panel-r-1b a:hover {background: transparent url(../_images/menu-white-results.png) 0px -20px no-repeat;}
			#panel-r-2b a:hover {background: transparent url(../_images/menu-white-results.png) -104px -40px no-repeat;}
			#panel-r-3b a:hover {background: transparent url(../_images/menu-white-results.png) -177px -60px no-repeat;}
			#panel-r-4b a:hover {background: transparent url(../_images/menu-white-results.png) -303px -80px no-repeat;}
			#panel-r-5b a:hover {background: transparent url(../_images/menu-white-results.png) -408px -100px no-repeat;}
			#panel-r-6b a:hover {background: transparent url(../_images/menu-white-results.png) -646px -120px no-repeat;}
			#panel-r-7b a:hover {background: transparent url(../_images/menu-white-results.png) -0px 0px no-repeat;}
			
			/* ----- Work menu end ------ */
			
	#menugrey {
	margin: 0px;
	padding: 0px;
	height: 26px;
	width: 800px;
	background: #B3B2B2 url(../_images/menu-bottom.png);
	position: relative;
	overflow:hidden;
	}
		/* ----- this code swaps in the right image - don't forget to change #sitewrapperXXXX in the html ------- */
		#sitewrapperAboutUs #menugrey {background: #B3B2B2 url(../_images/menu-bottom-aboutus.png);}
		#sitewrapperWork #menugrey {background: #B3B2B2 url(../_images/menu-bottom-work.png);}
		#sitewrapperResults #menugrey {background: #B3B2B2 url(../_images/menu-bottom-results.png);}
		#sitewrapperContact #menugrey {background: #B3B2B2 url(../_images/menu-bottom-contact.png);}
	
		#menugrey li {margin: 0; padding: 0; list-style: none; position: absolute; top: 0;}

		#menugrey li, #menugrey a {height: 26px; display: block;}
		
		#panel1b {left: 0; width: 108px;}
		#panel2b {left: 109px; width: 70px;}
		#panel3b {left: 180px; width: 90px;}
		#panel4b {left: 271px; width: 106px;}
		
		#panel1b a:hover {background: transparent url(../_images/menu-bottom.png) 0 -26px no-repeat;}
		#panel2b a:hover {background: transparent url(../_images/menu-bottom.png) -109px -26px no-repeat;}
		#panel3b a:hover {background: transparent url(../_images/menu-bottom.png) -180px -26px no-repeat;}
		#panel4b a:hover {background: transparent url(../_images/menu-bottom.png) -271px -26px no-repeat;}
		
		/* ----- where all the menu magic ends!! ------- */