/* Reset body animation */
html#innovations-drc-page body{
	background:#f3ed96 url(../content-images/our-innovations/drc/DRC_bg_exp.jpg?$staticlink$) 50% top no-repeat;
}

/* reset content block position at asset level */
.innovations-drc-reviews,.innovations-drc-gpg,.innovations-drc-routine{position:relative}

/* carousel */
#innovations-drc-reviews.b-additional-carousel .carousel{
	padding:0 16%;
	position:absolute;
	top:55%;
}
#innovations-drc-reviews.b-additional-carousel .jcarousel-control{
	background-color: transparent;
	height:auto;
	width:auto;
}
#innovations-drc-reviews.b-additional-carousel .jcarousel-control.jcarousel-prev{left:8%;}
#innovations-drc-reviews.b-additional-carousel .jcarousel-control.jcarousel-prev:after{
	background:transparent url(../content-images/our-innovations/drc/icon_carousel-prev.png?$staticlink$) top left no-repeat;
	content:"";
	height:43px;
	width:41px;
}
#innovations-drc-reviews.b-additional-carousel .jcarousel-control.jcarousel-next{right:12%;}
#innovations-drc-reviews.b-additional-carousel .jcarousel-control.jcarousel-next:after{
	background:transparent url(../content-images/our-innovations/drc/icon_carousel-next.png?$staticlink$) top left no-repeat;
	content:"";
	height:43px;
	width:41px;
}
#innovations-drc-reviews.b-additional-carousel .carousel_navigation_list{display:none;}

/* ingredients tabs */
.innovations-drc-ingredients .tabs_content{
	height:auto;
	left:0;
	position:absolute;
	top:0;
	width:100%;
}
.innovations-drc-ingredients .drc-ingredients-thumbs ul{
	background-image:url(../content-images/our-innovations/drc/DRC_ingredients_panel.png?$staticlink$);
	background-repeat:no-repeat;
	background-position:top left;
	background-size:100%;
	height:33%;
	left:3%;
	position:absolute;
	top:76%;
	width:29.7%;
	z-index:2;
}
.innovations-drc-ingredients .drc-ingredients-thumbs ul li{
	background-color:transparent;
	background-repeat:no-repeat;
	background-position:top left;
	background-size:100%;
	border:0;
	float:left;
	height:100%;
	margin: 10% 2% 0 9%;
	width:20%;
}
.innovations-drc-ingredients .drc-ingredients-thumbs ul li a{height:100%;}
.innovations-drc-ingredients .drc-ingredients-thumbs ul li.ginger.ui-state-default{
	background-image:url(../content-images/our-innovations/drc/DRC_ingredients_thumb_ginger_off.png?$staticlink$);
}
.innovations-drc-ingredients .drc-ingredients-thumbs ul li.ginger.ui-state-hover,
.innovations-drc-ingredients .drc-ingredients-thumbs ul li.ginger.ui-state-active{
	background-image:url(../content-images/our-innovations/drc/DRC_ingredients_thumb_ginger_on.png?$staticlink$);
}
.innovations-drc-ingredients .drc-ingredients-thumbs ul li.tamanu.ui-state-default{
	background-image:url(../content-images/our-innovations/drc/DRC_ingredients_thumb_tamanu_off.png?$staticlink$);
}
.innovations-drc-ingredients .drc-ingredients-thumbs ul li.tamanu.ui-state-hover,
.innovations-drc-ingredients .drc-ingredients-thumbs ul li.tamanu.ui-state-active{
	background-image:url(../content-images/our-innovations/drc/DRC_ingredients_thumb_tamanu_on.png?$staticlink$);
}
.innovations-drc-ingredients .drc-ingredients-thumbs ul li.sunflower.ui-state-default{
	background-image:url(../content-images/our-innovations/drc/DRC_ingredients_thumb_sunflower_off.png?$staticlink$);
}
.innovations-drc-ingredients .drc-ingredients-thumbs ul li.sunflower.ui-state-hover,
.innovations-drc-ingredients .drc-ingredients-thumbs ul li.sunflower.ui-state-active{
	background-image:url(../content-images/our-innovations/drc/DRC_ingredients_thumb_sunflower_on.png?$staticlink$);
}

/* gary pepper tabs */
.innovations-drc-gpg .drc-GPG-overlay,.innovations-drc-gpg .drc-GPG-bg{position:absolute;top:0;left:0;}
.innovations-drc-gpg .tabs_content{
	height:54%;
	left:50%;
	position:absolute;
	top:15.8%;
	width:43.6%;
}
.innovations-drc-gpg .drc-GPG-thumbs ul{
	height:14.4%;
	left:6.4%;
	position:absolute;
	top:75.7%;
	width:86.7%;
}
.innovations-drc-gpg .drc-GPG-thumbs ul li{
	background-repeat:no-repeat;
	background-position:top left;
	background-size:100%;
	border:0;
	float:left;
	height:100%;
	width:25%;
}
.innovations-drc-gpg .drc-GPG-thumbs ul li a{height:100%;}

.innovations-drc-gpg .drc-GPG-thumbs ul li.ui-state-active{
	margin:0;
	padding:0;
}
.innovations-drc-gpg .drc-GPG-thumbs ul li.nature.ui-state-default{
	background-image:url(../content-images/our-innovations/drc/DRC_GPG_thumb_nature_off.jpg?$staticlink$);
}
.innovations-drc-gpg .drc-GPG-thumbs ul li.nature.ui-state-hover,
.innovations-drc-gpg .drc-GPG-thumbs ul li.nature.ui-state-active{
	background-image:url(../content-images/our-innovations/drc/DRC_GPG_thumb_nature_on.jpg?$staticlink$);
}
.innovations-drc-gpg .drc-GPG-thumbs ul li.family.ui-state-default{
	background-image:url(../content-images/our-innovations/drc/DRC_GPG_thumb_family_off.jpg?$staticlink$);
}
.innovations-drc-gpg .drc-GPG-thumbs ul li.family.ui-state-hover,
.innovations-drc-gpg .drc-GPG-thumbs ul li.family.ui-state-active{
	background-image:url(../content-images/our-innovations/drc/DRC_GPG_thumb_family_on.jpg?$staticlink$);
}
.innovations-drc-gpg .drc-GPG-thumbs ul li.adventure.ui-state-default{
	background-image:url(../content-images/our-innovations/drc/DRC_GPG_thumb_adventure_off.jpg?$staticlink$);
}
.innovations-drc-gpg .drc-GPG-thumbs ul li.adventure.ui-state-hover,
.innovations-drc-gpg .drc-GPG-thumbs ul li.adventure.ui-state-active{
	background-image:url(../content-images/our-innovations/drc/DRC_GPG_thumb_adventure_on.jpg?$staticlink$);
}
.innovations-drc-gpg .drc-GPG-thumbs ul li.rush.ui-state-default{
	background-image:url(../content-images/our-innovations/drc/DRC_GPG_thumb_rush_off.jpg?$staticlink$);
}
.innovations-drc-gpg .drc-GPG-thumbs ul li.rush.ui-state-hover,
.innovations-drc-gpg .drc-GPG-thumbs ul li.rush.ui-state-active{
	background-image:url(../content-images/our-innovations/drc/DRC_GPG_thumb_rush_on.jpg?$staticlink$);
}

/* routine tabs */
.innovations-drc-routine .tabs_content{
	height:auto;
	left:29%;
	position:absolute;
	top:21.7%;
	width:64.2%;
}
.innovations-drc-routine .drc-routine-thumbs ul{
	height:77%;
	left:4.4%;
	position:absolute;
	top:23%;
	width:5.7%;
}
.innovations-drc-routine .drc-routine-thumbs ul li{
	background-color:transparent;
	background-repeat:no-repeat;
	background-position:top left;
	background-size:100%;
	border:0;
	height:9%;
	margin: 0 0 65% 0;
	max-width:100%;
	width:100%;
}
.innovations-drc-routine .drc-routine-thumbs ul li.hydro{margin: 0 0 110% 0;}
.innovations-drc-routine .drc-routine-thumbs ul li a{height:100%;}
.innovations-drc-routine .drc-routine-thumbs ul li.hydro.ui-state-default{
	background-image:url(../content-images/our-innovations/drc/DRC_routine_thumb_hydro_off.png?$staticlink$);
}
.innovations-drc-routine .drc-routine-thumbs ul li.hydro.ui-state-hover,
.innovations-drc-routine .drc-routine-thumbs ul li.hydro.ui-state-active{
	background-image:url(../content-images/our-innovations/drc/DRC_routine_thumb_hydro_on.png?$staticlink$);
}
.innovations-drc-routine .drc-routine-thumbs ul li.drc.ui-state-default{
	background-image:url(../content-images/our-innovations/drc/DRC_routine_thumb_drc_off.png?$staticlink$);
}
.innovations-drc-routine .drc-routine-thumbs ul li.drc.ui-state-hover,
.innovations-drc-routine .drc-routine-thumbs ul li.drc.ui-state-active{
	background-image:url(../content-images/our-innovations/drc/DRC_routine_thumb_drc_on.png?$staticlink$);
}
.innovations-drc-routine .drc-routine-thumbs ul li.mre.ui-state-default{
	background-image:url(../content-images/our-innovations/drc/DRC_routine_thumb_mre_off.png?$staticlink$);
}
.innovations-drc-routine .drc-routine-thumbs ul li.mre.ui-state-hover,
.innovations-drc-routine .drc-routine-thumbs ul li.mre.ui-state-active{
	background-image:url(../content-images/our-innovations/drc/DRC_routine_thumb_mre_on.png?$staticlink$);
}
.innovations-drc-routine .drc-routine-thumbs ul li.ufc.ui-state-default{
	background-image:url(../content-images/our-innovations/drc/DRC_routine_thumb_ufc_off.png?$staticlink$);
}
.innovations-drc-routine .drc-routine-thumbs ul li.ufc.ui-state-hover,
.innovations-drc-routine .drc-routine-thumbs ul li.ufc.ui-state-active{
	background-image:url(../content-images/our-innovations/drc/DRC_routine_thumb_ufc_on.png?$staticlink$);
}
.innovations-drc-routine .drc-routine-thumbs ul li.sfuv.ui-state-default{
	background-image:url(../content-images/our-innovations/drc/DRC_routine_thumb_sfuv_off.png?$staticlink$);
}
.innovations-drc-routine .drc-routine-thumbs ul li.sfuv.ui-state-hover,
.innovations-drc-routine .drc-routine-thumbs ul li.sfuv.ui-state-active{
	background-image:url(../content-images/our-innovations/drc/DRC_routine_thumb_sfuv_on.png?$staticlink$);
}

/* mobile */
.innovations-drc-mobile{}
.inn-drc-mobile-reviews,
.inn-drc-mobile-routine,
.inn-drc-mobile-ingredients,
.inn-drc-mobile-GPG{position:relative;}

/* ingredients */
.inn-drc-mobile-ingredients img.ginger,
.inn-drc-mobile-ingredients img.tamanu,
.inn-drc-mobile-ingredients img.sunflower{
	left:0;
	position:absolute;
	top:0;
}

.inn-drc-mobile-ingredients .panel{
	left: 13.4%;
	position:absolute;
	top:81.4%;
	width:72.3%;
}

.inn-drc-mobile-ingredients .thumb-ginger,
.inn-drc-mobile-ingredients .thumb-tamanu,
.inn-drc-mobile-ingredients .thumb-sunflower{
	cursor:pointer;
	left:8%;
	position:absolute;
	top:15%;
	width:25%;
}
.inn-drc-mobile-ingredients .thumb-tamanu{left:37%;}
.inn-drc-mobile-ingredients .thumb-sunflower{left:66%;}

/* local carousel settings */
.innovations-drc-mobile .inn-drc-mobile-reviews .jcarousel-clip{}
.innovations-drc-mobile.b-additional-carousel .inn-drc-mobile-reviews .carousel{
	padding:0;
	position:absolute;
	top:35%;
}
.innovations-drc-mobile.b-additional-carousel .jcarousel-control{
	background:transparent;
	height:auto;
	margin:0;
	top:40%;
	width:auto;
	z-index:2;
}
.innovations-drc-mobile.b-additional-carousel .jcarousel-control.jcarousel-prev:after{
	background:transparent url(../content-images/our-innovations/drc/icon_carousel-prev.png?$staticlink$) top left no-repeat;
	content:"";
	height:43px;
	left:12px;
	width:41px;
}
.innovations-drc-mobile.b-additional-carousel .jcarousel-control.jcarousel-next{
	right:40px;
}
.innovations-drc-mobile.b-additional-carousel .jcarousel-control.jcarousel-next:after{
	background:transparent url(../content-images/our-innovations/drc/icon_carousel-next.png?$staticlink$) top left no-repeat;
	content:"";
	height:43px;
	width:41px;
}
.innovations-drc-mobile.b-additional-carousel .carousel_navigation_list{display:none}

/* gary pepper girl */
.inn-drc-mobile-GPG .overlay{
	left:0;
	position:absolute;
	top:0;
	z-index:2;
}

.innovations-drc-mobile.b-additional-carousel .inn-drc-mobile-GPG .carousel{
	left:0;
	padding:0;
	top:0;
}

.innovations-drc-mobile.b-additional-carousel .inn-drc-mobile-GPG .jcarousel-control{
	background:transparent;
	height:auto;
	margin:0;
	top:72.4%;
	width:auto;
	z-index:2;
}

/* mobile routine carousel */
.innovations-drc-mobile.b-additional-carousel .inn-drc-mobile-routine .carousel{
	padding:0;
	position:absolute;
	top:15%;
}

/* tablet */
@media only screen and (min-width:768px) and (max-width:1023px) {

}

/* mobile */
@media only screen and (max-width: 767px) {

}

/* COUTNDOWN */
.drc-countdown{position:relative;}
/* clock generic */
.drc-countdown .drc-clock{position:absolute;left:22%;margin:0 auto;top:0;width:56%;}
.drc-countdown .drc-labels{position:absolute;left:22%;top:65%;margin:0 auto;width:56%;}
.drc-countdown .drc-labels span{
	color:black;
	float:left;
	font-family:'Times New Roman',Times,serif;
	font-size:18px;
	font-weight:bold;
	text-align:center;
	text-shadow:none;
	text-transform:uppercase;
	width:22%;
}
.drc-countdown .drc-labels span.divider{width:3%;}

/* form generic */
.drc-countdown .crm-form{
	left:33%;
	margin:0 auto;
	position:absolute;
	text-align:center;
	top:25%;
	width:33%;
}
.drc-countdown .crm-form input[type="email"]{background-color:#fff;}
.drc-countdown .crm-form input[type='checkbox']{position:relative;top:4px;float:left;z-index:1;}
.drc-countdown .form_caption,
.drc-countdown .form_caption a{color:#fff;font-size:14px;line-height:1.5;margin-top:10px;font-family:'Times New Roman',Times,serif;}
.drc-countdown .crm-form .f_field_email{padding:0;}
.drc-countdown .crm-form .h-input-group button.button{display:block;margin:5px auto 0;position:relative;width:auto;}
.drc-countdown .crm-form .h-input-group button:after{border:0 !important;}
.drc-countdown .crm-form .h-input-group  label.error{color:#fff; margin:2px 0 0 !important;display:block !important;}

/* tablet resets */
@media only screen and (min-width:768px) and (max-width:1023px){
	/* tablet resets for form */
	.drc-countdown .crm-form{top:25%;}
	.drc-countdown .form_caption,
	.drc-countdown .form_caption a{font-size:12px;}
	.drc-countdown .crm-form .f_field{margin:0;}
	.drc-countdown .crm-form .h-input-group button.button{margin:2px auto 0;}
	/* tablet resets for clock labels */
	.drc-countdown .drc-labels{top:75%;}
	.drc-countdown .drc-labels span{font-size:12px;width:22%;}
	.drc-countdown .drc-labels span.divider{width:4%;}
}

/* mobile resets */
@media only screen and (max-width: 767px){
	/* mobile resets for form */
	.drc-countdown .crm-form{
		left:15%;
		margin:0 auto;
		position:absolute;
		text-align:center;
		top:20%;
		width:70%;
	}
	.drc-countdown .crm-form .f_label{display:none;}	
	.drc-countdown .crm-form .f_field{margin:0;}
	.drc-countdown .h-input-group{margin:0;padding:0;}
	.drc-countdown .crm-form .button{
		font-size:12px;
		height:24px !important;
		line-height:24px;
		margin:0 auto;
		padding:0 10px !important;
		position:relative;
		width:auto !important;
	}
	.drc-countdown .form_caption, .drc-countdown .form_caption a{font-size:10px;font-family:'Times New Roman',Times,serif;}
	.drc-countdown .crm-form .h-input-group  label.error{font-size:9px;font-weight:bold;}
	/* mobile resets for clock */
	.drc-countdown .drc-clock{position:absolute;left:5%;top:5%;margin:0 auto;width:90%;}
	/* mobile resets for clock labels */
	.drc-countdown .drc-labels{position:absolute;left:5%;top:75%;margin:0 auto;width:90%;}
	.drc-countdown .drc-labels span{
		color:black;
		float:left;
		font-family:'Times New Roman',Times,serif;
		font-size:11px;
		font-weight:bold;
		text-align:center;
		text-shadow:none;
		text-transform:uppercase;
		width:22%;
	}
	.drc-countdown .drc-labels span.divider{width:2%;}
}

/* flip clock */
/* Reset clock box and backface */
.flip-clock-wrapper *{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    -ms-box-sizing:border-box;
    -o-box-sizing:border-box;
    box-sizing:border-box;
    -webkit-backface-visibility:hidden;
    -moz-backface-visibility:hidden;
    -ms-backface-visibility:hidden;
    -o-backface-visibility:hidden;
    backface-visibility:hidden;
}

.flip-clock-wrapper a{cursor:pointer;text-decoration:none;color:#ccc;}
.flip-clock-wrapper a:hover{color:#fff;}
.flip-clock-wrapper ul{list-style:none;}
.flip-clock-wrapper.clearfix:before,
.flip-clock-wrapper.clearfix:after{content:" ";display:table;}
.flip-clock-wrapper.clearfix:after{clear:both;}
.flip-clock-wrapper.clearfix{*zoom:1;}

/* Main */
.flip-clock-wrapper{
	font:normal 11px "Helvetica Neue", Helvetica, sans-serif;
	-webkit-user-select:none;
}

.flip-clock-meridium{
	background:none !important;
	box-shadow:0 0 0 !important;
	font-size:36px !important;
}

.flip-clock-meridium a{color:#313333;}

.flip-clock-wrapper{
	text-align:center;
	position:relative;
	width:100%;
	margin:1em;
}

.flip-clock-wrapper:before,
.flip-clock-wrapper:after{
	content:" "; /* 1 */
	display:table; /* 2 */
}
.flip-clock-wrapper:after{clear:both;}

/* Skeleton */
.flip-clock-wrapper ul{
	position:relative;
	float:left;
	margin:.5%;
	width:9.8%;
	height:60px;
	font-size:20px;
	font-weight:bold;
	line-height:40px;
	border-radius:6px;
	background:#000;
}

@media only screen and (min-width:768px) and (max-width:1023px){
	.flip-clock-wrapper ul{width:9.5%;}
}

.flip-clock-wrapper ul li{
	z-index:1;
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	line-height:60px;
	text-decoration:none !important;
}

/* reset mobile UI clock number display size */
@media only screen and (max-width: 767px){
	.flip-clock-wrapper ul{width:8.8%;height:50px;}
	.flip-clock-wrapper ul li{line-height:50px;}
}

.flip-clock-wrapper ul li:first-child{z-index:2;}
.flip-clock-wrapper ul li a{
	display:block;
	height:100%;
	-webkit-perspective:200px;
	-moz-perspective:200px;
	perspective:200px;
	margin:0 !important;
	overflow:visible !important;
	cursor:default !important;
}

.flip-clock-wrapper ul li a div{
	z-index:1;
	position:absolute;
	left:0;
	width:100%;
	height:50%;
	font-size:80px;
	overflow:hidden; 
	outline:1px solid transparent;
}

.flip-clock-wrapper ul li a div .shadow{
	position:absolute;
	width:100%;
	height:100%;
	z-index:2;
}

.flip-clock-wrapper ul li a div.up{
	-webkit-transform-origin:50% 100%;
	-moz-transform-origin:50% 100%;
	-ms-transform-origin:50% 100%;
	-o-transform-origin:50% 100%;
	transform-origin:50% 100%;
	top:0;
}

.flip-clock-wrapper ul li a div.up:after{
	content:"";
	position:absolute;
	top:44px;
	left:0;
	z-index:5;
	width:100%;
	height:3px;
	background-color:#000;
	background-color:rgba(0, 0, 0, 0.4);
}

.flip-clock-wrapper ul li a div.down{
	-webkit-transform-origin:50% 0;
	-moz-transform-origin:50% 0;
	-ms-transform-origin:50% 0;
	-o-transform-origin:50% 0;
	transform-origin:50% 0;
	bottom:0;
	border-bottom-left-radius:6px;
	border-bottom-right-radius:6px;
}

.flip-clock-wrapper ul li a div div.inn{
	position:absolute;
	left:0;
	z-index:1;
	width:100%;
	height:200%;
	color:#ccc;
	text-shadow:0 1px 2px #000;
	text-align:center;
	background-color:#333;
	border-radius:6px;
	font-size:40px;
}

.flip-clock-wrapper ul li a div.up div.inn{
	top:0;
}

.flip-clock-wrapper ul li a div.down div.inn{
	bottom:0;
}

/* PLAY */
.flip-clock-wrapper ul.play li.flip-clock-before{
	z-index:3;
}

.flip-clock-wrapper .flip{box-shadow:0 2px 5px rgba(0, 0, 0, 0.7);}

.flip-clock-wrapper ul.play li.flip-clock-active{
	-webkit-animation:asd 0.5s 0.5s linear both;
	-moz-animation:asd 0.5s 0.5s linear both;
	animation:asd 0.5s 0.5s linear both;
	z-index:5;
}

.flip-clock-divider{
	float:left;
	display:inline-block;
	position:relative;
	width:20px;
	height:80px;
}

@media only screen and (max-width: 767px){
	.flip-clock-divider{
		height:50px;
	}
}

.flip-clock-divider:first-child{
	width:0;
}

.flip-clock-dot{
	display:block;
	background:#323434;
	width:10px;
	height:10px;
	position:absolute;
	border-radius:50%;
	box-shadow:0 0 5px rgba(0, 0, 0, 0.5);
	left:5px;
}

.flip-clock-divider .flip-clock-label{
	bottom:-80px;
	color:black;
	font-weight:bold;
	font-family:'Times New Roman',Times,serif;
	position:relative;
	text-transform:uppercase;
	text-shadow:none;
	display:none;
}


.flip-clock-divider.days .flip-clock-label{}
.flip-clock-divider.hours .flip-clock-label{}
.flip-clock-divider.minutes .flip-clock-label{}
.flip-clock-divider.seconds .flip-clock-label{}

.flip-clock-dot.top{top:20px;}
.flip-clock-dot.bottom{bottom:30px;}

/* reset mobile UI flip-clock-dot placement */
@media only screen and (max-width: 767px){
	.flip-clock-dot.top{top:15px;}
	.flip-clock-dot.bottom{bottom:10px;}
}

@-webkit-keyframes asd{
	0%{z-index:2;}
	20%{z-index:4;}
	100%{z-index:4;}
}

@-moz-keyframes asd{
	0%{z-index:2;}
	20%{z-index:4;}
	100%{z-index:4;}
}

@-o-keyframes asd{
	0%{z-index:2;}
	20%{z-index:4;}
	100%{z-index:4;}
}

@keyframes asd{
	0%{z-index:2;}
	20%{z-index:4;}
	100%{z-index:4;}
}

.flip-clock-wrapper ul.play li.flip-clock-active .down{
	z-index:2;
	-webkit-animation:turn 0.5s 0.5s linear both;
	-moz-animation:turn 0.5s 0.5s linear both;
	animation:turn 0.5s 0.5s linear both;
}

@-webkit-keyframes turn{
	0%{-webkit-transform:rotateX(90deg);}
	100%{-webkit-transform:rotateX(0deg);}}

@-moz-keyframes turn{
	0%{-moz-transform:rotateX(90deg);}
	100%{-moz-transform:rotateX(0deg);}}

@-o-keyframes turn{
	0%{-o-transform:rotateX(90deg);}
	100%{-o-transform:rotateX(0deg);}}

@keyframes turn{
	0%{transform:rotateX(90deg);}
	100%{transform:rotateX(0deg);}
}

.flip-clock-wrapper ul.play li.flip-clock-before .up{
	z-index:2;
	-webkit-animation:turn2 0.5s linear both;
	-moz-animation:turn2 0.5s linear both;
	animation:turn2 0.5s linear both;
}

@-webkit-keyframes turn2{
	0%{-webkit-transform:rotateX(0deg);}
	100%{-webkit-transform:rotateX(-90deg);}
}

@-moz-keyframes turn2{
	0%{-moz-transform:rotateX(0deg);}
	100%{-moz-transform:rotateX(-90deg);}
}

@-o-keyframes turn2{
	0%{-o-transform:rotateX(0deg);}
	100%{-o-transform:rotateX(-90deg);}
}

@keyframes turn2{
	0%{transform:rotateX(0deg);}
	100%{transform:rotateX(-90deg);}
}

.flip-clock-wrapper ul li.flip-clock-active{z-index:3;}

/* SHADOW */
.flip-clock-wrapper ul.play li.flip-clock-before .up .shadow{
	background:-moz-linear-gradient(top, rgba(0, 0, 0, 0.1) 0%, black 100%);
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0, 0, 0, 0.1)), color-stop(100%, black));
	background:linear, top, rgba(0, 0, 0, 0.1) 0%, black 100%;
	background:-o-linear-gradient(top, rgba(0, 0, 0, 0.1) 0%, black 100%);
	background:-ms-linear-gradient(top, rgba(0, 0, 0, 0.1) 0%, black 100%);
	background:linear, to bottom, rgba(0, 0, 0, 0.1) 0%, black 100%;
	-webkit-animation:show 0.5s linear both;
	-moz-animation:show 0.5s linear both;
	animation:show 0.5s linear both;
}

.flip-clock-wrapper ul.play li.flip-clock-active .up .shadow{
	background:-moz-linear-gradient(top, rgba(0, 0, 0, 0.1) 0%, black 100%);
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0, 0, 0, 0.1)), color-stop(100%, black));
	background:linear, top, rgba(0, 0, 0, 0.1) 0%, black 100%;
	background:-o-linear-gradient(top, rgba(0, 0, 0, 0.1) 0%, black 100%);
	background:-ms-linear-gradient(top, rgba(0, 0, 0, 0.1) 0%, black 100%);
	background:linear, to bottom, rgba(0, 0, 0, 0.1) 0%, black 100%;
	-webkit-animation:hide 0.5s 0.3s linear both;
	-moz-animation:hide 0.5s 0.3s linear both;
	animation:hide 0.5s 0.3s linear both;
}

/*DOWN*/
.flip-clock-wrapper ul.play li.flip-clock-before .down .shadow{
	background:-moz-linear-gradient(top, black 0%, rgba(0, 0, 0, 0.1) 100%);
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0%, black), color-stop(100%, rgba(0, 0, 0, 0.1)));
	background:linear, top, black 0%, rgba(0, 0, 0, 0.1) 100%;
	background:-o-linear-gradient(top, black 0%, rgba(0, 0, 0, 0.1) 100%);
	background:-ms-linear-gradient(top, black 0%, rgba(0, 0, 0, 0.1) 100%);
	background:linear, to bottom, black 0%, rgba(0, 0, 0, 0.1) 100%;
	-webkit-animation:show 0.5s linear both;
	-moz-animation:show 0.5s linear both;
	animation:show 0.5s linear both;
}

.flip-clock-wrapper ul.play li.flip-clock-active .down .shadow{
	background:-moz-linear-gradient(top, black 0%, rgba(0, 0, 0, 0.1) 100%);
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0%, black), color-stop(100%, rgba(0, 0, 0, 0.1)));
	background:linear, top, black 0%, rgba(0, 0, 0, 0.1) 100%;
	background:-o-linear-gradient(top, black 0%, rgba(0, 0, 0, 0.1) 100%);
	background:-ms-linear-gradient(top, black 0%, rgba(0, 0, 0, 0.1) 100%);
	background:linear, to bottom, black 0%, rgba(0, 0, 0, 0.1) 100%;
	-webkit-animation:hide 0.5s 0.3s linear both;
	-moz-animation:hide 0.5s 0.3s linear both;
	animation:hide 0.5s 0.2s linear both;
}

@-webkit-keyframes show{
	0%{opacity:0;}
	100%{opacity:1;}
}

@-moz-keyframes show{
	0%{opacity:0;}
	100%{opacity:1;}
}

@-o-keyframes show{
	0%{opacity:0;}
	100%{opacity:1;}
}

@keyframes show{
	0%{opacity:0;}
	100%{opacity:1;}
}

@-webkit-keyframes hide{
	0%{opacity:1;}
	100%{opacity:0;}
}

@-moz-keyframes hide{
	0%{opacity:1;}
	100%{opacity:0;}
}

@-o-keyframes hide{
	0%{opacity:1;}
	100%{opacity:0;}
 }

@keyframes hide{
	0%{opacity:1;}
	100%{opacity:0;}
}