html, body {
    float: left;
    width: 100%;
    height: 100%;
    overflow-x: hidden;
    max-width: 100%;
}

.sliderProductTour {
	height: 480px;
}

.sliderProductTour .productTour h2 {
	color:#FFF;
	margin-bottom:25px;
}

.sliderProductTour p {
	color:#FFF;
	line-height: 20px;
}

.sliderProductTour ul {
	line-height: 24px;
	margin: 20px 0;
	padding-left: 20px;
	color:#FFF;
	list-style-image: url('../img/greenArrowLists.svg')
}

#sliderC a img {
	border:none;
}

#sliderC {
	text-align:center;
}
#sliderC {
	margin:0 auto;
}
#sliderC input {
	display:none;
}
#slideC1:checked ~ #slidesC .inner {
	margin-left:0;
}
#slideC2:checked ~ #slidesC .inner {
	margin-left:-100%;
}
#slideC3:checked ~ #slidesC .inner {
	margin-left:-200%;
}
#container {
	width:100%;
	overflow:hidden;
}
#slidesC .inner {
	width: 300%;
	line-height: 0;
	transition: all 1s ease-out;
}

#sliderC > #play2:checked ~ #slidesC #container .inner {
	animation: cambioC 18s infinite ease-out;
	transition: all 1s ease-out;
}

#slidesC article {
	float:left;
	width:-webkit-calc(100% / 3);
	width:calc(100% / 3);
	padding: 25px 0;
}


#active2 {
	position: relative;
	z-index:5;
	margin: 0 0 0;
	text-align:center;
}

.clients #active2 label {
	margin-bottom:40px;
	margin-top:30px;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	border-radius:5px;
	display:inline-block;
	width:10px;
	height:10px;
	background:transparent;
	border:2px solid #000;
}
.clients #active2 label:hover {
	margin-bottom:40px;
	background:#000;
	opacity: 0.6;
	border-color:#000!important;
}

#slideC1:checked ~ #active2 label:nth-child(1),
#slideC2:checked ~ #active2 label:nth-child(2),
#slideC3:checked ~ #active3 label:nth-child(3) {
	margin-top:30px;
	margin-bottom:40px;
	background:#000;
	opacity:1;
	border-color:#000!important;
}

#slidesC {
		position:relative;
		background:transparent;
	}

#sliderC {
		-webkit-transform:translateZ(0);
		-webkit-transition:all 0.5s ease-out;
		-moz-transition:all 0.5s ease-out;
		-o-transition:all 0.5s ease-out;
		transition:all 0.5s ease-out;
}

#commandsC label {
		-webkit-transform:translateZ(0);
		-webkit-transition:opacity 0.2s ease-out;
		-moz-transition:opacity 0.2s ease-out;
		-o-transition:opacity 0.2s ease-out;
		transition:opacity 0.2s ease-out;
}

#slideC1:checked ~ #slides article:nth-child(1) .caption,
#slideC2:checked ~ #slides article:nth-child(2) .caption,
#slideC3:checked ~ #slides article:nth-child(3) .caption {
		opacity:1;
		-webkit-transition:all 1s ease-out 0.6s;
		-moz-transition:all 1s ease-out 0.6s;
		-o-transition:all 1s ease-out 0.6s;
		transition:all 1s ease-out 0.6s;
}

#slider {
		max-width:100%;
}

.productTour .iconSlider {
		margin:5px 5px 0 0;
}

@media only screen and (max-width:850px) and (min-width:450px){
	
	  #sliderC #commandsC {
				margin:-25% 0 0 5%;
				width:90%;
				height:50px
		}
	  #sliderC #commandsC label {
				-moz-transform:scale(0.9);
				-webkit-transform:scale(0.9);
				-o-transform:scale(0.9);
				-ms-transform:scale(0.9);
				transform:scale(0.9);
		}
	  #sliderC #slidesC .caption {
				padding:280px 12px;
		}
	  #sliderC #slidesC {
				padding:2px 0;
				-webkit-border-radius:0;
				-moz-border-radius:0;
				border-radius:0;
		}
	  #sliderC #active2 {
				margin:15% 0 0;
		}
}

@media only screen and (max-width:450px) {
  #sliderC #commandsC {
			margin:-28% 0 0 1%;
			width:100%;
			height:70px
	}
  #sliderC #active2 {
			margin:12% 0 0;
	}
  #sliderC #slidesC {
			padding:2px 0;
			-webkit-border-radius:0;
			-moz-border-radius:0;
			border-radius:0;
	}
  #sliderC #slidesC .caption {
			/*opacity:0!important;*/
	}
  #sliderC #commandsC label {
			-moz-transform:scale(0.7);
			-webkit-transform:scale(0.7);
			-o-transform:scale(0.7);
			-ms-transform:scale(0.7);
			transform:scale(0.7);
	}
	.productTour .socialIcons {
		width: 40px;
	}
}

@media only screen and (min-width:850px){
  	body{
				padding:0;
		}
}

@keyframes cambioC {
	0% {margin-left: 0;}
	30% {margin-left: 0;}

	33% {margin-left: -100%;}
	60% {margin-left: -100%;}

	66% {margin-left: -200%;}
	99% {margin-left: -200%;}
}


/* Calculate AUTOPLAY for BULLETS */
@keyframes bullet2 {
 	0% { background: red; }
	45% { background: red; }

  	50% {background: none;}
	100% {background: none;}
}

#play2:checked ~ #active2 label:nth-child(1) {
  animation: bullet2 18s infinite 0s;
}

#play2:checked ~ #active2 label:nth-child(2) {
  animation: bullet2 12s infinite 6s;
}

#play3:checked ~ #active3 label:nth-child(3) {
  animation: bullet2 18s infinite 6s;
}


/* arrows */

@keyframes arrowsC {
	0% {display: block; pointer-events: all;}
	30% {display: block; pointer-events: all;}

	33% {display: none; pointer-events: none; }
	60% {display: none; pointer-events: none; }

	66% {display: none; pointer-events: none; }
	99% {display: none; pointer-events: none; }
}


@keyframes arrows2C {
	0% {display: none; pointer-events: none; }
	30% {display: none; pointer-events: none; }

	33% {display: block; pointer-events: all; }
	60% {display: block; pointer-events: all; }

	66% {display: block; pointer-events: all; }
	99% {display: block; pointer-events: all; }
}

@keyframes arrows3C {
	0% {display: none; pointer-events: none; }
	30% {display: none; pointer-events: none; }

	33% {display: block; pointer-events: all; }
	60% {display: block; pointer-events: all; }

	66% {display: block; pointer-events: all; }
	99% {display: block; pointer-events: all; }
}

#sliderC > #play2:checked ~ #slidesC .article1 .commandsC label {
	animation: arrowsC 18s infinite ease-out;
}

#sliderC > #play2:checked ~ #slidesC .article2 .commandsC label {
	animation: arrows2C 18s infinite ease-out;
}

#sliderC > #play2:checked ~ #slidesC .article3 .commandsC label {
	animation: arrows3C 18s infinite ease-out;
}

.commandsC label.prev {
	width: 50px;
	height: 50px;
	opacity:0.5;
	background: url(../img/arrowPrev.png) no-repeat center center;
	position: absolute;
	left: -50px;
	top: 40%;
}
.commandsC label.next {
	width: 50px;
	height: 50px;
	opacity: 0.5;
	background: url(../img/arrowNext.png) no-repeat center center;
	position: absolute;
	right: -50px;
	top: 40%;
}


#slideC1 ~ #slidesC .commandsC label { pointer-events: none; cursor: pointer; }
#slideC2 ~ #slidesC .commandsC label { pointer-events: none; cursor: pointer;  }
#slideC3 ~ #slidesC .commandsC label { pointer-events: none; cursor: pointer;  }

#slideC1:checked ~ #slidesC .article1 .commandsC label { display: block; pointer-events: all; }
#slideC2:checked ~ #slidesC .article2 .commandsC label { display: block; pointer-events: all; }
#slideC3:checked ~ #slidesC .article3 .commandsC label { display: block; pointer-events: all; }