@charset "utf-8";
/* CSS Document */


/*===  GLOBAL  ===*/
body { color: #1e1e1e; font-family: Arial, Helvetica, sans-serif;}
object, embed { outline: none;}
a, a:visited, a:active { color: #00539b;}
strong { font-weight: bold;}
em { font-style: italic;}
.clear {clear: both;}
.green { color: #6d7300;}
.showMe {display: none;}

/*===  POPUPS  ===*/
.popupWrap { position: relative;}	
	.bag { height: 640px; width: 784px;}
	.pi {height: 472px; width: 624px;}
	.nutrition { height: 602px; width: 754px;}
	.disclaimer { height: 350px; width: 390px;}
	
	.popupWrap .popupHead { background: #1d75c2; height: 81px;}
	.popupHead h1 { color: #f3f7af; font-size: 18px; font-weight: bold; margin: 0; padding: 15px 0 0; text-align: center;}
	
	.popupBody { padding: 30px 15px;}
	.popupBody .lcol { display: inline; float: left;}
		.bag .popupBody .lcol { float: none; position: absolute; top: 200px; width: 270px;}
		.pi .popupBody .lcol { width: 265px;}
		.nutrition .popupBody .lcol { width: 285px;}
		.disclaimer .popupBody .lcol { width: 340px;}
	.popupBody .rcol { display: inline; float: right;}
		.bag .popupBody .rcol { width: auto;}
		.pi .popupBody .rcol { width: 250px;}
		.nutrition .popupBody .rcol { width: 420px;}
	
	.popupBody .lcol p { color: #000; font-size: 12px; line-height: 18px; margin: 0;}
	.popupBody .lcol h5 { color: #00539b; font-size: 14px; font-weight: bold;}
		.pi .popupBody .lcol h5 { margin: 65px 0 12px;}
	/*===  nutrition  ===*/
	.popupBody ul.blue {}
		.pi .popupBody ul.blue { margin-top: 35px;}
	.popupBody ul.blue li { color: #00539b; list-style-type: disc; margin: 0 0 0 15px;}
		.popupBody ul.blue li p { color: #00539b; font-size: 14px; font-weight: bold; line-height: auto; margin: 0 0 15px;}
	.popupBody ul.generic { margin: 0 0 55px;}
		.pi .popupBody ul.generic { margin: -10px 0 15px;}
		.bag .popupBody ul.generic { margin-bottom: 15px;}
	.popupBody ul.generic li { color: #000; font-size: 10px; list-style-type: disc; margin: 0 0 0 30px;}
		.pi .popupBody ul.generic li { font-family: Arial, Helvetica, sans-serif; font-size: 12px; list-style-type: decimal;}
	.popupBody ul.generic li p { color: #000; font-size: 12px; font-weight: normal; margin: 0 0 5px;}
	
	.popupFoot { background: #eff2f4; bottom: 0; height: 56px; position: absolute; width: 100%;}
	.popupFoot p { margin: 7px 0 0; text-align: right;}
		.popupFoot p a { margin-left: 5px;}
		
	/*===  video  ===*/		
	#videoPopup { overflow: hidden; width: 816px; height:auto;}	
		#videoHead { height: 55px; overflow: hidden; padding: 0 185px 0 9px; position: relative; width: 635px;}
			#videoHead .headline { color: #00539B; font-size: 18px; height: 55px; line-height: 55px; font-weight:bold;}
				#videoHead .headline span { color: #9fa618; font-size: 21px; margin: 0 12px 0 0;}
			#videoHead .transcript { font-size: 12px; font-weight: bold; line-height: 20px; position: absolute; right: 25px; top: 20px;}
				#videoHead .transcript a { color: #1453b0; text-decoration: none;}
				#videoHead .transcript img { margin: 0 8px 0 0; vertical-align: middle;}
			
		
		#videoBody { height: 505px; padding: 0 0 0 8px;}
		
		#videoFoot { background: #1b1d0c; font-size: 12px; height:auto; padding: 0 10px; width:100%;}
			#videoFoot a { color: #FFF; display: block; font-weight: bold; text-decoration: none;}
				#videoFoot a span { color: #929a15; text-decoration: none;}
			
			#videoFoot .col1 { float: left; padding: 6px 35px 0 0; width: 285px;}
			#videoFoot .col2 { float: left; padding: 6px 35px 0 0; width: 219px;}
			#videoFoot .col3 { float: left; padding: 6px 0 0 0; width: 226px;}
			#videoFoot .chapterItem { margin: 0 0 6px; padding: 6px 0 6px 10px;}
			#videoFoot .active { background: #646715;}
				#videoFoot .active a { color: #FFF;}
				#videoFoot .active a span { color: #FFF;}
	
/*===  SQUEEZE BOX  ===*/
#sbox-overlay {
	position: absolute;
	background-color: #000;
	left: 0;
	top: 0;
}

#sbox-window {
	position: absolute;
	background-color: #fff;
	text-align: left;
	overflow: visible;
	padding: 3px;
	/* invalid values, but looks smoother! */
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
}

#sbox-btn-close {
	position: absolute;
	width: 30px;
	height: 30px;
	right: -15px;
	top: -15px;
	background: url(../images/closebox.png) no-repeat center;
	border: none;
}

.sbox-loading #sbox-content {
	background-repeat: no-repeat;
	background-position: center;
}

#sbox-content {
	clear: both;
	overflow: auto;
	background-color: #fff;
	height: 100%;
	width: 100%;
}

.sbox-content-image#sbox-content {
	overflow: visible;
}

#sbox-image {
	display: block;
}

.sbox-content-image img {
	display: block;
	width: 100%;
	height: 100%;
}

.sbox-content-iframe#sbox-content {
	overflow: visible;
}

/* Hides flash (Firefox problem) and selects (IE) */
.body-overlayed {
	/*overflow: hidden;*/
}
.body-overlayed embed, .body-overlayed object, .body-overlayed select {
	visibility: hidden;
}
#sbox-window embed, #sbox-window object, #sbox-window select {
	visibility: visible;
}

/* Shadows */
.sbox-bg {
	position: absolute;
	width: 33px;
	height: 40px;
}

.sbox-bg-n {
	left: 0;
	top: -40px;
	width: 100%;
}
.sbox-bg-ne {
	right: -33px;
	top: -40px;
}
.sbox-bg-e {
	right: -33px;
	top: 0;
	height: 100%;
}
.sbox-bg-se {
	right: -33px;
	bottom: -40px;
}
.sbox-bg-s {
	left: 0;
	bottom: -40px;
	width: 100%;
}
.sbox-bg-sw {
	left: -33px;
	bottom: -40px;
}
.sbox-bg-w {
	left: -33px;
	top: 0;
	height: 100%;
}
.sbox-bg-nw {
	left: -33px;
	top: -40px;
}

