@import url('https://fonts.googleapis.com/css2?family=Roboto+Mono:wght@400;500;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');

html{width:100%;
	height:100%;
}

body{width:100%;height:100%;background-color:#e7e7e7;transition:all .5s;-moz-transition:all 1s;-webkit-transition:all .5s;-o-transition:all .5s; z-index:9998;}
body.xs{background-color:#e7e7e7; }
body.xl{ background-color:#e7e7e7;}

#elheader{ background-color:#ffffff; width:100%; height:90px; top:20px; left:0; position:fixed;transition:all 1s;-moz-transition:all 1s;-webkit-transition:all 1s;-o-transition:all 1s; z-index:9998;}
#elheader.xs{ background-color:rgb(255, 255, 255, .9); position:fixed;  top:0px; height:90px;}
#elheader.xl{ background-color:#ffffff;position:fixed; }


#elheadchido{ width:100%; text-align:center; height:90px; top:0; left:0; position: fixed; background-color:#1d1717; z-index:9999;}

#elwhats{ z-index: 9999; width:135px; height: 31px; background-image: url("../imagenes/whats.svg"); position: fixed; right: 20px; bottom: 20px;}


* { margin: 0px;
padding: 0px; outline: 0;
}
iframe { display:block; border:none; }

.os-animation{
            opacity: 0;
 }  

.os-animation.animated{
            opacity: 1;
 }  
 
 *:focus { 
    outline: none; 
} 

#home{ width:100%; height:100%; }

#elhead{ width:100%; text-align:center; height:110px; top:0; left:0; position:absolute; background-color:#1d1717; z-index:9999;}



#lap{ display: inline-block; width:100%; height:100%; text-align:center;margin: 0px; padding: 0px; outline: 0;background-color:#e7e7e7; }

.tabla{ width:100%; height:100%;margin: 0px; padding: 0px; outline: 0; }


.texto1{font-family: 'Roboto Mono', monospace;color:#858386; font-size:14px; line-height:26px; font-weight:400; text-decoration:none;}
.texto2{font-family: 'Roboto Mono', monospace;color:#858386; font-size:12px; line-height:26px; font-weight:400; text-decoration:none;}
.texto3{font-family: 'Inter', sans-serif;color:#282828; font-size:20px; line-height:150%; font-weight:500; text-decoration:none;}
.texto4{font-family: 'Inter', sans-serif;color:#f14f4f; font-size:20px; line-height:150%; font-weight:700; text-decoration:none;}
.texto5{font-family: 'Inter', sans-serif;color:#282828; font-size:60px; line-height:100%; font-weight:600; text-decoration:none;}
.texto5b{font-family: 'Inter', sans-serif;color:#f14f4f; font-size:60px; line-height:100%; font-weight:600; text-decoration:none;}
.texto5a{font-family: 'Inter', sans-serif;color:#282828; font-size:50px; line-height:100%; font-weight:600; text-decoration:none;}
.texto6{font-family: 'Inter', sans-serif;color:#f14f4f; font-size:60px; line-height:100%; font-weight:600; text-decoration:none;}
.texto7{font-family: 'Inter', sans-serif;color:#282828; font-size:20px; line-height:120%; font-weight:500; text-decoration:underline;}
.texto8{font-family: 'Inter', sans-serif;color:#282828; font-size:90px; line-height:90%; font-weight:600; text-decoration:none;}
.texto9{font-family: 'Inter', sans-serif;color:#f14f4f; font-size:30px; line-height:150%; font-weight:700; text-decoration:none;}
.texto10{font-family: 'Inter', sans-serif;color:#282828; font-size:18px; line-height:150%; font-weight:500; text-decoration:none;}
.texto11{font-family: 'Inter', sans-serif;color:#e7e7e7; font-size:50px; line-height:100%; font-weight:400; text-decoration:none;}
.texto12{font-family: 'Inter', sans-serif;color:#e7e7e7; font-size:22px; line-height:130%; font-weight:400; text-decoration:none;}
.texto13{font-family: 'Roboto Mono', monospace;color:#e7e7e7; font-size:14px; line-height:26px; font-weight:400; text-decoration:none;}
.texto14{font-family: 'Inter', sans-serif;color:#282828; font-size:15px; line-height:120%; font-weight:400; text-decoration:none;}
.texto15{font-family: 'Inter', sans-serif;color:#8b8b8b; font-size:15px; line-height:120%; font-weight:400; text-decoration:none;}
.texto16{font-family: 'Roboto Mono', monospace;color:#282828; font-size:12px;font-weight:400; text-decoration:none; text-transform:uppercase;}
.texto17{font-family: 'Inter', sans-serif;color:#ffffff; font-size:70px;font-weight:400; text-decoration:none; }
.texto18{font-family: 'Inter', sans-serif;color:#f14f4f; font-size:70px;font-weight:400; text-decoration:none; }
.texto16a{font-family: 'Roboto Mono', monospace;color:#282828; font-size:10px;font-weight:500; text-decoration:none; text-transform:uppercase;}

.sese{font-family: 'Inter', sans-serif;color:#282828; font-size:18px; line-height:150%; font-weight:400; text-decoration:none;}

h1,h2,h3,h4,h5,h6{ display:inline !important;}

#arriba, #arriba1,#arriba2,#arriba3{display:inline-block;vertical-align:top;}
#arriba{ width:96%;  vertical-align:middle; text-align:center; left:2%; top:20px; position:absolute; z-index:9999;}
#arriba1{width:20%;margin-left:-4px; text-align:left;  }
#arriba2{width:55%;margin-left:-4px;text-align:center; margin-top:30px;   }
#arriba3{width:25%;margin-left:-4px;text-align:right; margin-top:30px;   }

#movil,#todomovil{ display:none;}

#grande{ width:1300px; height:800px; left:50%; margin-left:-650px; position:relative;}
#grande1{ width:1200px; top:75px; position:absolute; left:50px;}
#grande2{ width:1300px; left:0; top:145px; position:absolute;}
#grande3{ width:1200px; bottom:70px; position:absolute; left:50px; height:50px; text-align:center;border-top: 0px solid red;
  border-right: 0px solid red;
  border-bottom: 1px solid #858386;
  border-left: 0px solid red}



#larriba, #larriba1,#larriba2{display:inline-block;vertical-align:top;}
#larriba{ width:100%; max-width:1300px; vertical-align:middle; text-align:center; }
#larriba1{width:30%;margin-left:-4px; text-align:left;  }
#larriba2{width:70%;margin-left:-4px;text-align:right; }


#contacta, #contacta1, #contacta2, #contacta3, #contacta4, #contacta5{display:inline-block;vertical-align:top;}
#contacta{ width:100%;vertical-align:middle;; }
#contacta1{width:19%; margin-left:-5px; text-align:left; }
#contacta2{width:18%; margin-left:-5px; text-align:left; }
#contacta3{width:18%; margin-left:-5px; text-align:left; }
#contacta4{width:30%; margin-left:-5px; text-align:left; }
#contacta5{width:15%; margin-left:-5px; text-align:right; }


#menudencia{top:60px;left:4%;width:126px;z-index:9999;position:absolute;}

#menudenciainicia{display:block;top:70px;right:4%;width:500px;height:40px;z-index:4;position:absolute;}

.portafolios1{font-family: 'Roboto Mono', monospace;color:#ffffff;font-size:25px;line-height:160%;text-transform:uppercase;}
.portafolios2{font-family: 'Roboto Mono', monospace;color:#ffffff;font-size:20px;line-height:160%;text-transform: capitalize;}
.portafolios3{font-family: 'Roboto Mono', monospace;color:#ffffff;font-size:16px;line-height:160%;}

#elfeik{width:100%;height:150px;}

.texto9a{font-family: 'Roboto Mono', monospace;color:#ffffff;font-size:16px;line-height:130%;text-decoration:none;cursor:pointer;-webkit-transition:all .3s ease;-moz-transition:all .3s ease;transition:all .3s ease;}

.limapor{width:100%;max-width:1200px;text-align:left;}


#elportafolio{width:90%;max-width:1200px;text-align:left;}


#laweb{background-color:#bfc7d1;height:700px;width:100%;max-width:1200px;}
#laweb2{background-color:#bfc7d1;height:700px;width:100%;max-width:1200px;}
#lacompu{background-image:url(../imagenes/web.png);width:760px;height:648px;}


#video0{position:absolute;width:700px;height:395px;left:50%;margin-left:-350px;top:30px;z-index:3;}
#video1{position:absolute;width:700px;height:395px;left:50%;margin-left:-350px;top:30px;z-index:2;}
#video2{position:absolute;width:307px;height:567px;left:50%;margin-left:-153px;top:30px;z-index:3;}
#video3{position:absolute;width:307px;height:567px;left:50%;margin-left:-153px;top:30px;z-index:2;}
#lawebcompleta,.lawebcompleta,.limita{height:675px;width:1200px;}
.elgif{display:none;}
#videocompleto{position:absolute;height:675px;width:1200px;left:0;top:0;z-index:3;}
.limagif{width:100%;}


.uno{ opacity:1;transition:all .6s;-moz-transition:all .6s;-webkit-transition:all .6s;-o-transition:all .6s;}
.uno:hover{opacity:.6;transition:all .6s;-moz-transition:all .6s;-webkit-transition:all .6s;-o-transition:all .6s;}


#portafolio{width:100%;text-align:center; }

#menudos{ display:none;background-color:#232323;transition:all 1s;-moz-transition:all 1s;-webkit-transition:all 1s;-o-transition:all 1s;  } 
#menudos.xs{ display:inline-block; width:100%;  text-align:center; left:0; position:fixed; top:0; z-index:999;background-color:#232323; height:90px;}
#menudos.xl{ display:none;}

#larri, #larri1,#larri2,#larri3{display:inline-block;vertical-align:top;}
#larri{ width:96%; vertical-align:middle; text-align:center; }
#larri1{width:20%;margin-left:-4px; text-align:left;}
#larri2{width:55%;margin-left:-4px;text-align:center; margin-top:20px;  }
#larri3{width:25%;margin-left:-4px;text-align:right; margin-top:20px;  }


#elporta, #elporta1,#elporta2,#elporta3{display:inline-block;vertical-align:top;}
#elporta{ width:96%; vertical-align:middle; text-align:center; }
#elporta1{width:32%; height:425px;margin-left:-4px; text-align:left;  overflow:hidden;  }
#elporta2{width:2%;margin-left:-4px;text-align:right; }
#elporta3{width:2%;margin-left:-4px;text-align:right; }

#por, #por1,#por2{display:inline-block;vertical-align:top;}
#por{ width:100%; vertical-align:middle; text-align:center; }
#por1{width:100%; height:380px;margin-left:0px; text-align:left;  overflow:hidden;  }
#por2{width:100%; height:45px;text-align:left; }

.des1{font-family: 'Roboto Mono', monospace;color:#282828; line-height:40px; font-size:13px; font-weight:400; text-decoration:none;}
.des2{font-family: 'Roboto Mono', monospace;color:#6d6d6d; line-height:40px;  font-size:13px; font-weight:400; text-decoration:none;}

.elenlace, .smooth{font-family: 'Roboto Mono', monospace;color:#858386; font-size:15px; line-height:26px; font-weight:400; text-decoration:none;transition:all .6s;-moz-transition:all .6s;-webkit-transition:all .6s;-o-transition:all .6s; padding-top:5px; padding-bottom:6px; padding-left:20px; padding-right:20px;border-radius: 34px 34px 34px 34px;
-moz-border-radius: 34px 34px 34px 34px;
-webkit-border-radius: 34px 34px 34px 34px; background-color: transparent;}

.elenlace:hover, .smooth:hover{border-radius: 34px 34px 34px 34px;
-moz-border-radius: 34px 34px 34px 34px;
-webkit-border-radius: 34px 34px 34px 34px; background-color:#f14f4f;color:#232323;
text-decoration:none;transition:all .6s;-moz-transition:all .6s;-webkit-transition:all .6s;-o-transition:all .6s;}

#elvideo{ text-align:left; width:100%; height:700px;background:url(../imagenes/home.jpg) no-repeat center center; -webkit-background-size: cover; -moz-background-size: cover;  -o-background-size: cover;	}  


#losico{ text-align:center;
  display: flex;
  flex-wrap: wrap;align-items: center;
  justify-content: center;
}

.losi{ margin-right:30px; margin-bottom:20px;}
#conectanos{ width:100%; background-color:#e7e7e7; text-align:center; display: inline-block;}
#conectanosinfo{ display:inline-block; width:90%; max-width:1400px; text-align:left;}
#separador{ width:100%; height:60px;}

#tenemos{ background-color:#e7e7e7; width:100%; text-align:center;}

#servicios{ background-color:#e7e7e7; width:100%; text-align:center;}
#loservi2{ display:none;}


#cintillo{ background-color:#f14f4f; width:100%; text-align:center;}


#abajo{ background-color:#282828; text-align:center;}

#laba, #laba1,#laba2,#laba3,#laba4,#laba5,#laba6,#laba7{display:inline-block;vertical-align:top;}
#laba{ width:100%; vertical-align:middle; text-align:center;}
#laba1{width:100%;margin-left:0px; text-align:left;  }
#laba2{width:50%;margin-left:-4px;text-align:left;  }
#laba3{width:50%;margin-left:-4px;text-align:right;  }
#laba4{width:100%; height: 1px; background-color: #e7e7e7; margin-left:0px; text-align:left;  }
#laba5{width:20%; margin-left:-4px; text-align:left;  }
#laba6{width:25%; margin-left:-4px; text-align:center;  }
#laba7{width:55%; margin-left:-4px; text-align:right;  }


#contacto{text-align:center;}


#contactame, #contactame1, #contactame2, #contactame3, #contactame4, #contactame5{display:inline-block;vertical-align:top;}
#contactame{ width:1350px;vertical-align:middle; text-align:center;}
#contactame1{width:100%; margin-left:0px; text-align:left; }
#contactame2{width:450px; margin-left:-4px; text-align:left; }
#contactame3{width:100%; margin-left:0px; text-align:left; }
#contactame4{width:100%; margin-left:0px; text-align:left; }
#contactame5{width:35%; margin-left:-4px; text-align:center; }


::placeholder{color:#282828;}

.forma{text-align:left;HEIGHT:40px;width:400px;border:1; border:0; font-size:14PX;font-weight:400; background-color:#ffffff;  font-family: 'Inter', sans-serif; color:#282828;border: 0px; padding-left:20px;border-radius: 31px 31px 31px 31px;
-webkit-border-radius: 31px 31px 31px 31px;
-moz-border-radius: 31px 31px 31px 31px; margin-top:7px;
}

.forma2{text-align:left;HEIGHT:40px;width:420px;border:1; border:0; font-size:14PX;font-weight:400; background-color:#ffffff;  font-family: 'Inter', sans-serif; color:#282828;border: 0px;border-radius: 31px 31px 31px 31px;
-webkit-border-radius: 31px 31px 31px 31px;
-moz-border-radius: 31px 31px 31px 31px; margin-top:7px;
}

.boton1{ padding-left:20px;border:0px; cursor:pointer;color:#282828;font-size:14px;font-family: 'Inter', sans-serif;width:400px;height:40px; background-color:#f14f4f; font-weight:400; border-radius: 31px 31px 31px 31px;
-webkit-border-radius: 31px 31px 31px 31px;
-moz-border-radius: 31px 31px 31px 31px;transition:all .6s;-moz-transition:all .6s;-webkit-transition:all .6s;-o-transition:all .6s;}
.boton1:hover{background-color:#ffffff;transition:all .6s;-moz-transition:all .6s;-webkit-transition:all .6s;-o-transition:all .6s; }

.elcheck{font-family: 'Inter', sans-serif;color:#282828; font-size:11px; line-height:30px; font-weight:400; text-decoration:none;}

.mycheck {
    cursor: pointer;
    background-color: #bdbdbd;
    width: 15px;
    height: 15px;
    appearance: none;
    border:0;
    border-radius: 31px 31px 31px 31px;
-webkit-border-radius: 31px 31px 31px 31px;
-moz-border-radius: 31px 31px 31px 31px;
}

.mycheck:hover { background-color: rgba(241,79,79,.7)}

.mycheck:checked {
  background-color:#f14f4f;background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z'/%3e%3c/svg%3e");
}

#servis, #servis1{display:inline-block;vertical-align:top;}
#servis{ width: 100%; max-width:1350px;vertical-align:middle; text-align:center;}
#servis1{width:33.3%; margin-left:-4px; text-align:left; }

#elvideohome {
    position: absolute; z-index:1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

#carrusel{
	background:url("../imagenes/logos.svg")center repeat-x;
	animation:200s para reverse infinite linear;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	height: 99px;
	width: 100% ;
	text-align: center;
}

@keyframes para {
	100% {
		background-position: 
		7680px;
	}
}


#menumovil{ display:none;}

.infomovil{ display: inline-block; width: 90%; text-align: left;}

.peces{ display: inline-block;}

.redes{filter: grayscale(1);brightness(100%); opacity:1;transition:all .6s;-moz-transition:all .6s;-webkit-transition:all .6s;-o-transition:all .6s; cursor:pointer;}
.redes:hover{ filter: grayscale(0);}


@media screen and (max-width:1600px)
 {
#elporta1{height:345px;}
#por1{    height:300px;}
 }
 
@media screen and (max-width:1370px)
 {
#contactame{ width:1200px;vertical-align:middle; text-align:center;}
#contactame1{width:100%; margin-left:0px; text-align:left; }
#contactame2{width:400px; margin-left:-4px; text-align:left; }
#contactame3{width:100%; margin-left:0px; text-align:left; }
#contactame5{width:400px; margin-left:-4px; text-align:left; }

.forma{width:330px;padding-left:20px;}
.forma2{width:350px;}
.boton1{ padding-left:20px;width:350px;}	 
 }
 
@media screen and (max-width:1320px)
 {
#elporta1{height:285px;}
#por1{    height:240px;}

 #grande{ display:none;}
 }
 
  @media screen and (max-width:1220px){
  #contactame{ width:999px;vertical-align:middle; text-align:center;}
#contactame1{width:100%; margin-left:0px; text-align:left; }
#contactame2{width:333px; margin-left:-4px; text-align:left; }
#contactame3{width:100%; margin-left:0px; text-align:left; }
#contactame5{width:333px; margin-left:-4px; text-align:left; }

.forma{width:290px;padding-left:20px;}
.forma2{width:310px;}
.boton1{ padding-left:20px;width:320px;}	
  }
 
 @media screen and (max-width:1200px){#infoporta{width:90%;vertical-align:middle;}
.texto8{font-size:70px;}

#elporta1{height:245px;}
#por1{    height:200px;}

#lawebcompleta,.lawebcompleta,.limita{height:506px;width:900px;}
#videocompleto{position:absolute;height:506px;width:900px;left:0;top:0;z-index:3;}
}

@media screen and (max-width:1050px)
 {  
#servis{ width: 100%; max-width:1350px;vertical-align:middle; text-align:left;}
#servis1{width:50%; margin-left:-4px; text-align:left; }
     
     
#loservi{ display:none;}
 #loservi2, #loservi2a{display:inline-block;vertical-align:top;}
#loservi2{ width:100%; vertical-align:middle; text-align:left; }
#loservi2a{width:50%;margin-left:-4px; text-align:left;}
 }
 
 @media screen and (max-width:1020px){
.texto17{font-size:60px;}
.texto18{font-size:60px;}
     
#contactame{ width:800px;vertical-align:middle; text-align:center;}
#contactame1{width:100%; margin-left:0px; text-align:left; }
#contactame2{width:400px; margin-left:-4px; text-align:left; }
#contactame3{width:100%; margin-left:0px; text-align:left; }
#contactame4{width:100%; margin-left:0px; text-align:center; }
#contactame5{width:100%; margin-left:0px; text-align:center; }

.forma{width:330px;padding-left:20px;}
.forma2{width:350px;}
.boton1{ padding-left:20px;width:350px;}	
  }

 @media screen and (max-width:990px)
 {
 #laba5{width:50%; margin-left:-4px; text-align:left;  }
#laba6{width:50%; margin-left:-4px; text-align:right;  }
#laba7{width:100%; margin-left:0px; text-align:center; margin-top:10px;  }    
}


@media screen and (max-width:960px)
 {
#larri1{width:100%;margin-left:0px; text-align:left;}
#larri2,#larri3{ display: none;}
     
#laba1{width:100%;margin-left:0px; text-align:center;  }
#laba2{width:100%;margin-left:0px;text-align:center;  }
#laba3{width:100%;margin-left:0px;text-align:center;  }
.texto11{font-size:40px;}
#conectanosinfo{ text-align:center;}

.texto5{font-size:50px;}
.texto5a{font-size:40px;}
.texto6{font-size:50px;}
.texto8{font-size:50px;}

#elporta{ width:96%; vertical-align:middle; text-align:left; }
#elporta1{width:50%; height:305px;margin-left:-4px; text-align:center;  overflow:hidden;  }
#elporta2{display:none;}
#elporta3{display:none;}

#por{ width:96%; vertical-align:middle; text-align:center; }
#por1{width:100%; height:260px;margin-left:0px; text-align:left;  overflow:hidden;  }


#laweb{background-color:#bfc7d1;height:400px;width:100%;max-width:1200px;}
#lacompu{background-image:url(../imagenes/weba.png);width:400px;height:341px;}

#video1, #video0{position:absolute;width:370px;height:210px;left:50%;margin-left:-185px;top:15px;}


#lawebcompleta,.lawebcompleta,.limita{height:394px;width:700px;}
#videocompleto{position:absolute;height:394px;width:700px;left:0;top:0;z-index:3;}

#lap,#conectanos,#tenemos,#servicios{ display:none;}#movil,#todomovil{ display:block; text-align: center;}
#separador{ width:100%; height:60px;}
     
.movil1{font-family: 'Inter', sans-serif;color:#282828; font-size:40px; line-height:120%; font-weight:900; text-decoration:none;}
.movil2{font-family: 'Inter', sans-serif;color:#f14f4f; font-size:40px; line-height:120%; font-weight:900; text-decoration:none;}     
.movil3{font-family: 'Inter', sans-serif;color:#ffffff; font-size:40px; line-height:120%; font-weight:900; text-decoration:none;}
.movil4{font-family: 'Inter', sans-serif;color:#ffffff; font-size:20px; line-height:150%; font-weight:500; text-decoration:none;}
     
.limamo{ width: 100%; max-width: 1028px;}

.fondonegro{ background-color: #282828; display:block; text-align: center;}     
     
	}
 
  @media screen and (max-width:820px){
.texto17{font-size:50px;}
.texto18{font-size:50px;}
      
#contactame{ width:90%;vertical-align:middle; text-align:center;}
#contactame1{width:100%; margin-left:0px; text-align:center; }
#contactame2{width:100%; margin-left:0px; text-align:center; }
#contactame3{width:100%; margin-left:0px; text-align:center; }
#contactame4{width:100%; margin-left:0px; text-align:center; }
#contactame5{width:100%; margin-left:0px; text-align:center; }

.forma{width:400px;padding-left:0px; text-align:center;}
.forma2{width:400px; text-align:center;}
.boton1{ padding-left:0px;width:400px;}	
  }
 
@media screen and (max-width:810px){ 
.elenlace, .smooth{font-size:14px;padding-top:5px; padding-bottom:6px; padding-left:10px; padding-right:10px;}
 
#servis{ width:350px;vertical-align:middle; text-align:center;}
#servis1{width:100%; margin-left:0px; text-align:left; }
    
#loservi2{ width:100%; vertical-align:middle; text-align:left; }
#loservi2a{width:100%;margin-left:0px; text-align:center;} 
  
#elporta{ width:96%; vertical-align:middle; text-align:left; }
#elporta1{width:50%; height:245px;margin-left:-4px; text-align:center;  overflow:hidden;  }

#por{ width:96%; vertical-align:middle; text-align:center; }
#por1{width:100%; height:200px;margin-left:0px; text-align:left;  overflow:hidden;  }
}

 
 @media screen and (max-width:710px){
.texto5{font-size:40px;}
.texto5a{font-size:30px;}
.texto6{font-size:40px;}
.texto8{font-size:40px;}

     
#video1, #video0{display:none;}
#lawebcompleta,.limita{height:338px;width:600px;}
.lawebcompleta{display:none;}
.elgif{display:block;}
#video1, #video0{display:none;}
#videocompleto{position:absolute;height:338px;width:600px;left:0;top:0;z-index:3;}

 }
 
@media screen and (max-width:650px){ 
  
#elporta{ width:96%; vertical-align:middle; text-align:left; }
#elporta1{width:100%; height:320px;margin-left:0px; text-align:center;  overflow:hidden;  }

#por{ width:96%; vertical-align:middle; text-align:center; }
#por1{width:100%; height:275px;margin-left:0px; text-align:left;  overflow:hidden;  }
}

@media screen and (max-width:620px){	
.texto5{font-size:35px; color: #f14f4f; line-height: 120%; font-weight: 900;}
.movil1,.movil2,.movil3{font-size:35px;}    
    
.texto17{font-size:40px;}
.texto18{font-size:40px;}

#lawebcompleta,.limita{height:253px;width:450px;}
#videocompleto{position:absolute;height:253px;width:450px;left:0;top:0;z-index:3;}
}
 
.ball{-moz-animation:spin 1.5s infinite linear;-webkit-animation:spin 1.5s infinite linear;-0-animation:spin 1.5s infinite linear;animation:spin 1.5s infinite linear;}
@-moz-keyframes spin{0%{opacity:01;}
100%{opacity:1;-moz-transform:translateY(6px);}
}
@-webkit-keyframes spin{0%{opacity:1;}
100%{opacity:1;-webkit-transform:translateY(6px);}
}
@-o-keyframes spin{0%{opacity:1;}
100%{opacity:1;-0-transform:translateY(6px);}
}
@-moz-keyframes spin{0%{opacity:01;}
100%{opacity:1;-moz-transform:translateY(6px);}
}


.ball2{-moz-animation:spin2 1.5s infinite linear;-webkit-animation:spin2 1.5s infinite linear;-0-animation:spin2 1.5s infinite linear;animation:spin2 1.5s infinite linear;}
@-moz-keyframes spin2{0%{opacity:01;}
100%{opacity:1;-moz-transform:translateX(6px);}
}
@-webkit-keyframes spin2{0%{opacity:1;}
100%{opacity:1;-webkit-transform:translateX(6px);}
}
@-o-keyframes spin2{0%{opacity:1;}
100%{opacity:1;-0-transform:translateX(6px);}
}
@-moz-keyframes spin2{0%{opacity:01;}
100%{opacity:1;-moz-transform:translateX(6px);}
}




.mini1{
  width: 100%;
  height:100%;
  background: url(../miniaturas/01.jpg) no-repeat center center ; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover; cursor:pointer;  
  -webkit-transform:scale(1);
    -ms-transform:scale(1);
    transform:scale(1);transition:all 1s;-moz-transition:all 1s;-webkit-transition:all 1s;-o-transition:all 1s;
}
.mini1:hover{
  background: url(../miniaturas/01a.jpg) no-repeat center center ; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;-webkit-transform:scale(1.1);transition:all 1s;-moz-transition:all 1s;-webkit-transition:all 1s;-o-transition:all 1s;
    -ms-transform:scale(1.1);
    transform:scale(1.1);
}



.mini2{
  width: 100%;
  height:100%;
  background: url(../miniaturas/02.jpg) no-repeat center center ; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover; cursor:pointer;  
  -webkit-transform:scale(1);
    -ms-transform:scale(1);
    transform:scale(1);transition:all 1s;-moz-transition:all 1s;-webkit-transition:all 1s;-o-transition:all 1s;
}
.mini2:hover{
  background: url(../miniaturas/02a.jpg) no-repeat center center ; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;-webkit-transform:scale(1.1);transition:all 1s;-moz-transition:all 1s;-webkit-transition:all 1s;-o-transition:all 1s;
    -ms-transform:scale(1.1);
    transform:scale(1.1);
}


.mini3{
  width: 100%;
  height:100%;
  background: url(../miniaturas/03.jpg) no-repeat center center ; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover; cursor:pointer;  
  -webkit-transform:scale(1);
    -ms-transform:scale(1);
    transform:scale(1);transition:all 1s;-moz-transition:all 1s;-webkit-transition:all 1s;-o-transition:all 1s;
}
.mini3:hover{
  background: url(../miniaturas/03a.jpg) no-repeat center center ; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;-webkit-transform:scale(1.1);transition:all 1s;-moz-transition:all 1s;-webkit-transition:all 1s;-o-transition:all 1s;
    -ms-transform:scale(1.1);
    transform:scale(1.1);
}


.mini4{
  width: 100%;
  height:100%;
  background: url(../miniaturas/04.jpg) no-repeat center center ; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover; cursor:pointer;  
  -webkit-transform:scale(1);
    -ms-transform:scale(1);
    transform:scale(1);transition:all 1s;-moz-transition:all 1s;-webkit-transition:all 1s;-o-transition:all 1s;
}
.mini4:hover{
   background: url(../miniaturas/04a.jpg) no-repeat center center ; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;-webkit-transform:scale(1.1);transition:all 1s;-moz-transition:all 1s;-webkit-transition:all 1s;-o-transition:all 1s;
    -ms-transform:scale(1.1);
    transform:scale(1.1);
}



.mini5{
  width: 100%;
  height:100%;
  background: url(../miniaturas/05.jpg) no-repeat center center ; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover; cursor:pointer;  
  -webkit-transform:scale(1);
    -ms-transform:scale(1);
    transform:scale(1);transition:all 1s;-moz-transition:all 1s;-webkit-transition:all 1s;-o-transition:all 1s;
}
.mini5:hover{
   background: url(../miniaturas/05a.jpg) no-repeat center center ; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;-webkit-transform:scale(1.1);transition:all 1s;-moz-transition:all 1s;-webkit-transition:all 1s;-o-transition:all 1s;
    -ms-transform:scale(1.1);
    transform:scale(1.1);
}



.mini6{
  width: 100%;
  height:100%;
  background: url(../miniaturas/06.jpg) no-repeat center center ; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover; cursor:pointer;  
  -webkit-transform:scale(1);
    -ms-transform:scale(1);
    transform:scale(1);transition:all 1s;-moz-transition:all 1s;-webkit-transition:all 1s;-o-transition:all 1s;
}
.mini6:hover{
  background: url(../miniaturas/06a.jpg) no-repeat center center ; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;-webkit-transform:scale(1.1);transition:all 1s;-moz-transition:all 1s;-webkit-transition:all 1s;-o-transition:all 1s;
    -ms-transform:scale(1.1);
    transform:scale(1.1);
}



.mini7{
  width: 100%;
  height:100%;
  background: url(../miniaturas/07.jpg) no-repeat center center ; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover; cursor:pointer;  
  -webkit-transform:scale(1);
    -ms-transform:scale(1);
    transform:scale(1);transition:all 1s;-moz-transition:all 1s;-webkit-transition:all 1s;-o-transition:all 1s;
}
.mini7:hover{
  background: url(../miniaturas/07a.jpg) no-repeat center center ; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;-webkit-transform:scale(1.1);transition:all 1s;-moz-transition:all 1s;-webkit-transition:all 1s;-o-transition:all 1s;
    -ms-transform:scale(1.1);
    transform:scale(1.1);
}




.mini8{
  width: 100%;
  height:100%;
  background: url(../miniaturas/08.jpg) no-repeat center center ; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover; cursor:pointer;  
  -webkit-transform:scale(1);
    -ms-transform:scale(1);
    transform:scale(1);transition:all 1s;-moz-transition:all 1s;-webkit-transition:all 1s;-o-transition:all 1s;
}
.mini8:hover{
  background: url(../miniaturas/08a.jpg) no-repeat center center ; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;-webkit-transform:scale(1.1);transition:all 1s;-moz-transition:all 1s;-webkit-transition:all 1s;-o-transition:all 1s;
    -ms-transform:scale(1.1);
    transform:scale(1.1);
}



.mini9{
  width: 100%;
  height:100%;
  background: url(../miniaturas/09.jpg) no-repeat center center ; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover; cursor:pointer;  
  -webkit-transform:scale(1);
    -ms-transform:scale(1);
    transform:scale(1);transition:all 1s;-moz-transition:all 1s;-webkit-transition:all 1s;-o-transition:all 1s;
}
.mini9:hover{
  background: url(../miniaturas/09a.jpg) no-repeat center center ; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;-webkit-transform:scale(1.1);transition:all 1s;-moz-transition:all 1s;-webkit-transition:all 1s;-o-transition:all 1s;
    -ms-transform:scale(1.1);
    transform:scale(1.1);
}


.mini10{
  width: 100%;
  height:100%;
  background: url(../miniaturas/10.jpg) no-repeat center center ; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover; cursor:pointer;  
  -webkit-transform:scale(1);
    -ms-transform:scale(1);
    transform:scale(1);transition:all 1s;-moz-transition:all 1s;-webkit-transition:all 1s;-o-transition:all 1s;
}
.mini10:hover{
  background: url(../miniaturas/10a.jpg) no-repeat center center ; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;-webkit-transform:scale(1.1);transition:all 1s;-moz-transition:all 1s;-webkit-transition:all 1s;-o-transition:all 1s;
    -ms-transform:scale(1.1);
    transform:scale(1.1);
}


.mini11{
  width: 100%;
  height:100%;
  background: url(../miniaturas/11.jpg) no-repeat center center ; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover; cursor:pointer;  
  -webkit-transform:scale(1);
    -ms-transform:scale(1);
    transform:scale(1);transition:all 1s;-moz-transition:all 1s;-webkit-transition:all 1s;-o-transition:all 1s;
}
.mini11:hover{
  background: url(../miniaturas/11a.jpg) no-repeat center center ; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;-webkit-transform:scale(1.1);transition:all 1s;-moz-transition:all 1s;-webkit-transition:all 1s;-o-transition:all 1s;
    -ms-transform:scale(1.1);
    transform:scale(1.1);
}


.mini12{
  width: 100%;
  height:100%;
  background: url(../miniaturas/12.jpg) no-repeat center center ; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover; cursor:pointer;  
  -webkit-transform:scale(1);
    -ms-transform:scale(1);
    transform:scale(1);transition:all 1s;-moz-transition:all 1s;-webkit-transition:all 1s;-o-transition:all 1s;
}
.mini12:hover{
  background: url(../miniaturas/12a.jpg) no-repeat center center ; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;-webkit-transform:scale(1.1);transition:all 1s;-moz-transition:all 1s;-webkit-transition:all 1s;-o-transition:all 1s;
    -ms-transform:scale(1.1);
    transform:scale(1.1);
}




.button_container {
  position: absolute;
  top: 0px;;
  right: 0px;
  height: 30px;
  width: 30px;
  cursor: pointer;
  background:url("../imagenes/menu.svg");
  z-index: 10;
  -webkit-transition: opacity .25s ease;
  -moz-transition: opacity .25s ease;
  transition: opacity .25s ease; opacity: 1;
}

.button_container:hover {
  opacity: .7;
}
.button_container.active {
  background:url("../imagenes/menu2.svg"); 
}

.overlay {
	background-color:rgba(0,0,0,.90);  position: fixed;
    top: 0;
  left: 0;
  width: 100%;
  height: 0%;
  opacity: 0;
  visibility: hidden;
  -webkit-transition: opacity .35s, visibility .35s, height .35s;
  -moz-transition: opacity .35s, visibility .35s, height .35s;
  transition: opacity .35s, visibility .35s, height .35s;
  overflow: hidden;
}
.overlay.open {
  opacity: 1;
  visibility: visible;
  height: 100%;
}
.overlay.open li {
  -webkit-animation: fadeInUp .8s ease forwards;
  -moz-animation: fadeInUp .8s ease forwards;
          animation: fadeInUp .8s ease forwards;
  -webkit-animation-delay: .35s;
  -moz-animation-delay: .35s;
          animation-delay: .35s;
}
.overlay.open li:nth-of-type(2) {
  -webkit-animation-delay: .45s;
  -moz-animation-delay: .45s;
          animation-delay: .45s;
}
.overlay.open li:nth-of-type(3) {
  -webkit-animation-delay: .55s;
  -moz-animation-delay: .55s;
          animation-delay: .55s;
}
.overlay.open li:nth-of-type(4) {
  -webkit-animation-delay: .65s;
  -moz-animation-delay: .65s;
          animation-delay: .65s;
}
.overlay.open li:nth-of-type(5) {
  -webkit-animation-delay: .75s;
  -moz-animation-delay: .75s;
          animation-delay: .75s;
}
.overlay nav {
  position: relative;
  top: 50%; left:5%;
  -webkit-transform: translateY(-35%);
  -moz-transform: translateY(-35%);
          transform: translateY(-35%);
  
  font-weight: 700;
  text-align: center;
  margin-right:52px;
}
.overlay ul {
  list-style: none;
  padding: 0;
  margin: 0 auto;
  display: inline-block;
  position: relative;
  height: 100%; width:100%;
}
.overlay ul li {
  display: inline-block;
  position: relative;
  opacity: 0;
  min-width:18%; text-align:center;
}
.overlay ul li a {
  display: inline-block;
  position: relative;
  color: #ffffff;
  text-decoration: none;
  overflow: hidden;
  font-size: 36px;
  opacity:1; text-transform:uppercase;font-family: 'Inter', sans-serif; font-weight: 500;
}
.overlay ul li a:hover,a:after, .overlay ul li a:focus:after, .overlay ul li a:active:after {
  width: 100%;
  opacity:1;-webkit-transition: .25s;
  transition: .25s;opacity:.8;color:#6E6E6E;
}



@media screen and (max-width:960px){
#menumovil{ z-index:9999;position: absolute;top:28px;
  right: 30px;
  height: 69px;
  width: 69px; display:block;}

.overlay nav {
  top: 40%;
}

.overlay ul li {
  display: inline-block;
  min-height: 70px;
  position: relative;
  opacity: 0;
  min-width:100%; text-align:center;
}

}