/*-------------------------------------------------
Title:		SuperC styles for screen media
Updated:	July 21 2010
------------------------------------------------- */





/* link styles
------------------------------------------------- */
a:link,
a:visited,
a:hover,
a:active {
	color: #0360a6;
	text-decoration: underline;
	}
	
a:hover {
	text-decoration: none;
	}
	
a:active {
	}

#footer a:link,
#footer a:visited,
#footer a:hover,
#footer a:active {
	color: #666;
	}

#footer a:hover {
	color: #0360a6;
	text-decoration: underline;
	}

.immunity, a.immunity, .multi .immunity strong {color: #dd5900;}
.energy, a.energy, .multi .energy strong {color: #aa004f;}
.sleep, a.sleep, .multi .sleep strong {color: #339e35;}
.bone, a.bone, .multi .bone strong {color: #d62828;}
.slender, a.slender, .multi .slender strong {color: #f95e59;}
.sport, a.sport, .multi .sport strong {color: #7fba00;}
.recovery, a.recovery, .multi .recovery strong {color: #462670;}

.product .nav a:link,
.product .nav a:visited,
.product .nav a:hover,
.product .nav a:active {
	color: #999;
	text-decoration: none;
	}

.product .nav a:hover {
	text-decoration: underline;
	}

.product .view {
	display: block;
	font-size: 1.2em;
	width: 21em;
	padding: 0 0 0 1em;
	background: url(../img/ui/bullets/raquo_0360a6.png) no-repeat 0 .1666em;
	}

.more {
	color: #999 !important;
	font-size: .8333em;
	text-decoration: none !important;
	text-transform: uppercase;
	padding: 0 1.2em 0 0;
	}

.more:hover {
	background: url(../img/ui/bullets/raquo_0360a6.png) no-repeat 100% 50%;
	color: #0360a6 !important;
	text-decoration: underline !important;
	}

.fb {
	padding-left: 20px;
	background: url(../img/ui/icons/facebook.gif) no-repeat 0 50%;
	}
/* -------------------------------------------------
                                  end link styles */





/* typography
------------------------------------------------- */
h1 {
	font-size: 1.8em;
	line-height: 1;
	margin: 0 0 1em 0;
	}

h2 {
	font-size: 1.4em;
	line-height: 1.2857;
	}
	
	.product h2 {
		font-size: 1.2em;
		font-weight: normal;
		line-height: 1;
		margin: 0 0 1.5em 0;
		text-transform: uppercase;
		}
	
	.product h2 em {
		display: block;
		font-size: 1.666em;
		font-style: normal;
		font-weight: bold;
		}

	.blurb .copy h2 a:link,
	.blurb .copy h2 a:visited,
	.blurb .copy h2 a:hover,
	.blurb .copy h2 a:active {
		padding: 0 0 0 13px;
		background-repeat: no-repeat;
		background-position: 0 .2143em;
		}

	.blurb .copy h2 a.immunity {background-image: url(../img/ui/bullets/raquo_dd5900_16.png);}
	.blurb .copy h2 a.energy {background-image: url(../img/ui/bullets/raquo_aa004f_16.png);}
	.blurb .copy h2 a.sleep {background-image: url(../img/ui/bullets/raquo_339e35_16.png);}
	.blurb .copy h2 a.bone {background-image: url(../img/ui/bullets/raquo_d62828_16.png);}
	.blurb .copy h2 a.slender {background-image: url(../img/ui/bullets/raquo_f95e59_16.png);}
	.blurb .copy h2 a.sport {background-image: url(../img/ui/bullets/raquo_7fba00_16.png);}
	.blurb .copy h2 a.recovery {background-image: url(../img/ui/bullets/raquo_462670_16.png);}
	
h3 {
	color: #0360a6;
	font-size: 1.2em;
	line-height: 1.5;
	text-transform: uppercase;
	}
	
	.nav h3 {
		margin: 0 0 .5em 1.8333em;
		}
	
	.product h3 {
		margin-bottom: 1em;
		}
	
	h2 + h3,
	p + h3 {
		margin-top: 2em;
		}

h4 {
	font-size: 1.2em;
	line-height: 1.5;
	}
	
	.footer h4 {
		color: #666;
		font-size: 1.1em;
		line-height: 1.63636;
		}
		
p {
	font-size: 1.2em;
	line-height: 1.5;
	margin: 0 0 1.5em 0;
	}
	
	.footer p {
		color: #666;
		font-size: 1.1em;
		line-height: 1.63636;
		margin: 0 0 1.63636em 0;
		}
	
	.product p.nav {
		float: right;
		font-size: 1em;
		line-height: 1;
		text-align: right;
		text-transform: uppercase;
		color: #999;
		}
		
		.product p.nav .email {
			}

ul {
	margin: 0 0 1.8em 1.8em;
	}
	
	h2 + ul {
		margin-top: .9em;
		}
	
	.product ul {
		margin: 0;
		}

li {
	font-size: 1.2em;
	line-height: 1.5;
	list-style: none;
	margin: 0 0 .25em 0;
	padding: 0 0 0 12px;
	background: url(../img/ui/bullets/raquo_0360a6.png) no-repeat 0 .41666em;
	}

.multi li,
.immunity li,
.energy li,
.sleep li,
.bone li,
.slender li,
.sport li,
.recovery li {
	color: #333 !important;
	}

.multi li.immunity,
.immunity li {background-image: url(../img/ui/bullets/raquo_dd5900.png);}

.multi li.energy,
.energy li {background-image: url(../img/ui/bullets/raquo_aa004f.png);}

.multi li.sleep,
.sleep li {background-image: url(../img/ui/bullets/raquo_339e35.png);}

.multi li.bone,
.bone li {background-image: url(../img/ui/bullets/raquo_d62828.png);}

.multi li.slender,
.slender li {background-image: url(../img/ui/bullets/raquo_f95e59.png);}

.multi li.sport,
.sport li {background-image: url(../img/ui/bullets/raquo_7fba00.png);}

.multi li.recovery,
.recovery li {background-image: url(../img/ui/bullets/raquo_462670.png);}

h1.superc,
span.superc,
strong.superc {color: #0360a6;}


.vcard {
	font-size: 1.1em;
	line-height: 1.63636;
	margin: 0 0 1.63636em 2em;
	}

.vcard .org {
	font-weight: bold;
	}

.vcard .tel .type {
	color: #999;
	font-size: .90909em;
	text-transform: uppercase;
	}


dt {
	font-size: 1.2em;
	font-weight: bold;
	line-height: 1.5;
	}
	
	dt.error {
		color: #aa0000;
		font-size: 1.1em;
		line-height: 1.63636;
		text-transform: uppercase;
		}

dd {
	font-size: 1.2em;
	line-height: 1.5;
	margin: 0 0 .75em 0;
	}
	
	dd input,
	dd textarea {
		font-size: 1em;
		font-family: "Lucida Grande", Tahoma, Arial, sans-serif;
		padding: .1666em;
		}

dd.note {
	color: #666;
	font-size: 1.1em;
	line-height: 1.63636;
	margin: -.81818em 0 .81818em 0;
	}

/* -------------------------------------------------
                                   end typography */





/* "refreshing" homepage
------------------------------------------------- */
#refreshing {
	position: relative;
	width: 100%;
	height: 58.5em;
	background: #e9e9e5 url(../img/ui/gradients/f8f8f8_e9e9e5_5x335.png) repeat-x 0 0;
	}


#refreshing #title {
	padding: 45px 0 0 20px;
	}


#refreshing #fruit {
	position: absolute;
	top: 120px;
	left: 0;
	}


#refreshing #formulas {
	position: absolute;
	top: 115px;
	right: 0;
	width: 53em;
	height: 47em;
	background: #0360a6;
	z-index: 10;
	}
	
	#formulas .tl,
	#formulas .tr {
		position: absolute;
		top: 0;
		width: 12px;
		height: 12px;
		}

	#formulas .tl {
		left: 0;
		background: url(../img/ui/corners/rf_0360a6_tl.png) no-repeat 0 0;
		}

	#formulas .tr {
		right: 0;
		background: url(../img/ui/corners/rf_0360a6_tr.png) no-repeat 0 0;
		}
	
	#formulas h2 {
		color: #32bcec;
		font-size: 2.4em;
		line-height: 1.25;
		letter-spacing: -.041666em;
		margin: 1em 0 0;
		text-align: center;
		}


#sticks {
	width: auto;
	margin: 1em 0 0 1.5em;
	}

#sticks li {
	float: left;
	width: 7.142857em; /*100px*/
	padding: 0;
	
	font-size: 1.4em;
	line-height: 1;
	letter-spacing: -1px;
	font-weight: bold;
	text-align: center;
	text-transform: uppercase;
	
	background: none;
	}

#sticks li a:link,
#sticks li a:visited,
#sticks li a:hover,
#sticks li a:active {
	float: left;
	display: block;
	width: 100%;
	padding: 0 0 385px 0;
	
	color: #fff;
	text-align: center;
	text-decoration: none;
	}
	
	#sticks #s-immunity a {background: url(../img/promos/refreshing/stick_immunity.png) no-repeat 50% 25px;}
	#sticks #s-energy a {background: url(../img/promos/refreshing/stick_energy.png) no-repeat 50% 25px;}
	#sticks #s-sleep a {background: url(../img/promos/refreshing/stick_sleep.png) no-repeat 50% 25px;}
	#sticks #s-bone a {background: url(../img/promos/refreshing/stick_bone.png) no-repeat 50% 25px;}
	#sticks #s-slender a {background: url(../img/promos/refreshing/stick_slender.png) no-repeat 50% 25px;}
	
	#sticks li a:hover {background-position: 50% -395px !important;}
	
	#sticks #s-immunity a:hover {color: #dd5900;}
	#sticks #s-energy a:hover {color: #aa004f;}
	#sticks #s-sleep a:hover {color: #339e35;}
	#sticks #s-bone a:hover {color: #d62828;}
	#sticks #s-slender a:hover {color: #f95e59;}


#water {
	position: absolute;
	left: 0;
	top: 335px;
	width: 38em;
	min-height: 25em;
	background: #fff;
	color: #00ade9;
	z-index: 0;
	}

	#water h2 {
		background: #00ade9;
		color: #fff;
		font-size: 2.4em;
		line-height: .65;
		letter-spacing: -.041666em;
		margin: 0;
		padding: 15px 0 0 110px;
		}
	
	#water ul {
		margin: 30px 0 0 180px;
		padding: 0;
		}
	
	#water li {
		font-size: 1.8em;
		line-height: 1;
		font-weight: bold;
		letter-spacing: -1px;
		margin: 0 0 .5em 0;
		padding: 0 0 0 16px;
		background: url(../img/ui/bullets/raquo_00ade9_18.png) no-repeat 0 50%;
		}

#glass {
	position: absolute;
	top: 3px;
	left: 0;
	}
/* -------------------------------------------------
                        end "refreshing" homepage */





/* navigation
------------------------------------------------- */
ul.nav li,
#nav li {
	list-style: none;
	padding: 0;
	background: none;
	}

.nav li a span,
#nav li a span {
	display: none;
	}
	
.nav li.active a span,
.nav li a:hover span,
#nav li.active a span,
#nav li a:hover span {
	display: block;
	position: absolute;
	width: 6px;
	height: 6px;
	}

.nav li a span.tl,
#nav li a span.tl {
	top: 0;
	left: 0;
	}

.nav li a span.tr,
#nav li a span.tr {
	top: 0;
	right: 0;
	}

.nav li a span.bl,
#nav li a span.bl {
	bottom: 0;
	left: 0;
	}

.nav li a span.br,
#nav li a span.br {
	bottom: 0;
	right: 0;
	}



#nav {
	float: left;
	display: inline;
	margin: 7px 0 .5em 45px;
	}

#nav li {
	float: left;
	font-size: 1.2em;
	font-weight: bold;
	line-height: 1;
	margin: 0 .5em 0 0;
	text-transform: uppercase;
	}

#nav li a:link,
#nav li a:visited,
#nav li a:hover,
#nav li a:active {
	float: left;
	display: block;
	position: relative;
	padding: .5em 1em;
	background: #fff;
	color: #0360a6;
	text-decoration: none;
	}
	
	#nav li a span.tl {background: #0360a6 url(../img/ui/corners/sc_0360a6_tl.png) no-repeat 0 0;}
	#nav li a span.tr {background: #0360a6 url(../img/ui/corners/sc_0360a6_tr.png) no-repeat 0 0;}
	#nav li a span.bl {background: #0360a6 url(../img/ui/corners/sc_0360a6_bl.png) no-repeat 0 100%;}
	#nav li a span.br {background: #0360a6 url(../img/ui/corners/sc_0360a6_br.png) no-repeat 100% 100%;}
		

#nav li.active a:link,	
#nav li.active a:visited,	
#nav li.active a:hover,	
#nav li.active a:link,	
#nav li a:hover {
	background: #0360a6;
	color: #fff;
	}
	

ul.nav {
	width: 12em;
	margin: 0 0 0 1em;
	}


ul.nav li {
	font-size: 1.2em;
	line-height: 1;
	}

ul.nav li a:link,
ul.nav li a:visited,
ul.nav li a:hover,
ul.nav li a:active {
	clear: left;
	float: left;
	display: block;
	position: relative;
	width: 9em;
	margin: 0 0 .25em 0;
	padding: .5em 1em;
	color: #333;
	text-decoration: none;
	}

ul.nav li a:hover,
ul.nav li.active a:link,
ul.nav li.active a:visited,
ul.nav li.active a:hover,
ul.nav li.active a:active {
	color: #fff;
	font-weight: bold;
	}
	
ul.nav li .immunity:hover,
ul.nav li.active .immunity {background: #dd5900;}
ul.nav li .immunity span.tl {background: #dd5900 url(../img/ui/corners/sc_dd5900_tl.png) no-repeat 0 0;}
ul.nav li .immunity span.tr {background: #dd5900 url(../img/ui/corners/sc_dd5900_tr.png) no-repeat 0 0;}
ul.nav li .immunity span.bl {background: #dd5900 url(../img/ui/corners/sc_dd5900_bl.png) no-repeat 0 100%;}
ul.nav li .immunity span.br {background: #dd5900 url(../img/ui/corners/sc_dd5900_br.png) no-repeat 100% 100%;}

ul.nav li .energy:hover,
ul.nav li.active .energy {background: #aa004f;}
ul.nav li .energy span.tl {background: #aa004f url(../img/ui/corners/sc_aa004f_tl.png) no-repeat 0 0;}
ul.nav li .energy span.tr {background: #aa004f url(../img/ui/corners/sc_aa004f_tr.png) no-repeat 0 0;}
ul.nav li .energy span.bl {background: #aa004f url(../img/ui/corners/sc_aa004f_bl.png) no-repeat 0 100%;}
ul.nav li .energy span.br {background: #aa004f url(../img/ui/corners/sc_aa004f_br.png) no-repeat 100% 100%;}

ul.nav li .sleep:hover,
ul.nav li.active .sleep {background: #339e35;}
ul.nav li .sleep span.tl {background: #339e35 url(../img/ui/corners/sc_339e35_tl.png) no-repeat 0 0;}
ul.nav li .sleep span.tr {background: #339e35 url(../img/ui/corners/sc_339e35_tr.png) no-repeat 0 0;}
ul.nav li .sleep span.bl {background: #339e35 url(../img/ui/corners/sc_339e35_bl.png) no-repeat 0 100%;}
ul.nav li .sleep span.br {background: #339e35 url(../img/ui/corners/sc_339e35_br.png) no-repeat 100% 100%;}

ul.nav li .bone:hover,
ul.nav li.active .bone {background: #d62828;}
ul.nav li .bone span.tl {background: #d62828 url(../img/ui/corners/sc_d62828_tl.png) no-repeat 0 0;}
ul.nav li .bone span.tr {background: #d62828 url(../img/ui/corners/sc_d62828_tr.png) no-repeat 0 0;}
ul.nav li .bone span.bl {background: #d62828 url(../img/ui/corners/sc_d62828_bl.png) no-repeat 0 100%;}
ul.nav li .bone span.br {background: #d62828 url(../img/ui/corners/sc_d62828_br.png) no-repeat 100% 100%;}

ul.nav li .slender:hover,
ul.nav li.active .slender {background: #f95e59;}
ul.nav li .slender span.tl {background: #f95e59 url(../img/ui/corners/sc_f95e59_tl.png) no-repeat 0 0;}
ul.nav li .slender span.tr {background: #f95e59 url(../img/ui/corners/sc_f95e59_tr.png) no-repeat 0 0;}
ul.nav li .slender span.bl {background: #f95e59 url(../img/ui/corners/sc_f95e59_bl.png) no-repeat 0 100%;}
ul.nav li .slender span.br {background: #f95e59 url(../img/ui/corners/sc_f95e59_br.png) no-repeat 100% 100%;}

ul.nav li .sport:hover,
ul.nav li.active .sport {background: #7fba00;}
ul.nav li .sport span.tl {background: #7fba00 url(../img/ui/corners/sc_7fba00_tl.png) no-repeat 0 0;}
ul.nav li .sport span.tr {background: #7fba00 url(../img/ui/corners/sc_7fba00_tr.png) no-repeat 0 0;}
ul.nav li .sport span.bl {background: #7fba00 url(../img/ui/corners/sc_7fba00_bl.png) no-repeat 0 100%;}
ul.nav li .sport span.br {background: #7fba00 url(../img/ui/corners/sc_7fba00_br.png) no-repeat 100% 100%;}

ul.nav li .recovery:hover,
ul.nav li.active .recovery {background: #462670;}
ul.nav li .recovery span.tl {background: #462670 url(../img/ui/corners/sc_462670_tl.png) no-repeat 0 0;}
ul.nav li .recovery span.tr {background: #462670 url(../img/ui/corners/sc_462670_tr.png) no-repeat 0 0;}
ul.nav li .recovery span.bl {background: #462670 url(../img/ui/corners/sc_462670_bl.png) no-repeat 0 100%;}
ul.nav li .recovery span.br {background: #462670 url(../img/ui/corners/sc_462670_br.png) no-repeat 100% 100%;}
/* -------------------------------------------------
                                   end navigation */





/* product styles
------------------------------------------------- */
.blurb {
	margin: 2em 0;
	}

.blurb .img {
	float: left;
	width: 18em;
	text-align: center;
	}

.blurb .copy {
	float: right;
	width: 65em;
	padding: 0 0 0 2em;
	}

.product .img {
	float: left;
	width: 27em;
	padding: 0 0 2em 0;
	}

.product .copy {
	clear: right;
	float: right;
	width: 40em;
	padding: 0 0 2em 0;
	}

img.pour {
	float: right;
	margin: 0 0 9px 9px;
	}

img.stick {
	float: right;
	}

ul#sc_list {
	background: url(../img/products/superc/sc_group_480x270.jpg) no-repeat 100% 50px;
	}

.video {
	padding: 0 0 1.8em 0;
	}
/* -------------------------------------------------
                               end product styles */