/*
	IMPORTS
	------------------------------
*/
@import 'lib/reset.css';
@import 'gli.css';

/*
	GLOBAL BASE
	------------------------------
*/
body {
	font: 75%/1.33 'Trebuchet MS', Helvetica, Arial, sans-serif;
	color: #666;
	}

h1,
h2,
h3 {
	margin: 0 0 0.33em;
	color: #e51c37;
	}
	h1 {
		font-size: 3em;
		}
	h2 {
		font-size: 1.5em;
		}
	h3 {
		font-size: 1.25em;
		color: #424242;
		}
		h3.tab {
			float: left;
			margin: 0 0 0 10px;
			width: 160px;
			background: #e51c37;
			border-top-left-radius: 10px;
			border-top-right-radius: 10px;
				-moz-border-radius-topleft: 10px;
				-moz-border-radius-topright: 10px;
				-webkit-border-top-left-radius: 10px;
				-webkit-border-top-right-radius: 10px;
			color: #fff;
			line-height: 2.5em;
			text-align: center;
			}
	h1.white,
	h2.white,
	h3.white,
	h4.white,
	h5.white,
	h6.white {
		color: #fff;
		}
	h1.grey,
	h2.grey,
	h3.grey,
	h4.grey,
	h5.grey,
	h6.grey {
		color: #424242;
		}

h4,
h5,
h6 {
	font-size: 1.166em;
	}

a {
	color: #e51c37;
	text-decoration: none;
	}

p {
	margin: 0 0 1.33em;
	}

address {
	font-style: normal;
	}

table {
	}
	th, td {
		padding: 3px;
		border: 1px solid #fff;
		}

dl {
	overflow: hidden;
	}
	dt {
		float: left;
		clear: left;
		padding: 0 0.25em 0 0;
		}

#logo {
	display: block;
	width: 123px;
	height: 63px;
	background: url('../img/sprite-brand.png') no-repeat;
	text-indent: -9999em;
	}

/*
	LAYOUT
	------------------------------
*/
#masthead {
	height: 78px;
	background: #e51c37;
	}
	#masthead div {
		position: relative;
		padding: 8px 0 0;
		height: 70px;
		margin: 0 auto;
		width: 960px;
		}

#wrap {
	overflow: hidden;
	margin: 30px auto 0;
	width: 960px;
	min-height: 400px;
	}

#leftCol {
	float: left;
	margin: 0 44px 0 0;
	width: 480px;
	}

#rightCol {
	float: left;
	width: 434px;
	}

#footer {
	overflow: hidden;
	margin: 3em 0 1.5em;
	width: 100%;
	color: #797979;
	text-align: center;
	}
	#footer ul {
		position: relative;
		left: 50%;
		float: left;
		}
		#footer li {
			position: relative;
			left: -50%;
			float: left;
			padding: 0 0.75em;
			border-right: 1px solid #797979;
			}
			#footer li.noBorder {
				border: 0;
				}
	#footer a {
		color: #797979;
		}
		#footer a:hover {
			color: #424242;
			}
	#footer p {
		clear: both;
		}

/*
	NAVIGATION
	------------------------------
*/
#nav {
	position: absolute;
	bottom: 0;
	left: 140px;
	}
	#nav li {
		float: left;
		padding: 27px 0 0;
		margin: 0 10px;
		height: 23px;
		}
		#nav li.active {
			min-width: 102px;
			background: url('../img/sprite-brand.png') no-repeat center -227px;
			}
	#nav a {
		display: block;
		margin: 0 auto;
		height: 14px;
		background: url('../img/sprite-brand.png') no-repeat;
		text-indent: -9999em;
		}
		#nav a.home {
			width: 57px;
			background-position: 0 -73px;
			}
		#nav a.recipes {
			width: 77px;
			height: 17px;
			background-position: 0 -97px;
			}
		#nav a.products {
			width: 91px;
			background-position: 0 -124px;
			}
		#nav a.familyAds {
			width: 170px;
			height: 17px;
			background-position: 0 -148px;
			}
		#nav a.oxoHistory {
			width: 141px;
			height: 17px;
			background-position: 0 -175px;
			}
		#nav a.contact {
			width: 107px;
			background-position: 0 -202px;
			}

/*
	PANELS
	------------------------------
*/
.panel {
	overflow: hidden;
	color: #fff;
	}
	.panel h1,
	.panel h2,
	.panel h3 {
		color: #fff;
		}
	.panel img {
		display: block;
		}
	.panel div {
		padding: 13px 10px;
		min-height: 100px;
		/* background: #e51c37 url('../img/sprite-panels.gif') no-repeat left bottom; */
		background: #e51c37;
		}

.panelHorizontal {
	overflow: hidden;
	}
	.panelHorizontal img {
		float: left;
		display: block;
		}
	.panelHorizontal div {
		float: left;
		width: 100px;
		background: #e51c37;
		}

#homeProducts,
#homeRecipes {
	float: left;
	margin: 0 20px 20px 0;
	width: 296px;
	}
	#homeRecipes {
		margin: 0 0 20px;
		}
	#homeProducts div,
	#homeRecipes div {
		/* background: #e51c37 url('../img/sprite-panels.gif') no-repeat -587px bottom; */
		border-bottom-left-radius: 9px;
			-moz-border-radius-bottomleft: 9px;
			-webkit-border-bottom-left-radius: 9px;
		}
	#homeProducts .btnPanel {
		margin: 0 0 0 48px;
		width: 228px;
		/* background: #e51c37 url('../img/sprite-panels.gif') no-repeat -893px bottom; */
		}
	#homeRecipes .btnPanel {
		margin: 0 0 0 60px;
		width: 216px;
		/* background: #e51c37 url('../img/sprite-panels.gif') no-repeat -893px bottom; */
		}

#homeOXOFactor {
	width: 612px;
	}
	#homeOXOFactor div {
		padding: 20px 20px 20px 20px;
		width: 288px;
		height: 130px;
		/* background: #e51c37 url('../img/sprite-panels.gif') no-repeat -1149px bottom; */
		border-top-right-radius: 10px;
			-moz-border-radius-topright: 10px;
			-webkit-border-top-right-radius: 10px;
		}
	#homeOXOFactor .btnPanel {
		clear: left;
		margin: 0 0 0 427px;
		width: 165px;
		/* background: #e51c37 url('../img/sprite-panels.gif') no-repeat -1487px bottom; */
		}

.panelSplit {
	overflow: hidden;
	float: left;
	margin: 0 22px 0 0;
	width: 612px;
	}

/*
	BOXES
	------------------------------
*/
.box {
	padding: 15px;
	border-radius: 10px;
		-moz-border-radius: 10px;
		-webkit-border-radius: 10px;
	}
	.box h1,
	.box h2,
	.box h3 {
		color: #424242;
		}

.boxGrey {
	margin: 0 0 1em;
	background: #eee;
	}
	.boxGrey p {
		margin: 0;
		}
.boxRed,
.boxYellow,
.boxGreen,
.boxPurple {
	margin: 0 0 1.5em;
	color: #fff;
	}
	.boxRed {
		background: #e51c37;
		}
	.boxYellow {
		background: #d2ac02;
		}
	.boxGreen {
		background: #7fb158;
		}
	.boxPurple {
		background: #7b3b84;
		}

.boxBorder {
	border: 3px solid #e51c37;
	}
	form.boxBorder {
		padding: 15px 15px 2.5em 15px;
		}
.singleBox {
	margin-top: 90px;
}
/*
	BUTTONS
	------------------------------
*/
.btnPanel {
	display: block;
	padding: 0 20px 0 0;
	height: 27px;
	background: #e51c37 url('../img/sprite-brand.png') no-repeat right -290px;
	/*background: #e51c37 url('../img/sprite-panels.gif') no-repeat -1945px 1px; */
	border-bottom-left-radius: 9px;
	border-bottom-right-radius: 9px;
		-moz-border-radius-bottomleft: 9px;
		-moz-border-radius-bottomright: 9px;
		-webkit-border-bottom-left-radius: 9px;
		-webkit-border-bottom-right-radius: 9px;
	font: 1.166em 'Gill Sans', 'Gill Sans MT', 'Arial Black', Arial, sans-serif;
	color: #fff;
	line-height: 22px;
	text-align: center;
	}

/*
	FORM
	------------------------------
*/
form {
	position: relative;
	}
	form li {
		clear: left;
		padding: 0.33em 0;
		}
	form label {
		float: left;
		display: block;
		width: 100px;
		font-weight: bold;
		}
		form label.check {
			padding: 0 0 0 20px;
			margin: 0 0 0 100px;
			width: 270px;
			}
			form label.check input {
				float: left;
				width: auto;
				margin: 0 0 0 -20px;
				}
	form input, form select, form textarea {
		width: 290px;
		font: 1em/1.25 Helvetica, Arial, Tahoma, sans-serif;
		color: #333;
		}
		form input:focus, form select:focus, form textarea:focus {
			border: 2px solid #e51c37;
			}
	form button {
		position: absolute;
		right: 0;
		bottom: 0;
		padding: 0 20px 0 0;
		width: 180px;
		height: 34px;
		/* background: #e51c37 url('../img/sprite-panels.gif') no-repeat -397px top; */
		background: #e51c37 url('../img/sprite-brand.png') no-repeat right -284px;
		border: none;
		border-top-left-radius: 9px;
			-moz-border-radius-topleft: 9px;
			-webkit-border-top-left-radius: 9px;
		font-size: 1.25em;
		color: #fff;
		text-align: center;
		cursor: pointer;
		}

/*
	PRODUCT PANELS
	------------------------------
*/
#productPanels {
	overflow: hidden;
	color: #fff;
	}
	#productPanels h2 {
		margin: 0 auto;
		width: 200px;
		height: 3em;
		color: #fff;
		text-align: center;
		}
	#productPanels img {
		display: block;
		}
	#productPanels li {
		float: left;
		margin: 0 30px 0 0;
		width: 280px;
		}
		#productPanels li div {
			padding: 5px 10px;
			height: 210px;
			/* background: #e51c37 url('../img/sprite-panels.gif') no-repeat left bottom; */
			background: #e51c37;
			border-bottom-left-radius: 18px;
				-moz-border-radius-bottomleft: 18px;
				-webkit-border-bottom-left-radius: 18px;
			}
		#productPanels li .btnPanel {
			margin: 0 0 0 186px;
			width: 74px;
			/* background: #e51c37 url('../img/sprite-panels.gif') no-repeat -290px bottom; */
			font-size: 1.25em;
			}

/*
	PRODUCT INFO
	------------------------------
*/
#productIntro {
	overflow: hidden;
	margin: 0 0 1em;
	}
	#productIntro img {
		display: block;
		float: left;
		margin: 0 20px 0 0;
		}

#productVariations {
	position: relative;
	padding: 0;
	width: 460px;
	}
	#productVariations li {
		overflow: hidden;
		clear: left;
		padding: 10px 15px 10px 130px;
		min-height: 80px;
		}
		#productVariations li:hover {
			width: 100%;			
			background: #e51c37;
			border-top-left-radius: 15px;
			border-bottom-left-radius: 15px;
				-moz-border-radius-topleft: 15px;
				-moz-border-radius-bottomleft: 15px;
				-webkit-border-top-left-radius: 15px;
				-webkit-border-bottom-left-radius: 15px;
			color: #fff;
			}
		#productVariations li img {
			float: left;
			margin: 0 0 0 -115px;
			}
		#productVariations li div {
			display: none;
			}
			#productVariations li:hover div {
				position: absolute;
				bottom: -18px;
				left: 480px;
				display: block;
				width: 450px;
				}
			#productVariations li div p {
				width: 100%;
				}
		#productVariations li p {
			width: 300px;
			}

/*
	RECIPES
	------------------------------
*/
#recipesNav {
	float: left;
	margin: 0 20px 0 0;
	width: 210px;
	}
	#recipesNav li {
		border-bottom: 1px dotted #c0c0c0;
		}
	#recipesNav a {
		display: block;
		padding: 0.5em;
		color: #666;
		}
		#recipesNav a:hover {
			background: #e51c37;
			color: #fff;
			}

#recipesContent {
	float: left;
	padding: 0.5em 0 0;
	margin: 0 20px 0 0;
	width: 380px;
	}
	#recipesContent h1,
	#recipesContent h2 {
		margin: 0 0 0.75em;
		min-height: 2.65em;
		font-size: 1.5em;
		}
	#recipesModule {
		padding: 0;
		}
		#recipesModule h3 {
			padding: 0.75em 15px;
			}
		#recipesModule img {
			display: block;
			}
		#recipesModule div {
			padding: 10px 20px;
			background: #e51c37;
			color: #fff;
			}
			#recipesModule div h4 {
				margin: 0 0 0.5em;
				}
			#recipesModule div p {
				margin: 0;
				}
		#recipesModule ol,
		#recipesModule ul {
			margin: 0 15px 0 30px;
			}
			#recipesModule ol {
				list-style: decimal;
				}
			#recipesModule ul {
				list-style: disc;
				}
		#recipesModule li {
			margin: 0 0 0.33em;
			}
		#recipesModule p {
			margin: 0 15px 1.33em;
			}
		#recipesModule .btnPanel {
			margin: 0 0 0 224px;
			width: 130px;
			border-bottom-right-radius: 0;
				-moz-border-radius-bottomright: 0;
				-webkit-border-bottom-right-radius: 0;
			}
	#recipesFeatured {
		margin: 0 15px !important;
		list-style: none !important;
		}
		#recipesFeatured li {
			overflow: hidden;
			clear: left;
			padding: 0 0 0 150px;
			margin: 0 0 2em;
			}
		#recipesFeatured a {
			text-decoration: underline;
			}
			#recipesFeatured h5 a {
				color: #424242;
				text-decoration: none;
				}
		#recipesFeatured img {
			float: left;
			margin: 0 0 0 -150px;
			}

#recipesRight {
	float: left;
	padding: 5.5em 0 0;
	width: 322px;
	}
	#recipesRight .box ul {
		list-style: disc;
		margin: 0 0 0 1em;
		}
		#recipesRight .box ul li {
			margin: 0.5em 0 0.25em;
			}
	#recipesRight #gliModule {
		float: none;
		margin: 0 0 2em;
		}

#recipesTip {
	}
	#recipesTip label {
		width: 80px;
		}
		#recipesTip label.check {
			margin: 0 0 0 80px;
			width: 206px;
			}
			#recipesTip label.check input {
				width: auto;
				}
	#recipesTip input, #recipesTip select, #recipesTip textarea {
		width: 206px;
		}
	#recipesTip textarea {
		height: 100px;
		}

/*
	VIDEO GALLERY
	------------------------------
*/
#oxoPlayer {
	margin: 0 0 1em;
	width: 480px;
	height: 360px;
	}

#videoGallery {
	clear: left;
	overflow: hidden;
	padding: 8px;
	border: 5px solid #e51c37;
	border-radius: 10px;
		-moz-border-radius: 10px;
		-webkit-border-radius: 10px;
	}
	#videoGallery li {
		overflow: hidden;
		float: left;
		margin: 8px;
		width: 86px;
		height: 48px;
		}
		#videoGallery li:hover {
		box-shadow: 0px 0px 5px #e51c37;
			-moz-box-shadow: 0px 0px 5px #e51c37;
			-webkit-box-shadow: 0px 0px 5px #e51c37;
			}
	#videoGallery img {
		display: block;
		margin: -8px 0;
		width: 86px;
		height: 64px;
		}

/*
	SITE MAP
	------------------------------
*/
#sitemap {
	line-height: 1.5em;
	}
	#sitemap ol, #sitemap ul {
		margin: 0 0 0 1.5em;
		}

/*
	OVERLAY
	------------------------------
*/
#superTed {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #000;
	cursor: pointer;
	z-index: 100;
	}

#overlay {
	position: absolute;
	top: 100px;
	left: 50%;
	padding: 5px;
	margin: 0 0 0 -250px;
	width: 450px;
	height: 525px;
	background: #fff;
	border: 3px solid #e51c37;
	border-radius: 15px;
		-moz-border-radius: 15px;
		-webkit-border-radius: 15px;
	color: #0061a1;
		-moz-box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.25);
	z-index: 200;
	}
	#overlay iframe {
		overflow-y: scroll;
		overflow-x: hidden;
		}

#btnClose {
	position: absolute;
	top: -14px;
	right: -14px;
	width: 28px;
	height: 28px;
	background: url('../img/sprite-brand.png') no-repeat -133px 0;
	cursor: pointer;
	}