/* 
Author: 	Pete Boere 
Company: 	Hyperlaunch New Media
*/
/*-------------------------------------------------------------------------------------- Browser reset and utilities ---*/
html{overflow-y:scroll;}div,ul,ol,li,dt,dd,dl,blockquote,fieldset,object,table,td,th,p,h1,h2,h3,h4,h5,h6,body,form{padding:0;margin:0;}ul,ol{list-style:none;}abbr,img,fieldset{border:0;}.tr{text-align:right;}.tl{text-align:left;}.fl{float:left;}.fr{float:right;}.tc{text-align:center;}.hide{display:none;visibility:hidden;}textarea{overflow-y:auto;}table{border-collapse:collapse;}

.ca:after, .content:after, .li-ca li:after, #nav-1:after 
	{content:".";display:block;visibility:hidden;height:0;clear:both;}
.ca, .content, .li-ca li, #nav-1 
	{zoom:1;}

/*-------------------------------------------------------------------------------------- Generic styles ---*/
body {background:#fff url(../images/skin/bg/top-tile.jpg) top center repeat-x;font:11px/1.2 arial,sans-serif;
	color:#555;padding-bottom:4em;}
a {text-decoration:none;color:#cc3433;}
a:hover {text-decoration:underline;}
input.text, select, textarea {font:11px arial,sans-serif;color:#555;}
hr {background-color: #DFDFDF; border: 0;height: 1px;}

/*-------------------------------------------------------------------------------------- Consistent elements ---*/
#wrap {width:849px;margin:0 auto;min-height:630px;background:#fff url(../images/skin/bg/top-grad.jpg) top center repeat-x;}
#wallpaper {background:url(../images/skin/bg/page-shadow.png) center 95px no-repeat;}

#header {position:relative;height:110px;z-index:100;}
	#logo a {position:absolute;top:4px;left:0;width:80px;height:60px;
		background:url(../images/skin/logo.gif) left center no-repeat;text-indent:-999px;overflow:hidden;}

#footer {background:#8f8f90;padding:5px 17px 5px;color:#fff;}
	#footer ul {float:left;}
	#footer li {float:left;margin-right:10px;}
	#footer span {position:relative;top:-1px;}
	#footer p {float:right;}
	#footer a {color:#fff;}

	
#nav-1 {background:url(../images/skin/bg/nav.png) no-repeat;position:absolute;top:65px;
	width:100%;height:auto;padding:2px 0 0 2px;}
	#nav-1 li {float:left;border-right:2px solid #fff;padding-bottom:5px;}
	#nav-1 li.last {border:0;}
	#nav-1 a {float:left;color:#fff;font-weight:bold;font-size:12px;padding:11px 20px 3px 6px;zoom:1;}
	#nav-1 a:hover {background:url(../images/skin/nav/hover-bg.png) no-repeat;text-decoration:none;}
	#nav-1 li.on a {border-bottom:4px solid #cc3433;padding-bottom:5px;}
	
	#nav-1-news a {width:38px;}
	#nav-1-our-brands a {width:70px;}
	#nav-1-consumer-care a {width:95px;}
	#nav-1-health-and-nutrition a {width:117px;}
	#nav-1-sustainability a {width:83px;}
	#nav-1-community a {width:71px;}
	#nav-1-working-for-ub a {width:93px;}
	#nav-1-about-us a {width:55px;}
	
	#consumerCare #nav-1-consumer-care a,
	#healthNutrition #nav-1-health-and-nutrition a,
	#sustainability #nav-1-sustainability a,
	#community #nav-1-community a,
	#workingForUb #nav-1-working-for-ub a,
	#about #nav-1-about-us a,
	#Home #nav-1-home a,
	#OurBrands #nav-1-our-brands a,
	#News #nav-1-news a {border-bottom:4px solid #cc3433;padding-bottom:5px;}

	#nav-1 li {position:relative;}	
		#nav-1 div {position:absolute;background:url(../images/skin/nav/trans-white.png);width:165px;
			top:28px;left:-2px;border:2px solid #fff;display:none;}
		#nav-1 div ul {border-bottom:4px solid #cc3433;}
		#nav-1 div li {float:none;border:0;border-bottom:2px solid #fff;padding:0;}
		#wrap #nav-1 div a {float:none;padding:5px 5px 5px 13px;display:block;width:auto;color:#cc3433;
			border:0;}
		#nav-1 div a,
		#nav-1 div a:hover {background:url(../images/skin/nav/nav-bullet.png) 5px 13px no-repeat;}
		#nav-1 div a:hover {background-color:#fff;}
		#nav-1 > li:hover {z-index:100;letter-spacing:0;}
		#nav-1 > li:hover div {display:block;}
		#nav-1-about-us div {left:auto;right:-2px;}
	
	/* The French Version of the Nav */
	.francais #nav-1 a {font-size:10px;padding:12px 2px 3px 5px;}
	.francais #nav-1-news a {width:52px;}
	.francais #nav-1-our-brands a {width:68px;}
	.francais #nav-1-consumer-care a {width:83px;}
	.francais #nav-1-health-and-nutrition a {width:222px;}
	.francais #nav-1-sustainability a {width:109px;}
	.francais #nav-1-community a {width:67px;}
	.francais #nav-1-working-for-ub a {width:93px;}
	.francais #nav-1-about-us a {width:78px;}
	.francais #nav-1 ul a {font-size:11px;padding:5px 5px 5px 13px;}
	
	.francais #nav-2 a{
		padding: 0px;
		padding-left: 10px!important;
		padding-right: 10px!important;
	}
	#nav-2 ul, #nav-2 li{
		list-style:none!important;
	}
	
#header-site-search {position:absolute;top:15px;right:0;}
	#header-site-search input {vertical-align:middle;}
	#header-site-search label span {position:absolute;top:-100em}
	#header-site-search input.text {border:1px solid #adafb4;border-right:0;padding:0px 2px 1px;position:relative;left:3px;}
	html.ie #header-site-search {top:14px;}
	html.webkit #header-site-search input.text {padding:1px 2px 2px;position:relative;left:5px;}
	
#language-options {position:absolute;top:37px;right:0;}
	#language-options a {padding:0 20px 0 0;color:#fff;}
	#lang-french {background:url(../images/skin/flag-icons/france.png) right 2px no-repeat;}
	#lang-english {background:url(../images/skin/flag-icons/uk.png) right 2px no-repeat;}


/*-------------------------------------------------------------------------------------- Reusable styles ---*/
.content {min-height:499px;_height:499px;padding:22px 55px 20px;position:relative;}
	.content h1, 
	.content h2,
	.content h3 {letter-spacing:-1px;font-weight:normal;}
	.content h1, 
	.content h2 {font-size:19px;color:#cc3433;}
	.content h3 {font-size:16px;color:#555;}
	h1.border,
	h2.border,
	h3.border {border-bottom:1px solid #dfdfdf;margin-bottom:.4em;}
	.content h1.article,
	.content h2.article,
	.content h3.article {color:#484db4;letter-spacing:0;font-size:12px;
		font-weight:bold;letter-spacing:1px;border:0;padding:0 0 1.2em;} 
	.content p {line-height:1.4;padding:0 0 1em;}
	.content p.date-stamp {position:absolute;font-size:10px;color:#484db4;padding:0;}
	.content .image-wrapper {text-align:center;}
	.layout-wide {padding-left:35px;padding-right:35px;}

	p.cta {text-align:right;padding:5px 0;color:#cc3433;}
	p.cta  span {float:left;font-weight:bold;}
	p.cta  span h5{color:#555555;}
	p.cta a span {display:none;}
	p.cta a {font-weight:bold;background:url(../images/skin/btns/more-cta.gif) right 2px no-repeat;
		padding:2px 18px 3px 0;color:#222;}
	#Home .content {padding-top:17px;}
	
.flow-area {}
	.flow-area h2,
	.flow-area h3 {color:#484db4;letter-spacing:0;font-size:12px;
		font-weight:bold;letter-spacing:1px;border:0;padding:1.2em 0 .3em;}
	.flow-area h1 + h2 {padding-top:.5em;}
		

#nav-2 {padding:6px 0;border:1px solid #dfdfdf;border-width:1px 0;margin-bottom:1em;}
	#nav-2 li {float:left;}
	#nav-2 li.on a {color:#cf4140;}
	#nav-2 a {float:left;font-size:12px;font-weight:bold;color:#828282;padding:0px 18px;
		border-left:2px solid #ddd;}
	#nav-2 li.first a {padding-left:2px;border-left:0;}

.paging-nav {text-align:right;}
	.paging-nav a span {display:none;}
	.paging-nav a {font-weight:bold;color:#535353;font-size:12px;padding:5px 2px;zoom:1;}
	.paging-nav .disabled {color:#cbcbcb;cursor:default;}
	.paging-nav .disabled:hover {text-decoration:none;}
	.paging-nav .prev,
	.paging-nav .next {font-size:11px;}	
	.paging-nav .prev {background:url(../images/skin/bg/pager-back.png) left 5px no-repeat;padding-left:19px;
		margin-right:5px;}
	.paging-nav .next {background:url(../images/skin/bg/pager-next.png) right 5px no-repeat;padding-right:19px;
		margin-left:5px;}	
	.paging-nav .prev.disabled {background-image:url(../images/skin/bg/pager-back-disabled.png);}
	.paging-nav .next.disabled {background-image:url(../images/skin/bg/pager-next-disabled.png);}	
	.paging-nav .selected {color:#cf255a;font-size:15px;
		background:url(../images/skin/bg/pager-selected.png) center no-repeat;margin:0 1px 0;
			padding-left:6px;padding-right:6px;}	

/*-------------------------------------------------------------------------------------- Layout styles ---*/
.column-1 {float:left;width:452px;}
.column-2 {float:right;width:250px;padding-top:26px;}
.template-column-2 {float:right;width:250px;}
	.column-2 h3 {font-weight:bold;font-size:11px;color:#cf5151;letter-spacing:0;}
	.column-2 p {line-height:1.2;}
	.column-2 .section {padding-bottom:1em;}
	.section.brand-facts h2 {margin-bottom:.1em;}
	
	.template-column-2 h3 {font-weight:bold;font-size:11px;color:#cf5151;letter-spacing:0;}
	.template-column-2 p {line-height:1.2;}
	.template-column-2 .section {padding-bottom:1em;}
	.section.brand-facts h2 {margin-bottom:.1em;} 	
	
/*-------------------------------------------------------------------------------------- Brands region ---*/
.table-brands {margin:1em 0 2em;}

.list-brand-facts {}
	.list-brand-facts h3 {padding:5px 0;border:1px solid #dfdfdf;border-width:1px 0;margin:0 0 .5em;}

/*-------------------------------------------------------------------------------------- News region ---*/
.list-news-archive {}
	.list-news-archive li {position:relative;padding:.8em 0 .8em;border-bottom:1px solid #dfdfdf;zoom:1;}
	.list-news-archive .date-stamp {left:0;bottom:12px;}
	.list-news-archive p.cta {margin-top:-5px;}

.section.news-archive .flash-text {margin:0;}


.list-archive {}
	.list-archive li {position:relative;border-bottom:1px solid #dfdfdf;zoom:1;}
	.list-archive .date-stamp {left:0;bottom:12px;}
	.list-archive p.cta {margin-top:-5px;}
	

/*
.flash-text,
.flash-text object {visibility:visible !important;}
*/

#News .column-1 {position:relative;}
	#News .column-1 p {right:0;top:5px;}
#News .column-2 {padding-top:0;}
#News #nav-2 {width:452px;margin-bottom:1.75em;}
#News h1.article {padding-top:.3em;} 

/*-------------------------------------------------------------------------------------- Home page ---*/
#home-banner {padding:0 0 22px;}
#roll_over {position:absolute;top:20px;width:100%;height:84px}
#home-column-1 {float:left;width:265px;margin-right:66px;}
	#home-column-1 h2 {margin:0;}
#home-column-2 {float:left;width:248px;}
	#home-column-2 .image-wrapper {padding:0 0 5px;}
	#home-column-2 h2 {margin:0 0 .8em;}
#our-brands {padding-top:10px;}
	#our-brands-trim {height:80px;position:relative;}
	#our-brands h2 {border:0;margin:10px 0 5px;}
	#our-brands img {position:absolute;top:0;left:-24px;}
	#swf_brands {position:absolute;top:0;left:0;}

	#home-column-wrapper {min-height:268px;_height:268px;}

#nav-home-feature {text-align:center;width:115px;position:absolute;right:47px;top:148px;}
	#nav-home-feature li {padding:0 0 1.5em;}
	#nav-home-feature a {color:#222;display:block;padding-top:53px;zoom:1;}
	#nav-home-feature-working-for-ub {background:url(../images/homepage/handshake.png) center 0 no-repeat;}
	#nav-home-feature-sustainability {background:url(../images/homepage/leaf.png) center 0 no-repeat;}
	#nav-home-feature-health-and-nutrition {background:url(../images/homepage/wheat.png) center 0 no-repeat;}
	#nav-home-feature-contact {background:url(../images/homepage/contact.jpg) center 0 no-repeat;}

#home-news h3 {border-bottom:1px solid #dfdfdf;margin:0 0 5px;}
	#home-news p {padding:0;line-height:1.2;}
	#home-news .cta {padding:5px 0;} 
	#home-news li {padding:7px 0 1em;border-top:1px solid #dfdfdf;}

/*-------------------------------------------------------------------------------------- Contact page ---*/
#contact-us {margin:0 auto;width:269px;}
	#contact-us .list-fields li {padding:0 0 .8em;}
	#contact-us label {display:block;font-weight:bold;color:#cc3433;padding:0 0 .3em;font-size:13px;}
	#contact-us input.text,
	#contact-us textarea,
	#contact-us select {border:1px solid #adafb4;}
	#contact-us li.submit {border-top:1px solid #dfdfdf;text-align:right;padding:1em 0 0;margin-top:10px;}
	#contact-us input.text,
	#contact-us textarea {width:100%;padding:2px 3px;}
	#contact-us textarea {height:112px;}

/* other contact us page */
.contactuspage h3 {color:#484db4;}


.column-1 ul{
	list-style:inside!important;
	padding-left: 10px;
	margin-bottom: 5px;
}
.cta span{
	text-align: left!important;
}

/*-------------------------------------------------------------------------------------- Competition page ---*/
div.comp_left{width:230px; float:left;}
div.comp_right{width:200px; float:left; padding-left:30px;}
#competition {float:left; width:269px;}
	#competition .list-fields li {padding:0 0 .8em;}
	#competition label {display:block;font-weight:bold;color:#cc3433;padding:0 0 .3em;font-size:13px;}
	#competition input.text,
	#competition textarea,
	#competition select {border:1px solid #adafb4;}
	#competition li.submit {border-top:1px solid #dfdfdf;text-align:right;padding:1em 0 0;margin-top:10px;}
	#competition input.text,
	#competition textarea {width:95%;padding:2px 3px;}
	#competition textarea {height:112px;}