/* CSS FOR: PRODUCTS NAVIGATION */

/* BEGIN Top Half */
#buttons{float:right;}
#buttons a{display:inline-block;}
#button_green{
	background:#5ec379;/* Old browsers */
	background:linear-gradient(to bottom, #5ec379 32%,#10a049 56%);
	color:#ffffff !important;
	border-radius:7px;
	background-color:#10a049;
	margin-top:5px;
	padding:5px 20px;	
}
#button_blue{
	background: #6498ce;/* Old browsers */
	background: linear-gradient(to bottom, #8ebbe9 0%,#0066cc 68%);	color:#ffffff !important;
	border-radius:7px;
	background-color:#10a049;
	margin-top:5px;
	max-width:70px;
	padding:5px 20px;
	text-align:center;
}
#main_content #product_info {bottom:10px;float:left;margin:10px 2% 1% 2%;max-width:997px;position:relative;width:96%;}
#main_content #product_info img {float:left;padding:0px 2% 1% 0px;max-width:320px;width:40%;}
#page_title, #product_title {color:#707070;font-size:18px;font-weight:bold;width:95%;}
#product_description {color:#707070;font-size:14px;}
#product_description ul {list-style:inside;}

.social {float:left;padding-bottom:10px;padding-top:20px;width:285px;}
.social img {width:60px;}
.social_icon {bottom:3px;display:inline !important;padding-right:10px;vertical-align:top;}
/* END Top Half */

/* BEGIN Tabs */
#tabs_wrapper {float:left;max-width:997px;width:100%;}
#tabs_wrapper div {overflow:hidden;}
#tabs_wrapper h2 {color:#10a049;}
/* hide the radio inputs */
#tabs_wrapper input[type=radio] {position:absolute;visibility:hidden;}
/* style all tabs */
#tabs_wrapper label {
	background-color:#016f4f;
	border:2px solid #016f4f;
	border-radius:12px 12px 0px 0px;
	border-bottom:none;
	color:#ffffff;
	cursor:pointer;
	display:inline-block;
	font-size:13px;
	font-weight:bold;
	line-height:30px;
	margin:0px 1px 0px 0px;
	padding:0px 2%;
	position:relative;
	/*transition:all .3s ease-out;*/
}

/* style active tab */
#tabs_wrapper label:hover,
#tabs_wrapper input[type=radio]#tab_1:checked~label[for=tab_1],
#tabs_wrapper input[type=radio]#tab_2:checked~label[for=tab_2],
#tabs_wrapper input[type=radio]#tab_3:checked~label[for=tab_3],
#tabs_wrapper input[type=radio]#tab_4:checked~label[for=tab_4],
#tabs_wrapper input[type=radio]#tab_5:checked~label[for=tab_5],
#tabs_wrapper input[type=radio]#tab_6:checked~label[for=tab_6], 
#tabs_wrapper input[type=radio]#tab_7:checked~label[for=tab_7] {
	background-color:#f6f7f1;
	border:2px solid #016f4f;
	border-bottom:none;
	color:#016f4f !important;
	font-weight:bold;
	top:2px;
	/*transition:all .3s ease-out;*/
	z-index:100;
}
#tabs_wrapper label a:active,
#tabs_wrapper label a:link,
#tabs_wrapper label a:visited {color:#ffffff !important;}
#tabs_wrapper label:hover {top:0px;}

/* style all contents */

/* hide content */
#tabs_wrapper #tab_1_content,
#tabs_wrapper #tab_2_content,
#tabs_wrapper #tab_3_content,
#tabs_wrapper #tab_4_content,
#tabs_wrapper #tab_5_content,
#tabs_wrapper #tab_6_content,
#tabs_wrapper #tab_7_content {
	background-color:#f6f7f1;
	border:2px solid #016f4f;
	border-radius:0px 12px 12px 12px;
	display:none;
	min-height:300px;
	/*opacity:0;*/
	top:0px;
	padding:2%;
	position:relative;/*absolute;*/
	/*transition:visibility .3s ease-in,opacity .3s ease-in;*/
	/*visibility:hidden;*/
	width:95.5%;
}

/* show content */
#tabs_wrapper input[type=radio]#tab_1:checked~#tab_1_content,
#tabs_wrapper input[type=radio]#tab_2:checked~#tab_2_content,
#tabs_wrapper input[type=radio]#tab_3:checked~#tab_3_content,
#tabs_wrapper input[type=radio]#tab_4:checked~#tab_4_content,
#tabs_wrapper input[type=radio]#tab_5:checked~#tab_5_content,
#tabs_wrapper input[type=radio]#tab_6:checked~#tab_6_content,
#tabs_wrapper input[type=radio]#tab_7:checked~#tab_7_content {height:auto;display:block;/*opacity:1;*//*transition:visibility .3s ease-in,opacity .3s ease-in;*//*visibility:visible;*/}

/* Videos Tab*/
#tabs_wrapper #videos {min-height:450px;overflow:hidden;}
#tabs_wrapper #videos #left {float:left;width:74%;}
#tabs_wrapper #videos #left video {height:auto;width:100%;}
#tabs_wrapper #videos #right {float:right;width:25%;}
#tabs_wrapper #videos #right ul {}
#tabs_wrapper #videos #right li {list-style:none;position:relative;}
#tabs_wrapper #videos #right img {border:none;display:inline-block;height:auto;width:90%;}
/* Ingredients Tab*/
#tabs_wrapper #ingredients {padding-top:5px;}
#tabs_wrapper #ingredients #left {float:left;width:60%;}
#tabs_wrapper #ingredients .details {padding-top:10px;}
#tabs_wrapper #ingredients .note {padding-top:10px;}
#tabs_wrapper #ingredients .upc_star {padding-top:10px;}
#tabs_wrapper #ingredients #right {float:left;padding-left:5%;width:35%;}
#tabs_wrapper .green {color:#016f4f;}

/* How To Use Tab */
#tabs_wrapper #how_to_content {color:#707070;}
#tabs_wrapper #how_to_content h2 {margin:0px;padding:0px;}
#tabs_wrapper #how_to_content .header, #tabs_wrapper #how_to_content .warning {color:#10a049;font-weight:bold;text-transform:uppercase;}
#tabs_wrapper #how_to_content .subheader {color:#10a049;text-transform:capitalize;}
/* Reviews Tab */
#tabs_wrapper #reviews_content {max-height:300px;overflow:auto;}
#tabs_wrapper #reviews_content .inner {color:#707070;padding-right:10px;}
#tabs_wrapper #reviews_content .author {display:inline-block;width:30%;}
#tabs_wrapper #reviews_content .date {display:inline-block;width:25%;}
/* Review Iframe  */
#tabs_wrapper #tab_4_content .frame_review,
#tabs_wrapper #tab_5_content .frame_review,
#tabs_wrapper #tab_6_content .frame_review {border:0px;min-height:420px;overflow:auto;width:100%;}
/* END Tabs */

/* BEGIN Live Tiless */
#live_tiles .flip {
	border-radius:12px;
	color:#707070;
	float:left;
	height:280px;/*350px;/*default only */
	width:170px;/*default only */
	margin:9px;
	position:relative;
	/*perspective:1000;*//*not supported yet*/
}
#live_tiles .flip a {color:#707070;border:none;height:auto;padding:0px;margin:0px;}
#live_tiles .flip a:hover {color:#707070;}
#live_tiles .flip img {border:none;display:block;margin-left:auto;margin-right:auto;width:100%;}
#live_tiles .flip-front img {height:190px;width:auto;padding:0px 0px 5px 0px;margin:0px auto;}

#live_tiles .flip .flip-front,
#live_tiles .flip .flip-back {
	backface-visibility:hidden;
	border:1px solid #d6d6d6;
	border-radius:12px;
	box-shadow:5px 5px 5px #d6d6d6;
	height:265px;
	left:0px;
	overflow:hidden;
	padding:10px 5px 5px 5px;
	position:absolute;
	top:0px;
	transform-style:preserve-3d;
	transition:0.5s;
	width:160px;
}
#live_tiles .flip .flip-back, #live_tiles .flip .flip-back p {background-color:#016f4f;color:#ffffff;}
#live_tiles .two_x_one {padding-right:10px;width:348px;}
#live_tiles .two_x_one .flip-front, #live_tiles .two_x_one .flip-back {width:348px;}

#live_tiles .flip .flip-front {text-align:center;z-index:5;}
#live_tiles .flip .product_name {line-height:60px;}/*66*/
#live_tiles .flip .product_name span {display:inline-block;line-height:normal;vertical-align:middle;}

#live_tiles .flip .flip-front .blue_stripe,
#live_tiles .flip .flip-front .green_stripe,
#live_tiles .flip .flip-front .red_stripe {
	display:block;
	background-color:#ff0000;	
	color:#ffffff;
	font-size:18px;
	font-weight:bold;
	height:auto;
	left:-20%;
	opacity:.8;
	padding:5px 0px;
	position:absolute;
	top:70px;
	transform:rotate(-30deg);
	width:140%;
}
#live_tiles .flip .flip-front .blue_stripe {background-color:#6397ce;}
#live_tiles .flip .flip-front .green_stripe {background-color:#10a049;}

#live_tiles .flip .flip-back {z-index:0;transform:rotateY(-180deg);}
#live_tiles .flip:hover .flip-front {z-index:5;transform:rotateX(180deg);/* was Y */}
#live_tiles .flip:hover .flip-back {z-index:10;transform:rotateY(0deg);}
#live_tiles .well{background-color:#016f4f;color:#ffffff;list-style:none;}
#live_tiles .well ul{list-style:none;margin:0px;padding:0px;}
#live_tiles .well .title{color:#f4e202;font-size:16px;font-weight:bold;text-align:center;}
#live_tiles .well .content{padding:5px;}
#live_tiles .well .link {bottom:20px;position:absolute;text-align:center;width:100%;}
#live_tiles .well .button {background:#5ec379;/* Old browsers */background:linear-gradient(to bottom, #5ec379 32%,#10a049 56%);border-radius:7px;color:#ffffff;padding:5px 20px;}
#live_tiles .well .button:hover {background:#ffffff;border:1px solid #034815;color:#034815;}
/* TURN OFF FLIP */
#live_tiles .flip:hover .no_flip{transform:none !important;-webkit-transform:none !important;}
/* END Live Tiles */

/* BEGIN VIDEO OVERRIDE */
/* these override the default video styles set in video_controls.css */
#main_content .vjs-poster {}
#main_content .video-js  {}
@media only screen and (device-width: 768px) and (device-height: 1280px) {
	#tabs_wrapper #videos #right {position:relative;right:90px;}
}

@media screen and (max-width:640px) {
	#tabs_wrapper #ingredients{height:100%;overflow:auto;}
}
@media screen and (max-width:400px) {
	#main_content #product_info img {width:100%;}
	#live_tiles .two_x_one {width:235px;}
	#live_tiles .two_x_one .flip-front, #live_tiles .two_x_one .flip-back {width:160px;}
	#tabs_wrapper #videos #right {display:none;}		
}