html, body {
  height: 100%;
}

/*Estilos generales de los contenedores*/
.contenedor-slide {
  position: relative;
  width: 100%;
  height: 100%;
  padding-top: 150px;
}

.contenedor-slide section {
  width: 1002px;
  height: 700px;
  margin: auto; 
  text-align: center; 
  padding-top: 110px;
  background-position: top center;
  background-repeat: no-repeat; 
}

.contenedor-slide section h2 {
  font-size: 60px;
  font-weight: 800;
  color: #FFB09B;
}

.contenedor-slide section h3 {
  font-size: 22px;
  font-weight: 500;
  color: #FF1830;
  margin-top: 20px;
  margin-bottom: 30px;
  letter-spacing: 1px;
}

.contenedor-slide section h4 {
  position: relative;
  font-size: 36px;
  font-weight: 400;
  color: #FFf;
  background-color: #FFB09B;
  padding: 60px 0; 
  margin-bottom: 40px;   
}

.contenedor-slide section h4 span {
  font-weight: 900;
}

.contenedor-slide section h4 img {
  position: absolute;
  width: 124px;
  height: 24px;
  top: 155px;
  left: 400px;    
}

.contenedor-slide section aside a {
  width: 200px;
  height: 200px;
  position: relative;
  float: left;  
  font-size: 23px;
  line-height: 25px;
  font-weight: 400;
  padding-top: 30px;
}

.contenedor-slide section aside a span {
  font-weight: 800;  
}

.contenedor-slide section aside a:nth-child(odd) {  
  color: #00CAD5;
}

.contenedor-slide section aside a:nth-child(even) { 
  color: #FF1830;
}

.contenedor-slide section aside a:nth-child(1),
.contenedor-slide section aside a:nth-child(3) {
  z-index: 1;
  border-top: 1px solid #00CAD5;
  border-left: 1px solid #00CAD5;
  border-bottom: 1px solid #00CAD5;
}


.contenedor-slide section aside a:nth-child(1)::after {
  content: url(../img/flecha.png);
  display:block;
  width: 21px;
  height:200px;
  position:absolute;
  left: 198px;
  top: 0px;
  z-index: 100;
}

.contenedor-slide section aside a:nth-child(2) {  
  border-top: 1px solid #FFB09B;
  border-left: 1px solid #FFB09B;
  border-right: 1px solid #FFB09B;
}

.contenedor-slide section aside a:nth-child(2)::after {
  content: url(../img/flecha2.png);
  display:block;
  width: 200px;
  height:24px;
  position:absolute;
  left: 0px;
  top: 197px;
}

.contenedor-slide section aside a:nth-child(3)::after {
  content: url(../img/flecha3.png);
  display:block;
  width: 21px;
  height:200px;
  position:absolute;
  left: 198px;
  top: 0px;
  z-index: 100;
}

.contenedor-slide section aside a:nth-child(4) {  
  border-bottom: 1px solid #FFB09B;
  border-left: 1px solid #FFB09B;
  border-right: 1px solid #FFB09B;
}

.contenedor-slide section aside a:nth-child(4)::after {
  content: url(../img/flecha4.png);
  display:block;
  width: 200px;
  height:24px;
  position:absolute;
  left: 0px;
  top: -23px;
}

.contenedor-slide section aside a:nth-child(5) {  
  border-top: 1px solid #00CAD5;
  border-left: 1px solid #00CAD5;
  border-right: 1px solid #00CAD5;
}

.contenedor-slide section aside a:nth-child(5)::after {
  content: url(../img/flecha5.png);
  display:block;
  width: 200px;
  height:24px;
  position:absolute;
  left: 0px;
  top: 197px;
}


/**/
.contenedor-slide .go-down {
	position: absolute;
	margin-left: auto;
	margin-right: auto;
	left: 0;
	right: 0;
	height: 50px;
	width: 30px;
	bottom: 30px;
	background-color: transparent;
	border: 2px solid #00CAD5;
	border-radius: 20px;
	cursor: pointer;
	outline: none;
}

.contenedor-slide .go-down:before {
	position: absolute;
	top: 10px;
	left: 50%;
	content: "";
	width: 6px;
	height: 6px;
	margin-left: -3px;
	background-color: #00CAD5;
	border-radius: 100%;
	-webkit-animation: scroll_down_btn-animation 2s infinite;
	animation: scroll_down_btn-animation 2s infinite;
	box-sizing: border-box;
  }

  @keyframes scroll_down_btn-animation {
    0% {
      transform: translate(0, 0);
      opacity: 0;
    }
    40% {
      opacity: 1;
    }
    80% {
      transform: translate(0, 20px);
      opacity: 0;
    }
    100% {
      opacity: 0;
    }
    }
    @-webkit-keyframes scroll_down_btn-animation {
    0% {
      transform: translate(0, 0);
      opacity: 0;
    }
    40% {
      opacity: 1;
    }
    80% {
      transform: translate(0, 20px);
      opacity: 0;
    }
    100% {
      opacity: 0;
    }
    }

/*Estilos especificos de cada contenedor*/

/*1*/
#section01 { 
  background-color: #FF1830;   
}

#contenedor-presentacion {
  background-image: url(../img/ellas.png);
  background-position: top left;
  background-repeat: no-repeat;
  padding-left: 180px;
  text-align: left;
  width: 1000px;
  margin: auto;
  margin-top: 300px;
}

#contenedor-presentacion h5 {
  font-size: 60px;
  font-weight: 900;
  color: white;
  margin-top: 80px;
  margin-bottom: 50px;  
}

#contenedor-presentacion p {
  font-size: 30px;
  line-height: 40px;
  color: white;
  font-weight: 300;  
}

#section01 .go-down {
	border: 2px solid #fff;
}

#section01 .go-down:before {
	background-color: #fff;
  }


/*2 Creación de marca*/
#section02 { 
  border-bottom: 1px solid #00CAD5;
}

#section02 section {
background-image: url(../img/creacion-de-marca.png);
} 

/*3 Comunicación*/
#section03 { 
  border-bottom: 1px solid #FFB09B; 
}

#section03 section {
  background-image: url(../img/comunicacion.png);
  } 

#section03 section h2 {
  color: #00CAD5;
}

#section03 section h4 {
  background-color: #00CAD5;

}


/*4 Web*/
#section04 { 
  border-bottom: 1px solid #FF1830;   
}
#section04 section {
  background-image: url(../img/web.png);
  } 

/*5 Fotografía*/
#section05 { 
  border-bottom: 1px solid #00CAD5;
}

#section05 section {
  background-image: url(../img/fotografia.png);
  }

#section05 section h2 {
  color: #00CAD5;
}

#section05 section h4 {
  background-color: #00CAD5;

}


/*6*/
#section06 { 
  background-color: #FF1830;
}

.btn-hablemos {
  position: absolute;
  top: 400px;
  left: 25%;  
  width: 50%;
  height: 200px;
  background-color: white;
  color: #FF1830;
  font-size: 28px;
  letter-spacing: 1px;
  line-height: 200px;
  font-weight: 500;
  text-align: left;
  padding-left: 14%;
  box-shadow: 9px 13px 41px -10px rgba(0,0,0,0.22);  
}

.btn-hablemos::after {
  content: url(../img/flecha8.png);
  display:block;
  width: 210px;
  height:72px;
  position:absolute;
  left: 120px;
  top: 140px;
}

.btn-hablemos span {
  font-weight: 800; 
}

.btn-hablemos:hover {
  box-shadow: 9px 13px 41px -10px rgba(0,0,0,0.66);
  color: #00CAD5;
}

#section06 .go-down {
	border: 2px solid #fff;
}

#section06 .go-down:before {
	background-color: #fff;
  }

/*7*/
#section07 { 
  background-color: #FFB09B;
}

#footer-home {
  width: 300px;
  height: 250px;
  margin: auto;  
  text-align: center;
  font-size: 16px;
  line-height: 40px;
  padding-top: 60px;
  background-image: url(../img/koi2.png);
  background-position: top center;
  background-repeat: no-repeat;
  color: #fff;
}

#section07 #subir {
  text-align: center;
  width: 100%;
  height: 30px;
  margin: auto;
  position: absolute;
}


#instagram-plugin  {
  width: 100%;
  height: 330px;
}

#instagram-plugin h2 {
	text-align: center;
	color: #fff;
	font-size: 22px;
	margin-top: 20px;
	margin-bottom: 10px;
	width: 100%;
	height: 50px;
}

#instagram-plugin h2 a {
	color: #FF1830;
}

#instagram-plugin h2 a:hover {
	color: #00CAD5;
}

/* M E D I A _ Q U E R Y
*****************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/


/*1600*/
@media screen and (max-width:1600px) {

#contenedor-presentacion {
  margin-top: 100px;
  }

.contenedor-slide {
  padding-top: 100px;
  }

.contenedor-slide section {
  height: 600px;
  background-size: 150px; 
  padding-top: 100px;  
}

.contenedor-slide section h2 {
  font-size: 40px;
}

.contenedor-slide section h3 {
  font-size: 18px;
  margin-top: 20px;
  margin-bottom: 30px;
}

.contenedor-slide section h4 {
  font-size: 26px;
  letter-spacing: 1px;
  padding: 40px 0; 
  margin-bottom: 40px;   
}

.contenedor-slide section h4 img {
  top: 100px;
  left: 400px;    
}

/*1*/
#section01 { 
  padding-top: 13%;
}

.btn-hablemos {
  top: 300px;
  left: 15%;  
  width: 70%;
  height: 200px;
  padding-left: 22%;
}

}

/*1400*/
@media screen and (max-width:1400px) {

.contenedor-slide {
  padding-top: 120px;
  }

.contenedor-slide section {
  height: 450px;
  background-position: top left;
  padding-top: 0px;   
  }

.contenedor-slide section h4 {
  font-size: 20px;
  letter-spacing: 2px;
  padding: 20px 0; 
  margin-bottom: 40px;   
}

.contenedor-slide section h4 img {
  top: 55px;  
  width: 100px;
}

.contenedor-slide section aside a {
  font-size: 18px;
  line-height: 20px;
  padding-top: 40px;
}

.contenedor-slide section aside a img {
  width: 40px;
}

#contenedor-presentacion {
	padding-left: 130px;
	width: 680px;
	height: 200px;
	margin-top: 150px;
	background-size: 12%;
  }
  
  #contenedor-presentacion h5 {
	font-size: 40px;
	margin-top: 40px;
	margin-bottom: 30px;
  }
  
  #contenedor-presentacion p {
	font-size: 20px;
	line-height: 30px;
  }

}

/*1024*/
@media screen and (max-width:1200px) {

.contenedor-slide {
  padding-top: 150px;
  }

.contenedor-slide section {
  width: 600px;
  padding-top: 0;
}

#section02 section {
  background-image:none;
  } 

  #section03 section {
  background-image:none;
  } 

  #section04 section {
  background-image:none;
  }   
 
  #section05 section {
  background-image:none;
  }

.contenedor-slide section h2 {
  font-weight: 700;
  font-size: 30px;
  line-height: 30px;
  margin-bottom: 0px;
}

.contenedor-slide section h3 {
  font-size: 15px; 
  line-height: 20px;
  margin-top: 10px;
  margin-bottom: 10px;
  letter-spacing: normal;
}

.contenedor-slide section h4 {
  width: 100%;
  font-size: 18px;
  padding: 20px 0; 
  margin-bottom: 20px; 
  letter-spacing: 1px;  
}

.contenedor-slide section h4 img {
  top: 50px; 
}

.contenedor-slide section p {
  font-size: 16px;
  line-height: 36px;  
}

.contenedor-slide section aside a {
  width: 198px;
  height: 150px;
  margin: 1px;
  font-size: 16px;
  line-height: 20px;
  padding-top: 30px;
}

.contenedor-slide section aside a img {
  width: 30px;
}

.contenedor-slide section aside a:nth-child(1),
.contenedor-slide section aside a:nth-child(2),
.contenedor-slide section aside a:nth-child(3),
.contenedor-slide section aside a:nth-child(4),
.contenedor-slide section aside a:nth-child(5) {
 border: 1px dashed #FFB09B; 
}


.contenedor-slide section aside a:nth-child(1)::after,
.contenedor-slide section aside a:nth-child(2)::after,
.contenedor-slide section aside a:nth-child(3)::after,
.contenedor-slide section aside a:nth-child(4)::after,
.contenedor-slide section aside a:nth-child(5)::after {
  content: none;
}



/*1*/
#section01 { 
  padding-top: 20%;
}


/*2 y 3*/

#section02 section,
#section03 section, {
  padding-left: 130px;
  background-size: 15%;
}

/*4*/

#section04 section ul li img {
  width: 24%;
}

#section04 section ul li:nth-child(5) {
  display: none;
}

}


/*800*/
@media screen and (max-width:900px) {

.contenedor-slide {
  padding-top: 15%;
  }

#contenedor-presentacion {
	padding-left: 0;
  padding-top: 130px;
	width: 380px;
	height: 400px;
	margin-top: 140px;
	background-size: 20%;
  background-position: top center;
  text-align: center;
  }

#contenedor-presentacion p {
  font-size: 18px;
  line-height: 38px;
}
  

.contenedor-slide section {
  width: 500px;
  height: 550px;
  padding-top: 0;
}

.contenedor-slide section h2 {
  line-height: 30px;
  margin-bottom: 30px;
}

.contenedor-slide section h3 {
  font-size: 16px; 
  line-height: 26px;
  margin-top: 10px;
  width: 320px;
  height: 70px;
  margin: auto;  
}

.contenedor-slide section h4 {
  padding: 30px 0; 
  margin-bottom: 30px; 
}

.contenedor-slide section h4 img {
  top: 70px; 
  left: 300px;
}

.contenedor-slide section aside a {
  width: 164px;
  height: 150px;
  margin: 1px;
  font-size: 16px;
  line-height: 20px;
  padding-top: 30px;
}

}

/*móvil*/
@media screen and (max-width:500px) {

.contenedor-slide {
  padding-top: 20%;
  }

.contenedor-slide section {
  width: 320px;
  height: 750px;
  padding-top: 0;
  background-color: rgba(238, 238, 238, 0.22);
}

.contenedor-slide section h4 {
  padding: 30px;
  line-height: 26px;
}

.contenedor-slide section h4 img {
  top: 105px; 
  left: 200px;
}

.contenedor-slide section aside a {
  width: 158px;
}


}