/* 
Title:     	Maggi
date:   	Feb 2010
Author:		Jane Oldroyd, Iain scarlett
*/
			* { margin: 0; padding: 0; list-style: none; outline: none; }

			body { margin: 0; padding: 0; font-size: 100%; background-color: #ffffff; color: #000000; font-family: Arial, Helvetica, sans-serif, Lucida, sans-serif; }
			
			a:link { color: #000000; text-decoration: none; }
			a:visited  { color: #000000; text-decoration: none; }
			a:hover { text-decoration: none; color: #ED1D24; }
			
			img { border: none; margin: 0; padding: 0; }
			
			a img { border: none; }
			
			div,input,form,h1,h2,h3,h4,h5,hr,p,dl,dd,dt,ul,li,ol,object,param
			{ margin: 0; padding: 0; }
			
			html, body { height: 100%; }
			
			sup { text-size: 80%; vertical-align: top; }

					
/* structure styles
---------------------------------------------------------- */
			#container { width: 1000px; min-height: 100%; border-left: 1px solid #FCEE22; border-right: 0px solid #ffffff; margin-left: auto; margin-right: auto; background-color: #FCEE22; }
			* html #container {	height: 749px; }
			#outer-container { width: 1000px; margin-left: auto; margin-right: auto; background-color: #FFFFFF; }
			/* HEADER
			---------------------------------------------------------- */
			#header { padding: 21px 0 0 0px;width: 776px; height: 167px; }
			
			/* HOME */	
			#wrapper { width: 1000px; height: 684px; background-color: #FCEE22; }
			#leftcol { float: left; position: relative; width: 224px; height: 684px; }
			#inner-leftcol { padding: 21px 0 0 0px; margin-left: auto; margin-right: auto; width: 202px; height: 132px; background: #FCEE22; }
			#inner-leftcol2 { margin-left: auto; width: 202px; height: 386px; background: #FCEE22; }
			#inner-leftcol3 { padding: 10px 0 0 0px; margin-left: auto; width: 202px; height: 167px; background: #FCEE22; }
			#maincol { float: right; position: relative; width: 776px; height: 684px; background: url(../images/bg_image.jpg) top right no-repeat; }
			#maincol_gc { float: right; position: relative; width: 776px; height: 684px; background: url(../images/bg_image_gc.gif) top right no-repeat; }
			#maincol_chefs { float: right; position: relative; width: 776px; height: 684px; background: url(../images/bg_image_chefs2.gif) top right no-repeat; }
			#maincol_chefsbr { float: right; position: relative; width: 776px; height: 684px; background: url(../images/bg_image_gcbr.gif) top right no-repeat; }
			#maincol2 { float: right; position: relative; width: 776px; height: 684px; background: url(../images/bg_image2.gif) top right no-repeat; }
			#maincolprom { float: right; position: relative; width: 776px; height: 684px; background: url(../images/bg_image_promotion.jpg) top right no-repeat; }
			#maincolnews { float: right; position: relative; width: 776px; height: 684px; background: url(../images/bg_image_news.jpg) top right no-repeat; }
			#maincolnews2 { float: right; position: relative; width: 350px; height: 684px; background: url(../images/bg_image.jpg) top right no-repeat; }
			#maincolwhere { float: right; position: relative; width: 776px; height: 684px; background: url(../images/bg_image.jpg) top right no-repeat; }
			#inner-maincol { padding: 21px 0 0 0px; height: 475px; margin: 0; }
			#inner-maincol-alt {  padding: 0 0 0 0; margin: 0; }

			/* MAIN LAYOUT
			---------------------------------------------------------- */
			.heading { padding: 29px 0 30px 0}
			.heading-other { padding: 39px 0 10px 0}
			.subheading { padding-bottom: 30px; font-size: 120%; color: #C1BCBC; font-weight: bold; }
			.subsubheading { padding: 0 0 7px 10px; }
			.quotationsheading { padding-bottom: 30px; font-size: 180%; color: #C1BCBC; font-weight: bold; }

			.bottom-area { clear: both; width: 776px; }
			.col1 { float: left; width: 316px; padding: 70px 0 0px 40px; }
			.col2 { float: left; position: relative; width: 346px; padding: 70px 40px 20px 20px; }
			.col3 { float: left; width: 316px; padding: 70px 0 0px 40px; }
			.col4 { float: left; width: 316px; padding: 10px 0 0px 0px; }
			.colgc { float: left; width: 422px; height: 380px; padding: 70px 10px 0px 40px; font-family: Arial, Helvetica, sans-serif, Lucida, sans-serif; font-size: 12px; line-height: 14px; color: #FFFFFF; font-weight: normal; }
			.colchef {  float: left; width: 480px; height: 308px; padding: 70px 0px 0px 30px; font-family: Arial, Helvetica, sans-serif, Lucida, sans-serif; font-size: 12px; line-height: 14px; color: #FFFFFF; font-weight: normal; }
			.col2gc { float: right; position: relative; width: 266px; padding: 31px 0px 30px 30px; }
			.col2chef { float: right; position: relative; width: 266px; padding: 28px 0px 0px 0px; }
			.colchef_left { float: left; width: 178px; padding: 10px 10px 0px 0px; }
			.colchef_mid { float: left; width: 270px; padding: 10px 0 0px 0px; }
			.colchef_left_bot { float: left; width: 470px; padding: 0 0 0 0; }
			.colchef_left_but_first { margin-left: -10px; }
			#chef-buttons { margin-left: 20px; width: 485px; }
			.colchef_left_but { float: left; }
			
			.main_chef { float: left; width: 677px; padding: 85px 0 0px 40px; }
			.main_chef2 { float: left; width: 677px; padding: 50px 0 0px 0px; }
			.chef_panel1 { float: left; width: 380px; padding: 85px 0 0px 40px; }
			.chef_panel2 { float: left; width: 380px; padding: 0 0 0 0; }
			.chef_panel3 { float: right; width: 280px; padding: 120px 0px 0px 0px; }
			
			.main_product { float: left; width: 677px; padding: 65px 0 0px 40px; }
			.main_product2 { float: left; width: 677px; padding: 0 0 0 0; }
			.product { float: left; width: 330px; padding: 70px 0 0px 40px; }
			.productgravy { float: left; width: 355px; padding: 75px 0 0px 40px; }
			.product_a { float: left; width: 448px; padding: 65px 0 0px 40px; }
			.product_1 { float: left; position: relative; width: 230px; padding: 120px 0px 0px 0px; }
			.product_2 { float: left; width: 316px; padding: 0px 0 0px 0px; }
			.product_bouillons { float: right; position: relative; width: 300px; padding: 160px 75px 0px 0px; }
			.product_instant { float: left; position: relative; width: 230px; padding: 64px 0px 0px 12px; }
			
			.product_2a { float: left; width: 448px; padding: 0px 0 0px 0px; }
			.product_3 { float: right; position: relative; width: 200px; padding: 190px 75px 0px 0px; }
			.product_3a { float: right; position: relative; width: 180px; padding: 190px 75px 0px 00px; }
			.product_4 { float: left; width: 600px; padding: 5px 0px 0px 20px; text-align: left; }
			.product_arrows { width: 16px; height: 20px; position: absolute; top: 632px; left: 690px; }
			.product_arrows2 { width: 16px; height: 20px; position: absolute; top: 632px; left: 660px; }
			.product_multi { float: left; width: 590px; padding: 10px 15px 15px 30px; text-align: left; }
			#pr_list { float: left; width: 330px; padding: 0px 0 0 0px; text-align: left; }
			#pr_gravy { float: left; width: 355px; padding: 0px 0 0 0px; text-align: left; }
			#pr_lista { float: left; width: 448px; padding: 0px 0 0 0px; text-align: left; }
			
			.product_mash { float: right; position: relative; width: 250px; padding: 80px 50px 0px 0px; }
			.product_mashtable { float: left; width: 316px; padding: 30px 0 0px 0px; }
			.product_mash2 { float: left; width: 330px; padding: 0px 0 0px 0px; }
			.product_mash3 { float: left; width: 310px; padding: 0px 0 0px 0px; }
			.product_mashmain { float: left; width: 420px; padding: 70px 0 0px 40px; }
			#pr_listmash { float: left; width: 420px; padding: 30px 0 0 0px; text-align: left; }
			
			.product_sauce { float: left; width: 677px; padding: 85px 0 0px 40px; }
			.product_sauce2 { float: left; width: 500px; padding: 20px 0 0 140px; }
			
			.about { float: left; position: relative; width: 660px; padding: 70px 40px 20px 40px; }
			
			.offers { float: left; position: relative; width: 660px; padding: 70px 40px 20px 40px; }
			
			.friends { float: left; width: 300px; padding: 120px 15px 15px 30px; text-align: left; }
			.friends2 { float: left; width: 210px; padding: 80px 15px 15px 10px; text-align: left; }
			.friends2a { float: left; width: 260px; padding: 80px 15px 15px 10px; text-align: left; }
			.friends3 { float: left; width: 200px; padding: 86px 15px 15px 8px; text-align: left; }
			#friends_col { float: left; width: 200px; padding: 0px 0 0 0px; text-align: left; }
			#friends_cola { float: left; width: 200px; padding: 0px 0 0 0px; text-align: left; }
			#friends_colb { float: left; width: 200px; padding: 0px 0 0 0px; text-align: left; }
			#friends_col2 { float: left; width: 200px; padding: 0px 0 0 20px; text-align: left; }
			#friends_col2a { float: left; width: 250px; padding: 5px 0 0 0px; text-align: left; }
			#friends_col3 { float: left; width: 200px; padding: 0px 0 0 0px; text-align: left; }
			#friends_2col { float: left; width: 220px; padding: 7px 0px 0 30px; text-align: left; }
			#friends_5col { float: left; width: 220px; padding: 7px 0px 0 30px; text-align: left; }
			#friends_3col { float: left; width: 220px; padding: 8px 0px 0 0px; vertical-align: middle; text-align: left; }
			#friends_4col { float: left; width: 253px; text-align: left; }
			
			.news { float: left; width: 360px; padding: 70px 15px 15px 30px; text-align: left; }
			.newssml { float: left; width: 300px; padding: 150px 15px 15px 28px; text-align: left; }
			.news2 { float: left; width: 300px; padding: 150px 15px 15px 28px; text-align: left; }
			#news_col { float: left; width: 330px; padding: 0px 0 0 0px; text-align: left; }
			#news_col2 { float: left; width: 300px; padding: 0px 0 0 0px; text-align: left; }
			
			.where { vertical-align: middle;float: left; width: 685px; padding: 70px 15px 15px 30px; text-align: left; }
			.where2 { float: left; width: 300px; padding: 80px 15px 15px 20px; text-align: left; }
			#where_col { float: left; width: 670px; text-align: left; }
			#where_colb { float: left; width: 350px; text-align: left; }
			#where_cola { float: left; width: 350px; text-align: left; }
			.wherein { vertical-align: middle; float: left; width: 170px; padding: 20px 0px 19px 0px; text-align: left; }
			#where_col2 { float: left; width: 300px; text-align: left; }
			#where_col2a { float: left; width: 300px; text-align: left; }
			.wherein { vertical-align: middle; float: left; width: 170px; padding: 20px 0px 19px 0px; text-align: left; }
			
			.promo { float: left; width: 660px; padding: 70px 15px 15px 80px; text-align: left; }
			.promo2 { float: left; width: 300px; padding: 150px 15px 15px 28px; text-align: left; }
			#promo_col { float: left; width: 345px; padding: 142px 0 0 270px; text-align: left; }
			#promo_col2 { float: left; width: 355px; padding: 10px 0 0 270px; text-align: left; }
			#promo_list { float: left; width: 448px; padding: 0px 0 0 0px; text-align: left; }
			
			
			.product_soups { float: right; position: relative; width: 355px; padding: 100px 39px 0px 10px; }
			.product_soup2 { float: left; width: 700px; padding: 10px 0 0px 30px; }
			.product_soup3 { float: left; width: 320px; padding: 8px 20px 0px 360px; }
			.product_soup4 { float: left; width: 330px; padding: 0px 0 0px 0px; }
			.product_soup5 { float: left; width: 300px; padding: 8px 20px 0px 320px; }
			#pr_listsoup { float: left; width: 330px; padding: 0px 0 0 0px; text-align: left; }
			
			.product_liquid { float: right; position: relative; width: 280px; padding: 65px 25px 0px 0px; }
			.productsoup { float: left; width: 330px; padding: 70px 0 0px 40px; }
			.product_liquid2 { float: left; width: 330px; padding: 0px 0 0px 0px; }
			.product_liquidhead { float: left; width: 330px; padding: 10px 0 0px 0px; }
			.product_liquid3 { float: left; width: 330px; padding: 10px 20px 0px 20px; }
			.product_liquid4 { float: left; width: 330px; padding: 10px 0 0px 0px; }
			#pr_listliquid { float: left; width: 330px; padding: 0px 0 0 0px; text-align: left; }
			#pr_listliquida { float: left; width: 330px; padding: 0px 0 0 0px; text-align: left; }
			#pr_listliquid2 { float: left; width: 330px; padding: 0px 0 0 0px; text-align: left; }
			
			
			.hp-width { padding-right: 0px; padding-left: 10px; }
			.large-txt { font-size: 155%; font-weight: bold; }
			.maincol-bottom { clear: both; float: left; position: relative; top: -10px; }
			.leftpanel-address { margin-top: 15px; }
			
			.content { width: 776px; }
			.content h1 { font-size: 110%; color: #CC0000; }
			#main-content .content p { line-height: 20px; margin-bottom: 15px; }
			#main-content #fmcontact p { margin-bottom: 6px; padding: 0; }
			
			.banner { clear: both; padding-bottom: 10px; }
			#php-container { width: 480px; height: 20px; position: absolute; top: 159px; left: 35px; }
			
			span.smlblack { font-family: Arial, Helvetica, sans-serif, Lucida, sans-serif; font-size: 9px; line-height: 12px; color: #00000; font-weight: normal; }
			span.medblack { font-family: Arial, Helvetica, sans-serif, Lucida, sans-serif; font-size: 14px; line-height: 12px; color: #00000; font-weight: bold; }
			span.smlblack2 { font-family: Arial, Helvetica, sans-serif, Lucida, sans-serif; font-size: 9px; line-height: 15px; color: #00000; font-weight: normal; }
			span.headred { font-size: 170%; color: #ED1D24; padding-bottom: 8px; font-style: normal; font-weight: 100; }
			span.smlwhite { font-family: Arial, Helvetica, sans-serif, Lucida, sans-serif; font-size: 10px; line-height: 10px; color: #FFFFFF; font-weight: bold; }
			span.smlyellow { font-family: Arial, Helvetica, sans-serif, Lucida, sans-serif; font-size: 10px; line-height: 10px; color: #F4E838; font-weight: bold; }
			span.boldblack { font-family: Arial, Helvetica, sans-serif, Lucida, sans-serif; font-size: 100%; color: #000000; font-weight: bold;}
			

/* 
---------------------------------------------------------- */	

/* BUTTON*/
			#butt { width: 120px; height: 40px; padding: 45px 20px 0px 210px;} 
			#butt2 { width: 140px; height: 40px; padding: 0px 20px 0px 235px;} 
			#butt3 { float: right; width: 100px; height: 20px; padding: 0px 00px 0px 0px;} 
			#butt4 { width: 140px; height: 40px; padding: 0px 20px 0px 235px;}
			
			.left {  position: absolute; z-index: 999; left: -9999px; padding: 6px; width: 20px;}
			.right {  position: absolute; z-index: 999; left: -9999px; padding: 6px; width: 20px;}
			
			.enter-button { clear: left; margin-left: 20px; background: transparent url(../images/enter.gif) no-repeat 0 0; width: 120px; height: 40px;}
 			.enter-button a { width: 120px; height: 0; display: block; padding-top: 40px; color: #cccccc; overflow: hidden; background: transparent url(../images/enter.gif) no-repeat -120px 0;}
			.enter-button a:hover { background-position: 0 -40px; z-index: 50;}
			
			.arrowleft-button { clear: left; margin-left: 0px; background: transparent url(../images/left_butt.gif) no-repeat 0 0; width: 16px; height: 20px;}
			.arrowleft-button a { width: 16px; height: 0; display: block; padding-top: 0px; color: #cccccc; overflow: hidden; background: transparent url(../images/left_butt_over.gif) no-repeat -16px 0;}
			.arrowleft-button a:hover { background-position: 0 -20px; z-index: 50;}
			
			.arrowright-button { clear: left; margin-right: 0px; background: transparent url(../images/right_butt.gif) no-repeat 0 0; width: 16px; height: 20px;}
			.arrowright-button a { width: 16px; height: 0; display: block; padding-top: 0px; color: #cccccc; overflow: hidden; background: transparent url(../images/right_butt_over.gif) no-repeat -16px 0;}
 			.arrowright-button a:hover { background-position: 0 -20px; z-index: 50;}
				
			/*
			li.button { background: transparent url(../images/enter.gif) no-repeat 0 0; width: 120px; height: 40px; }
			li.button a { width: 120px; height: 40; display: block; padding-top: 30px; color: #000000; overflow: hidden; background: transparent url(../images/enter.gif) no-repeat -140px 0;}
			li.button a:hover { background-position: -2px -56px; z-index: 40;}				
			li.button-over { background: transparent url(../images/enter-over.gif) no-repeat 0 0; width: 120px; height: 0; display: block; padding-top: 0px; color: #cccccc; overflow: hidden;}
			* html li.button a:link, * html li.home a:visited { height: 40px; height:0;}
			* html li.button a:hover { height: 40px; height:0;}
			*/
				
/*
---------------------------------------------------------- */	
/* TABLES*/

			.blackbodysmall { font-family: Arial, Helvetica, sans-serif, Lucida, sans-serif; font-size: 9px; color: #00000; font-weight: bold; padding-left: 5px; margin-left: 5px; }
			.whitebodysmall { font-family: Arial, Helvetica, sans-serif, Lucida, sans-serif; font-size: 9px; color: #FFFFFF; font-weight: bold; padding-left: 5px; margin-left: 5px; }
			tr.red { background: #ED1D24; }
			tr.red { background: #ED1D24; }
			tr.darkgray { background: #F9F09B; }
			tr.lightgray { background: #FCEE22; }
			
/*			

/* SCROLL PANEL*/
			a.jScrollArrowUp { width:21px; height: 15px; background: url(../images/scroll-up.gif) no-repeat 0 0px; }
			a.jScrollArrowDown { width:21px; height: 15px; background: url(../images/scroll-down.gif) no-repeat 0 0px; }
			.jScrollPaneTrack { background: url(../images/scroll-track.gif) left top repeat-y; }
			.jScrollPaneDrag { background: url(../images/scroll-drag-middle.gif) 8px top repeat-y; }
			.jScrollPaneDragTop { background: url(../images/scroll-drag-top.gif) 8px top no-repeat; height:7px; }
			.jScrollPaneDragBottom { background: url(../images/scroll-drag-bottom.gif) 8px top no-repeat; height:7px; }
			
/* SCROLL PANEL- END */


			#scroll_content { overflow:auto; height: 280px; float: left; width: 440px; padding: 10px 0 0px 0px; }

/* 
---------------------------------------------------------- */	
			

			/* MAIN CONTENT STYLES */
			#main-content { font-size: 75%; }
			#floating_bubble { position: absolute; top: 250px; left: 60px;  }
			#floating_bubble2 { position: absolute; top: 230px; right: 145px;  }
			#main-content h1 { font-size: 170%; color: #ED1D24; padding-bottom: 8px; font-style: normal; font-weight: 100; }
			#main-content h2 { font-size: 170%; color: #ED1D24; padding-bottom: 15px; font-style: normal; font-weight: 100; }
			#main-content p { font-size: 100%; line-height: 17px; color: #000000; padding-bottom: 10px; }
			#main-content p.no-padding { padding-bottom: 0; }
			#main-content .col1 img { padding-bottom: 0; margin-bottom: 0; background-color:#FFFFFF;}
			#main-content .colgc img { padding-bottom: 0; margin-bottom: 0; }
			
			#main-contentchef { font-size: 75%; }
			#main-contentchef p { font-size: 100%; color: #ffffff; padding-bottom: 10px; }
			#main-contentchef .colguest img { padding-bottom: 0; margin-bottom: 0; }
			
			#main-contentgc { font-size: 75%; }
			#main-contentgc p { font-size: 100%; color: #ffffff; padding-bottom: 10px; }
			#main-contentgc .colgc img { padding-bottom: 0; margin-bottom: 0; }
			
			#main-content a:link { color: #000000; font-weight: bold; text-decoration: none; }
			main-content a:visited { color: #000000; font-weight: bold; text-decoration: none; }
			main-content a:hover { color: #ED1D24; text-decoration: none; text-decoration: none;}
			
			#main-content ul { margin: 0; padding-bottom: 10px; color: #000000; }
			#main-content ul li { padding: 2px; margin-left: 21px; list-style-type: disc; }
			
			#main-content ol { margin: 0; padding-bottom: 10px; color: #0000000; }
			#main-content ol li { padding: 0; margin-left: 27px; list-style-type: decimal; }	
			
			#main-friends { font-size: 75%; }
			#main-friends p { font-size: 100%; line-height: 17px; color: #000000; padding-bottom: 10px; }
			.blacksmall { font-family: Arial, Helvetica, sans-serif, Lucida, sans-serif; font-size: 9px; color: #00000; font-weight: bold; padding-left: 5px; margin-left: 5px; }
			#main-friends h1 { font-size: 170%; color: #ED1D24; padding-bottom: 15px; font-style: normal; font-weight: 100; }
			
			#main-promo { font-size: 75%; }
			#main-promo p { font-size: 100%; line-height: 17px; color: #000000; padding-bottom: 10px; }
			.blacksmall { font-family: Arial, Helvetica, sans-serif, Lucida, sans-serif; font-size: 9px; color: #00000; font-weight: bold; padding-left: 5px; margin-left: 5px; }
			#main-promo h1 { font-size: 170%; color: #ED1D24; padding-bottom: 15px; font-style: normal; font-weight: 100; }
			#main-promo ul { margin: 0; padding-bottom: 10px; color: #FFFFFF; }
			#main-promo ul li { padding: 2px; margin-left: 21px; list-style-type: disc; }
			
			#main-news { font-size: 75%; }
			#main-news p { font-size: 100%; line-height: 17px; color: #000000; padding-bottom: 10px; }
			.blacksmall { font-family: Arial, Helvetica, sans-serif, Lucida, sans-serif; font-size: 9px; color: #00000; font-weight: bold; padding-left: 5px; margin-left: 5px; }
			#main-news h1 { font-size: 170%; color: #ED1D24; padding-bottom: 15px; font-style: normal; font-weight: 100; }
			
			#main-where { font-size: 75%; }
			#where li { display: inline; border-right: 1px solid #818285; padding-right: 4px; margin-right: 3px; }
			#where .last { border-right: none; }	
			
			.thankyou { float: left; width: 480px; padding: 180px 0 10px 250px; }
			.thankyou2 { float: left; width: 420px; padding: 10px 0 10px 300px; }
			
			#footer { clear: both; padding-bottom: 10px; }
			#footer li { display: inline; border-right: 1px solid #818285; padding-right: 4px; margin-right: 3px; }
			#footer .last { border-right: none; }		
			
				

/* forms

---------------------------------------------------------- */	

/* forms ends
---------------------------------------------------------- */								
			
			
/* footer styles
---------------------------------------------------------- */
			#footer { clear: both; padding-bottom: 10px; }
			#footer .last { border-right: none; }	
			#footer a:link { color: #000000; text-decoration: none; }
			#footer a:visited  { color: #000000; text-decoration: none; }
			#footer a:hover { text-decoration: none; color: #ED1D246; }
			#footer p, #footer ul { font-size: 55%; color: #818285; margin-bottom: 5px; }
			html>/**/body #footer li { display: inline-block; border-right: 1px solid #818285; margin-bottom: 5px; padding-right: 2px; margin-right: 3px; }
						html>/**/body #footer li:last-child { border-right: none; }
			
			#footer li { display: inline; border-right: 1px solid #818285; padding-right: 4px; margin-right: 3px; }
			#footer .last { border-right: none; }	
				
			#ft-logo { float: left; position: relative; display: inline; width: 224px; text-align: right; background-color: #FCEE22; }
			#ft-links { float: left; position: relative; display: inline; width: 510px; padding: 15px 0 0 0px; text-align: left; }
			#ft-ms { float: right; position: relative; width: 260px; text-align: right; padding-right:0px; }		


/* additional styles
---------------------------------------------------------- */ 
			
			/* *** Float containers */ 
			.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
			.clearfix { display: inline-table; }
			/* Hides from IE-mac \*/
			* html .clearfix { height: 1%; }
			.clearfix { display: block; }
			/* End hide from IE-mac */