@import url(http://fonts.googleapis.com/css?family=Ubuntu:300,400,500,700);
.no-js {
	padding-top: 106px;
}
h2 {
	margin-top: 0;
}
.loading {
	background: url('../img/ico_loading.gif') no-repeat center center;
}
section {
	min-width: 1500px;
	opacity: 0;
}
.loaded section,
.no-js section {
	opacity: 1;
	-webkit-transition: opacity 300ms ease-out;
	-moz-transition: opacity 300ms ease-out;
	transition: opacity 300ms ease-out;
}
main {
	overflow-x: hidden;
}
/********************************* Casos de Exito ************************************/
#slides-container {
    width: 100%;
    height: 100%;
    overflow: hidden;
}
#slides {
    width: 200%;
    height: 200%;
    position: fixed;
    top: 0;
    left: 0;
}
.slide {
    position:absolute;
    top:0;
    left:0;
    width:50%;
    height:50%;
}
.nombre-caso{
	position:fixed;
	left:5%;
	top:10%;
	text-shadow: 0px 0px 21px rgba(0, 0, 0, 0.92);
}
/*********************************** Caso Chill y Chop ****************************/
#chill-y-chop-slide-1 {
    background:url(../img/casos/chill%20y%20chop/jelly.jpg) no-repeat center center;
    background-size: cover;
}
#chill-y-chop-slide-2 {
    background: url(../img/casos/chill%20y%20chop/mostrador.jpg) no-repeat center center;
    background-size: cover;
    -webkit-transform: translate(0,100%);
    -ms-transform: translate(0,100%);
    transform: translate(0,100%);
}
#chill-y-chop-slide-3 {
    background: url(../img/casos/chill%20y%20chop/cartel_borroso.jpg) no-repeat center center;
    background-size: cover;
    -webkit-transform: translate(100%,100%);
    -ms-transform: translate(100%,100%);
    transform: translate(100%,100%);
}
#chill-y-chop-slide-4 {
    background: url(../img/casos/chill%20y%20chop/papitas.jpg) no-repeat center center;
    background-size: cover;
    -webkit-transform: translate(100%,0%);
    -ms-transform: translate(100%,0%);
    transform: translate(100%,0%);}
#chill-y-chop-slide-5 {
    background:url(../img/casos/chill%20y%20chop/bagel.jpg) no-repeat center center;
    background-size: cover;
    -webkit-transform: translate(200%,0%);
    -ms-transform: translate(200%,0%);
    transform: translate(200%,0%);}
#chill-y-chop-slide-3 .bcg {background-image:url(../img/casos/chill%20y%20chop/cartel.jpg); opacity:0;}
#chill-y-chop-slide-4 .bcg {background-image:url(../img/casos/chill%20y%20chop/papitas-con-cartel.jpg); opacity:0;}
/*********************************** Fin Caso Chill y Chop ****************************/
/*********************************** Caso Dominguez y Lucero  ****************************/
#Dominguez-y-Lucero-slide-1 {
    background:url(../img/casos/Dominguez%20y%20Lucero/slide-1.jpg) no-repeat center center;
    background-size: cover;
	z-index:10;
}
#Dominguez-y-Lucero-slide-2 {
    background: url(../img/casos/Dominguez%20y%20Lucero/slide-2.jpg) no-repeat center center;
    background-size: cover;
    -webkit-transform: translate(0%,0%);
    -ms-transform: translate(0%,0%);
    transform: translate(0%,0%);
	z-index:9;
}
#Dominguez-y-Lucero-slide-3 {
    background: url(../img/casos/Dominguez%20y%20Lucero/slide-3-borroso.jpg) no-repeat center center;
    background-size: cover;
    -webkit-transform: translate(0,100%);
    -ms-transform: translate(0,100%);
    transform: translate(0,100%);
	z-index:8;
}
#Dominguez-y-Lucero-slide-4 {
    background: url(../img/casos/Dominguez%20y%20Lucero/slide-4.jpg) no-repeat center center;
    background-size: cover;
    -webkit-transform: translate(100%,100%);
    -ms-transform: translate(100%,100%);
    transform: translate(100%,100%);}
#Dominguez-y-Lucero-slide-5 {
    background:url(../img/casos/Dominguez%20y%20Lucero/slide-5.jpg) no-repeat center center;
    background-size: cover;
    -webkit-transform: translate(100%,0%);
    -ms-transform: translate(100%,0%);
    transform: translate(100%,0%);}
#Dominguez-y-Lucero-slide-3 .bcg {background-image:url(../img/casos/Dominguez%20y%20Lucero/slide-3.jpg); opacity:0;}
#Dominguez-y-Lucero-slide-4 .bcg {background-image:url(../img/casos/Dominguez%20y%20Lucero/slide-4-imagen.jpg); opacity:0;}
/*********************************** Fin Caso Domínguez y Lucero ****************************/
/*********************************** Caso Heath&Light ****************************/
#HealthandLight-slide-1 {
    background:url(../img/casos/HealthandLight/slide-1.jpg) no-repeat center center;
    background-size: cover;
}
#HealthandLight-slide-2 {
    background: url(../img/casos/HealthandLight/slide-2.jpg) no-repeat center center;
    background-size: cover;
    -webkit-transform: translate(0,100%);
    -ms-transform: translate(0,100%);
    transform: translate(0,100%);
}
#HealthandLight-slide-3 {
    background: url(../img/casos/HealthandLight/slide-3-borroso.jpg) no-repeat center center;
    background-size: cover;
    -webkit-transform: translate(100%,100%);
    -ms-transform: translate(100%,100%);
    transform: translate(100%,100%);
}
#HealthandLight-slide-4 {
    background: url(../img/casos/HealthandLight/slide-4.jpg) no-repeat center center;
    background-size: cover;
    -webkit-transform: translate(100%,0%);
    -ms-transform: translate(100%,0%);
    transform: translate(100%,0%);}
#HealthandLight-slide-5 {
    background:url(../img/casos/HealthandLight/slide-5.jpg) no-repeat center center;
    background-size: cover;
    -webkit-transform: translate(200%,0%);
    -ms-transform: translate(200%,0%);
    transform: translate(200%,0%);}
#HealthandLight-slide-3 .bcg {background-image:url(../img/casos/HealthandLight/slide-3.jpg); opacity:0;}
#HealthandLight-slide-4 .bcg {background-image:url(../img/casos/HealthandLight/slide-4-imagen.jpg); opacity:0;}
/*********************************** Fin Caso Heath&Light ****************************/
/*********************************** Caso Banini Corp ****************************/
#Babini-Corp-slide-1 {
    background:url(../img/casos/Babini%20Corp/slide-1.jpg) no-repeat center center;
    background-size: cover;
	z-index:10;
}
#Babini-Corp-slide-2 {
    background: url(../img/casos/Babini%20Corp/slide-2.jpg) no-repeat center center;
    background-size: cover;
    -webkit-transform: translate(0%,0%);
    -ms-transform: translate(0%,0%);
    transform: translate(0%,0%);
	z-index:9;
}
#Babini-Corp-slide-3 {
    background: url(../img/casos/Babini%20Corp/slide-3-borroso.jpg) no-repeat center center;
    background-size: cover;
    -webkit-transform: translate(0,100%);
    -ms-transform: translate(0,100%);
    transform: translate(0,100%);
	z-index:8;
}
#Babini-Corp-slide-4 {
    background: url(../img/casos/Babini%20Corp/slide-4.jpg) no-repeat center center;
    background-size: cover;
    -webkit-transform: translate(100%,100%);
    -ms-transform: translate(100%,100%);
    transform: translate(100%,100%);}
#Babini-Corp-slide-5 {
    background:url(../img/casos/Babini%20Corp/slide-5.jpg) no-repeat center center;
    background-size: cover;
    -webkit-transform: translate(100%,0%);
    -ms-transform: translate(100%,0%);
    transform: translate(100%,0%);}
#Babini-Corp-slide-3 .bcg {background-image:url(../img/casos/Babini%20Corp/slide-3.jpg); opacity:0;}
#Babini-Corp-slide-4 .bcg {background-image:url(../img/casos/Babini%20Corp/slide-4-imagen.jpg); opacity:0;}
/*********************************** Fin Caso Banini Corp ****************************/
/*********************************** Caso Pirma ****************************/
#pirma-slide-1 {
    background:url(../img/casos/pirma/slide-1.jpg) no-repeat center center;
    background-size: cover;
	z-index:10;
}
#pirma-slide-2 {
    background: url(../img/casos/pirma/slide-2.jpg) no-repeat center center;
    background-size: cover;
    -webkit-transform: translate(0%,0%);
    -ms-transform: translate(0%,0%);
    transform: translate(0%,0%);
	z-index:9;
}
#pirma-slide-3 {
    background: url(../img/casos/pirma/slide-3-borroso.jpg) no-repeat center center;
    background-size: cover;
    -webkit-transform: translate(0,100%);
    -ms-transform: translate(0,100%);
    transform: translate(0,100%);
	z-index:8;
}
#pirma-slide-4 {
    background: url(../img/casos/pirma/slide-4.jpg) no-repeat center center;
    background-size: cover;
    -webkit-transform: translate(100%,100%);
    -ms-transform: translate(100%,100%);
    transform: translate(100%,100%);}
#pirma-slide-5 {
    background:url(../img/casos/pirma/slide-5.jpg) no-repeat center center;
    background-size: cover;
    -webkit-transform: translate(100%,0%);
    -ms-transform: translate(100%,0%);
    transform: translate(100%,0%);}
#pirma-slide-3 .bcg {background-image:url(../img/casos/pirma/slide-3.jpg); opacity:0;}
#pirma-slide-4 .bcg {background-image:url(../img/casos/pirma/slide-4-imagen.jpg); opacity:0;}
/*********************************** Fin Caso Pirma ****************************/
/*********************************** Caso ProAmbi ****************************/
#ProAmbi-slide-1 {
    background:url(../img/casos/ProAmbi/slide-1.jpg) no-repeat center center;
    background-size: cover;
	z-index:10;
}
#ProAmbi-slide-2 {
    background: url(../img/casos/ProAmbi/slide-2.jpg) no-repeat center center;
    background-size: cover;
    -webkit-transform: translate(0%,0%);
    -ms-transform: translate(0%,0%);
    transform: translate(0%,0%);
	z-index:9;
}
#ProAmbi-slide-3 {
    background: url(../img/casos/ProAmbi/slide-3-borroso.jpg) no-repeat center center;
    background-size: cover;
    -webkit-transform: translate(0,100%);
    -ms-transform: translate(0,100%);
    transform: translate(0,100%);
	z-index:8;
}
#ProAmbi-slide-4 {
    background: url(../img/casos/ProAmbi/slide-4.jpg) no-repeat center center;
    background-size: cover;
    -webkit-transform: translate(100%,100%);
    -ms-transform: translate(100%,100%);
    transform: translate(100%,100%);}
#ProAmbi-slide-5 {
    background:url(../img/casos/ProAmbi/slide-5.jpg) no-repeat center center;
    background-size: cover;
    -webkit-transform: translate(100%,0%);
    -ms-transform: translate(100%,0%);
    transform: translate(100%,0%);}
#ProAmbi-slide-3 .bcg {background-image:url(../img/casos/ProAmbi/slide-3.jpg); opacity:0;}
#ProAmbi-slide-4 .bcg {background-image:url(../img/casos/ProAmbi/slide-4-imagen.jpg); opacity:0;}
/*********************************** Fin Caso ProAmbi ****************************/
	
.caption {
    position: absolute;
    bottom: 5%;
    right: 5%;
    text-align: right;
    color: #fff;
	width:60%;
}
.caption p{
	text-align:justify;}
.caption h1{
	font-size:1vw;}
#slide-3 .caption {
    left: 5%;
    right: auto;
    color: #FFF;
	z-index:1;
}
 
#slide-4 .caption {
    right: auto;
    left: 5%;
    top: 5%;
    bottom: auto;
    color: #FFF;
}
.slide 	p, .caption h1 { margin: 0;}
.slide h1 { margin-bottom: 0.2em; font: 500 2.5vw 'Ubuntu', sans-serif; color:#FFF; min-font-size:25px;}
.slide p { line-height: 1.333em; font: 300 1.5vw 'Ubuntu', sans-serif; color:#FFF; min-font-size:13px; text-align:justify;}
/*ayudante de scroll*/
#helper {
    position:absolute;
    left:0;
    top: 0;
    height:600%;
    width: 20px;
	opacity:0;
}
.marker {
    height: 25%;
    width: 100%;
}
.red {
    background-color: red;
}
.green {
    background-color: green;
}
.blue {
    background-color: blue;
}
.yellow {
    background-color: yellow;
}
.reto{
	position:absolute;
	top:20%;
    text-align: right;
    color: #fff;
	left: 5%;
    right: auto;
    color: #FFF;
	z-index:1;
	width:60%;
	text-align:left;}
.estrategia{
	position:absolute;
	top:50%;
	right:100%;
    text-align: right;
    color: #FFF;
	z-index:1;
	width:60%;
	text-align:right;}
.plan-de-accion{
	position:absolute;
	top:20%;
    text-align: right;
    color: #fff;
	left: 5%;
    right: auto;
    color: #FFF;
	z-index:1;
	width:60%;
	text-align:left;}

.resultado{
	position:absolute;
	top:20%;
    text-align: right;
    color: #fff;
	left: 5%;
    right: auto;
    color: #FFF;
	z-index:1;
	width:60%;
	text-align:left;}
.plan-de-accion p, .resultado p{
	position:relative;
	width:60%;
	text-align:justify;
	margin: 2%	 0 0 0;
}

.resultado p{
	position: absolute;
}
.nombre-caso h1{
	color:#fff;
	font-size: 3.5vw;
	min-font-size: 33px;
}
.nombre-caso p{
	color:#fff;
	font-size: 2.5vw;
	min-font-size: 28px;
}
.boton-casos{
	position:absolute;
	top: 250px;
	left:40px;
	font-family: "Ubuntu";
 	color: #ffffff;
	padding:10px;
	margin:10px 0 30px 0;
	width:300px;
	float:right;
	border: solid #ffffff 2px;
	text-decoration: none;
	transition-duration: .25s;
}
.boton-casos h3{
	font-size:2vw;
	min-font-size: 18px;
}
.boton-casos:hover{
	background-color:#fff;
	color:#EC8026;
}
.casos{ opacity:0; transition-duration: .5s;}
.casos:hover{opacity:1; transition-duration: .5s;}
/************************************* Servicos ************************************/
.bcg {
	background-position: center center;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: cover;
	height: 100%;
	width: 100%;
}
/* Slide 1 */
#header-servicios .bcg { background-color:#FFF;}

/* Slide 2 */
#cuerpo-servicios .bcg {background-color: #EC8026; text-align: center}

/* Slide 3 /// Clase de las imagenes de fondo para cada servicio*/
#legarreta .bcg {background-image:url(../img/Servicios/legarreta.jpg); background-color:#0075BB; }
#branding .bcg {background-image:url(../img/Servicios/Branding.jpg); background-color:#FFF; }
#local-comercial .bcg {background-image:url(../img/Servicios/local-comercial.jpg); background-color:#FFF; }
#identidad .bcg {background-image:url(../img/Servicios/identidad.jpg); background-color:#FFF; }
#web .bcg {background-image:url(../img/Servicios/web.jpg); background-color:#FFF; }
/* FIN Slide 3 */
/********************************* Fin Servicos ************************************/
.flecha-animada{
	width:200;
	height:200;
	-webkit-animation: indicar 2s infinite; /* Chrome, Safari, Opera */
    animation: indicar 2s infinite;
	position:relative;
	top:250px;
}
.palomita{
	height:1.6vw;
	width:auto;
	min-height:14px;
}
@media only screen and (max-width : 480px) {
.plan-de-accion{
	width:100%;
}
.caption {
	width:90%;
}
.resultado{
	width:100%;
}
.plan-de-accion p, .resultado p, .resultado h1{
	width:80%;
	text-shadow: 0px 0px 3px rgba(0, 0, 0, 1);
}
.caption p{
	width:90%;
	float:right;
}
.boton-casos{
	position:absolute;
	top: 150px;
	left:40px;
	font-family: "Ubuntu";
 	color: #ffffff;
	padding:10px;
	margin:10px 0 30px 0;
	width:200px;
	float:right;
	border: solid #ffffff 2px;
	text-decoration: none;
	transition-duration: .25s;
}
.boton-casos h3{
	font-size:15px;
}
}
@media only screen and (max-height : 470px) {
.nombre-caso{
	top:20%;
}
}
@media only screen and (max-height: 400px) {
.reto{
	top:30%;
}
.estrategia {
	top: 60%;
}

.plan-de-accion{
	top:30%;
}
.resultado{
	top:30%;
}
.boton-casos{
	position:absolute;
	top: 130px;
	left:40px;
	font-family: "Ubuntu";
 	color: #ffffff;
	padding:10px;
	margin:10px 0 30px 0;
	width:200px;
	float:right;
	border: solid #ffffff 2px;
	text-decoration: none;
	transition-duration: .25s;
}
}
/* Chrome, Safari, Opera */
@-webkit-keyframes indicar {
    0% {top: 250px;}
    35% {top: 300px;}
	70% {top: 250px;}
	100% {top: 250px;}
}

/* Standard syntax */
@keyframes indicar {
    0% {top: 250px;}
    50% {top: 300px;}
	100% {top: 250px;}
}
.boton-casos a{
	text-decoration:none;
	color:#FFF;
}
.boton-casos a:hover{
	text-decoration:none;
	color:#F47B20;
}
.boton-casos a:visited{
	text-decoration:none;
	color:#FFF;
}
.boton-casos a h3:hover{
	text-decoration:none;
	color:#F47B20;
}