@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Roboto:wght@400;500;700&display=swap');
:root{--yellow:#F9DD12;--green:#3EB74E;--gray:#a9a8ab;}
body{margin:0px;padding:0px;font-family:sans-serif;font-family: 'Roboto', sans-serif;}
p,li,h1,h2,h3,h4,h5,h6,section,aside,div{box-sizing:border-box;margin:0px;vertical-align:middle;line-height:1.2em;letter-spacing:1.5px;}
h1{font-family: 'Bebas Neue', cursive;font-weight:400;}
h2{font-size:20px;font-weight:400;}
h3{font-family: 'Bebas Neue', cursive;font-weight:400;font-size:45px;}
h4{font-family: 'Bebas Neue', cursive;font-weight:400;font-size:22px;}
h5{font-family: 'Bebas Neue', cursive;font-weight:400;font-size:30px;}
h6{font-family: 'Bebas Neue', cursive;font-weight:400;font-size:16px;}
p{font-size:16px;}
a{color:inherit;text-decoration:none;box-sizing:border-box;}
img{vertical-align:middle;}
.container{display:flex;flex-direction:column;min-height:100vh;}
.container .content{flex-grow:1;}
.clearfix{overflow:auto;}
.clear{clear:both;}
.center{width:100%;max-width:1240px;box-sizing:border-box;padding:0px 20px;margin:0px auto;}
.center0{width:100%;max-width:1200px;margin:0px auto;}
.movil{display:none;}
.flex-content{display:flex;flex-wrap:wrap;align-content:center;}
.flex-item{display:flex;align-items:center;}
.flex{display:flex;flex-wrap:wrap;}
.contGlobal{overflow-x:hidden;max-width:100%;position:relative;}
.animation{position:relative;opacity:0;transition:.5s;will-change:scroll-position;}
.anibottom{top:400px;}
.anitop{top:-400px;}
.anileft{left:400px;}
.aniright{left:-400px}
.endanimation{left:0px;top:0px;opacity:1;will-change:unset;}


/*--HEAD--*/
.head{box-shadow: 2px 4px 5px 0px rgba(0, 0, 0, 0.65);-webkit-box-shadow: 2px 4px 5px 0px rgba(0, 0, 0, 0.65);-moz-box-shadow: 2px 4px 5px 0px rgba(0, 0, 0, 0.65);position:relative;}
.head .center0{display:flex;}
.head .center0 .logo{}
.head .center0 .menu{flex:1;text-align:right}
.menu div{margin-bottom:10px;}
.menu h6{display:inline-block;margin-left:20px; color:#064468;}
.menu h4{background-color:#064468;display:table;margin-left:auto;padding:5px 10px;color:#fff;font-size:16px;}

/*--INICIO--*/
#bg1{background:url(../IMG/banner-1.jpg) no-repeat;background-size:cover;}
#bg2{background:url(../IMG/banner-2.jpg) no-repeat;background-size:cover;}
#bg3{background:url(../IMG/banner-3.jpg) no-repeat;background-size:cover;}
#bg4{background:url(../IMG/banner-4.jpg) no-repeat;background-size:cover;}
.bgin{padding:0px 0px;}
.bgin .center0{padding:0px 50px;border:solid #e74128 1px;border-right:none;display:flex;align-items:center;min-height:300px;color:#fff;margin:100px auto;}
.bgin h3{font-size:60px;}
.bgin h4{font-size:30px;}
.proyecto{color:#fff;padding:100px 0px 200px;text-align:center;background:linear-gradient(9deg, rgba(10, 27, 89, 1) 0%, rgba(16, 175, 209, 1) 100%);}
.proyecto section{border:solid #fff 1px;padding:50px;display:flex;margin-top:100px;flex-wrap:wrap;}
.proyecto section div{width:22%;margin-right:4%;}
.proyecto section div:last-child{margin-right:0px;}
.proyecto section div img{max-width:100%;}
.proyecto h3{margin-bottom:20px;}
.proyecto h4{margin-top:30px;}
.soluciones{background:url(../IMG/banner-red2.jpg) no-repeat;background-size:cover;padding:100px 50px;}
.soluciones section{color:#000;background:#fff;}
.soluciones h4{color:#fff;font-size:40px;text-shadow: 3px 3px 3px rgba(0,0,0,0.6);}
.soluciones p{text-align:left;padding:0px 20px;}
.soluciones h3{line-height:1em;color:#e74128;text-align:left;}
.soluciones span{font-size:30px;color:#000;}

.servicio{background:url(../IMG/parrallax-servicios.jpg) no-repeat;background-size:cover;background-attachment:fixed;padding:50px 0px 150px;}
.servicio section{display:flex;padding:50px 80px 0px;}
.servicio h3{color:#fff;font-size:50px;}
.servicio h5{color: #fff;}
.tgglemenu{background:#064468;width:300px;padding-top:100px;}
.tggletxt{background:#fff;color:#064468;min-height:600px;flex:1;padding:50px;position:relative;}
.tggleline{position:absolute;right:20px;bottom:20px;}
.menutggle{width:100%;color:#FFFFFF;width:100%;padding:5px 40px;font-size:20px !important;cursor:pointer;}
.tggle{width:100%;box-sizing:border-box;display:none;}
.tggle h4{margin:30px 0px;}
.experiencia{background:linear-gradient(16deg, rgba(201,57,37,1) 0%, rgba(255,80,56,1) 100%);color:#fff;padding:200px 0px 100px;}
.experiencia .center{display:flex;flex-wrap:wrap;}
.experiencia .center div{width:330px;padding-right:30px;}
.experiencia .center div p{}
.experiencia .center section{flex:1;}
.experiencia .center section img{width:32%;margin-right:2%;transition:1s;}
.experiencia .center section img:last-child{margin-right:0%;transition:1.5s;}
.experiencia .center section img:first-child{transition:.5s;}
.experiencia .center aside{width:100%;height:2px;background:#fff;margin-top:200px;position:relative;}
.experiencia .center aside p{position:absolute;height:500px;width:2px;bottom:0px;background:#fff;}
.experiencia h3{font-size:50px;}
.experiencia h4{font-size:30px;}
.experiencia .logos{display:flex;padding-top:100px;}
.experiencia .logos div{width:25%;text-align:center;}
.nosotros{display:flex;align-items:flex-end;}
.nosotrosimg{width:50%;height:1200px;background:url(../IMG/nosotros-img.jpg) no-repeat center center;background-size:2000px;position:relative;}
.nosotrosimg h3{display:table;margin-left:auto;padding:15px 40px 10px;color:#fff;background:#064468;font-size:60px;margin-top:80px;transform:translateX(50%);}
.nosotrostxt{width:50%;max-width:620px;padding:0px 20px 0px 50px;}
.nosotrostxt section{display:flex;margin:100px 0px 150px;}
.nosotrostxt section div{width:47.5%;}
.nosotrostxt section div:last-child{margin-left:5%;}
.nosotrostxt aside{margin-bottom:50px;font-size:11px;}
.nosotrostxt aside span{display:inline-block;vertical-align:top;margin-right:20px;text-align:center;}
.nosotrostxt aside span img{display:block;margin:0px auto;}
.nosotrostxt h3{margin-bottom:20px;}
.contacto{padding:200px 0px 300px;background:linear-gradient(9deg, rgba(24,24,44,1) 0%, rgba(46,46,78,1) 100%);}
.contacto .center0{display:flex;color:#fff;}
.contacto .contimg{width:60%;padding:0px 50px;position:relative;}
.contacto .contimg img{width:100%;}
.contacto .contimg span{position:absolute;width:100%;height:450px;border:solid 1px #2905e1;margin-left:-50px;margin-top:50px;}
.contacto .center0 section{width:50%;padding-left:50px;padding-right:20px;}
.contacto p{margin-top:30px;}
.g-recaptcha{width:304px;display:block;margin-bottom:10px;}
.parallax{will-change:scroll-position;}
form{margin-top:40px;}
/* From uiverse.io by @alexruix */
.input-group {
 position: relative;
}

.input {
 border: solid 1.5px #9e9e9e;
 border-radius: 1rem;
 background: none;
 padding: 1rem;
 font-size: 1rem;
 color: #f5f5f5;
 transition: border 150ms cubic-bezier(0.4,0,0.2,1);
 width:100%;
 margin-bottom:30px;
 box-sizing:border-box;
}

.user-label {
 position: absolute;
 left: 15px;
 top:0;
 color: #e8e8e8;
 pointer-events: none;
 transform: translateY(1rem);
 transition: 150ms cubic-bezier(0.4,0,0.2,1);
}

.input:focus, input:valid {
 outline: none;
 border: 1.5px solid #2905e1;
}

.input:focus ~ label, input:valid ~ label {
 transform: translateY(-50%) scale(0.8);
 background-color: #212121;
 padding: 0 .2em;
 color: #2905e1;
}




@media screen and (max-width:750px){
.movil{display:inherit;}
.nonemovil{display:none;}
/*--HEAD--*/
.tophead{display:flex;align-items:center;}
.tophead .logo{flex:1;}
.head{position:relative;width:100%;padding:15px 20px;}
.head .center{background:#fff;border-radius:20px;padding:10px 20px;}
.hmb1{border-bottom:solid 5px #000;margin:0px auto 5px;text-align:center;width:50px;transition:1s;opacity:1;}
.hmb2{border-bottom:solid 5px #000;margin:0px auto 5px;text-align:center;width:50px;transition:1s; position:relative;}
.hmb3{border-bottom:solid 5px #000;margin:0px auto;text-align:center;width:50px;transition:1s; position:relative;}
.hmb{width:50px;height:25px;z-index:10;position:relative;cursor:pointer;display:table;margin:0px;margin-left:auto;}
.menumovil{display:none;}
.menumovil h6{font-size:30px;text-align:center;margin-top:30px;color:#000;}

/*--INICIO--*/
.bannermovil{position:relative;}
.bannermovil section{position:absolute;width:100%;height:100%;color:#fff;display:flex;align-items:center;text-align:center;}
.bannermovil section div{width:100%;}
.proyecto section{border:solid #fff 1px;padding:50px;display:flex;margin-top:100px;}
.proyecto section div{width:47.5%;margin-right:5%;}
.proyecto section div:last-child{margin-right:0px;}
.proyecto section div:nth-child(2n){margin-right:0px;}

#servicios2{background-image:url(../IMG/servicios-movil.jpg);}
.servicio{padding:50px 20px 150px;}
.servicio section{display:block;padding:50px 0px 0px;}
.servicio h3{color:#fff;font-size:50px;}
.servicio h5{color: #fff;}
.tggleline{position:absolute;right:20px;bottom:20px;}
.menutggle{background:rgba(10, 27, 89, 1);margin-top:15px;}
.tggle{width:100%;box-sizing:border-box;display:none;background:#fff;}
.tggle section{padding:30px;}
.tggle h4{margin:30px 0px;}
.experiencia{color:#fff;padding:80px 0px 100px;display:flex;align-items:center;}
.exbg{background:url(../IMG/experiencia-movil.jpg) no-repeat;width:100px;min-height:300px;}
.experiencia .center{display:block;}
.experiencia .center div{width:100%;padding-right:0px;}
.experiencia .center section{display:none;}
.experiencia .center aside{display:none;}

.nosotros{display:block;align-items:flex-end;}
.nosotrosimg{width:100%;height:auto;display:none;}
.nosotrostxt{width:100%;max-width:820px;padding:50px 20px;}
.nosotrostxt section{display:flex;margin:50px 0px 100px;}
.nosotrostxt section div{width:47.5%;}
.nosotrostxt section div:last-child{margin-left:5%;}
.nosotrostxt aside{text-align:center;}
.nosotrostxt aside span{display:inline-block;vertical-align:top;margin-left:0px;text-align:center;margin-right:20px;margin-bottom:30px;width:120px;}
.nosotrostxt h3{margin-bottom:20px;}


.contacto{padding:100px 0px;background:linear-gradient(9deg, rgba(24,24,44,1) 0%, rgba(46,46,78,1) 100%);}
.contacto .center0{display:block;color:#fff;}
.contacto .contimg{display:none;}
.contacto .center0 section{width:100%;padding-left:20px;padding-right:20px;}
.contacto p{margin-top:30px;}
.g-recaptcha{width:304px;display:block;margin-bottom:10px;}

}