@charset "UTF-8";
/* CSS Document */
*:focus {outline: none !important;}
input:focus{box-shadow: none;}
body {width: 100%; height: 100%; background:#fdfdff;letter-spacing:.3px;font-size:16px;position: relative; font-family:'Nunito', sans-serif; font-weight:400;}
html {width: 100%;height: 100%;}
img{ width:100%;}
*::selection{background:#f2943e; color:#fff;}
h1{font-size:40px; color:#002d64; font-weight:800; }
h2{font-size:31px; color:#002d64; font-weight:800;}
h3{ }
h4{ }
h5{}
a{}
a:hover, a:visited, a:active, a:focus{text-decoration: none;}
p{font-weight:300; font-size:18px; color:#7f7f7f;line-height:1.6;}

/*intro*/
#intro{background:#fff url(../img/header-tilo-foto.jpg) no-repeat top right; background-size:900px; min-height:700px;}
#intro h1{max-width:540px; margin-bottom:20px;}
#intro .info-intro p{max-width:470px;}
.info-intro{height:100vh; min-height:700px;}
.btn-flecha-down, .btn-flecha-down:visited, .btn-flecha-down:active{transition:all ease-in .2s;font-size:17px; letter-spacing:1px;-webkit-box-shadow: 0px 10px 49px 0px rgba(0,0,0,0.13);-moz-box-shadow: 0px 10px 49px 0px rgba(0,0,0,0.13);box-shadow: 0px 10px 49px 0px rgba(0,0,0,0.13);font-weight:700;color:#fff; background:#ffaf3a; padding:12px 60px 12px 25px ; border-radius: 40px; margin-top:15px;display:inline-block; position:relative;}
.btn-flecha-down:after{content:''; position:absolute; display:block; height:37px; width:37px; background:#fff url(../img/flecha-down-tilo.png) center no-repeat; background-size:24px; border-radius:50%; right:6px; top:6px;}
.btn-flecha-down:hover{color:#fff;background:#ed9c28;padding-right:75px;}
.conoce-mas{margin-left:10px;}

/*que hacemos*/
#que-hacemos{text-align:center;padding-top:30px;padding-bottom:90px;}
.logo-circular{width:131px;display:block; margin:auto;}
#que-hacemos h2{margin-top:20px;}
h2.ambas-figuras{ }
.forma1{width:51px; display:inline-block; margin-right:10px;}
.forma2{width:51px; display:inline-block; margin-left:10px;}
/*h2.ambas-figuras:before{content:''; position:absolute; left:0; top:12px;display:block; width:51px; height:17px; background:url(../img/forma-tilo-left.png) center no-repeat; background-size:cover;}
h2.ambas-figuras:after{content:''; position:absolute; right:0; top:12px;display:block; width:51px; height:17px; background:url(../img/forma-tilo-right.png) center no-repeat; background-size:cover;}*/
#que-hacemos p{max-width:650px; margin:20px auto 0;}
.btn-naranja, .btn-naranja:visited, .btn-naranja:active{transition:all ease-in .2s;font-size:17px; letter-spacing:1px;-webkit-box-shadow: 0px 10px 49px 0px rgba(0,0,0,0.13);-moz-box-shadow: 0px 10px 49px 0px rgba(0,0,0,0.13);box-shadow: 0px 10px 49px 0px rgba(0,0,0,0.13);font-weight:700;color:#fff; background:#ffaf3a; padding:12px 25px 12px 25px ; border-radius: 40px; margin-top:15px;display:inline-block; position:relative;}
.btn-naranja:hover{color:#fff;background:#008df3;}
.iconos1{position:absolute; left:-40px; bottom:200px; width:300px;}
.iconos2{position:absolute; right:-40px; bottom:170px; width:270px;}

/*ciberseguridad*/
#ciberseguridad{padding-top:80px; padding-bottom:60px; background:url(../img/fondo-tilo-1.png) no-repeat center bottom; background-size:cover;}
.ciberseguridad{max-width:550px;}
#ciberseguridad h2{margin-top:20px;margin-bottom:25px;}
.lista-tilo{columns: 2; margin:0;margin-top:30px; padding:0; color:#002d64; font-size:18px; font-weight:400; list-style: none;}
.lista-tilo li{margin-bottom:5px;padding-left:20px; position:relative;}
.lista-tilo li:before{width:5px; height:5px;background:#ffaf3a; border-radius:50%; position:absolute; content:''; display:block; top:11px; left:0;}
.ciberseguridad-info{padding-left:40px;}
.icono-amarillo{width:183px; position:absolute; right:-40px; bottom:-80px;}
.btn-ciber br{display:none;}

/*soluciones*/
#soluciones{padding-bottom:250px;padding-top:100px;background:#f4f6ff url(../img/fondo-tilo-2.png) no-repeat bottom center; background-size:cover; }
.btn-soluciones{margin-top:25px;}
.servicio{height:calc(100% - 40px);position:relative;-webkit-box-shadow: 0px 10px 24px 0px rgba(0,0,0,0.05);-moz-box-shadow: 0px 10px 24px 0px rgba(0,0,0,0.05);box-shadow: 0px 10px 24px 0px rgba(0,0,0,0.05);background:#fff; text-align:right; border-radius:20px; margin-top:40px; padding:40px 40px 40px 50px;}
.esquina{width:184px; position:absolute; top:0; left:0;}
h3{display:inline-block;min-height:70px;text-align:left;margin-bottom:40px;width:calc(100% - 108px); font-size:20px; color:#002d64; font-weight:700;}
p.chico{font-size:15px; text-align:left;}
.servicio ul.lista-tilo{text-align:left;font-size:15px;}
.texto-separado{-webkit-hyphens: auto;  -moz-hyphens: auto;  -ms-hyphens: auto;  hyphens: auto;}
.ilustracion{width:110%; position:absolute; left:-80px; top:-40px;}

/*contacto*/
#contacto{padding-bottom:40px;background:url(../img/fondo-footer.png) no-repeat center bottom; background-size:cover;}
.caja-contacto{background:#fff;max-width:840px; border-radius:20px; padding:60px 120px; margin:-50px auto 0;-webkit-box-shadow: 0px 10px 24px 0px rgba(0,0,0,0.05);-moz-box-shadow: 0px 10px 24px 0px rgba(0,0,0,0.05);box-shadow: 0px 10px 24px 0px rgba(0,0,0,0.05);}
.forma-contacto{width:90px;}
.titulo{text-align:center;}
h4{font-size:30px; font-weight:800; color:#ffaf3a;margin-top:20px;margin-bottom:50px;}
.form-control{font-size:18px;margin-top:10px; color:#002d64; font-weight:300; border:none; border-radius:0; border-bottom:1px solid #99abc1; padding-left:0;}
.form-control:focus{box-shadow:none; border-bottom-color:#ffaf3a;}
.form-control::placeholder{color:#002d64;}
textarea{height:100px; resize:none;}
#contacto .btn-naranja{   -webkit-appearance: none; -moz-appearance:none; border:none;appearance: none;margin-top:0;}
.enlaces-footer{text-align:center; margin-top:30px;color:#fff; font-size:17px;font-weight:300;}
.enlaces-footer a{color:#fff; border-bottom:1px solid rgba(255,255,255,0); transition:all ease-in .2s; display:inline-block;}
.enlaces-footer a:hover{color:#fff; border-bottom:1px solid rgba(255,255,255,1);}
.circulo{width:7px; height:7px; background:#fff; display:inline-block; margin:0 20px;border-radius:50%;}
.redes img{width:20px;}
.redes a{margin: 0 10px;}
.redes{text-align:center;margin-top:30px;}
.copy{text-align:Center; color:#fff; font-size:16px; margin-top:30px;}
.nomade{color:#1a3162 !important;font-size:13px;text-align:center}
.redes-flotante{background:#ffaf3a; -webkit-box-shadow: 0px 10px 24px 0px rgba(0,0,0,0.05);-moz-box-shadow: 0px 10px 24px 0px rgba(0,0,0,0.05);box-shadow: 0px 10px 24px 0px rgba(0,0,0,0.05); position:fixed; top:50%; right:10px; border-radius:50px; padding:10px 6px; margin-top:-55px; }
.redes-flotante img{width:29px;}
.redes-flotante a{display:block; margin:5px;}

/*menu*/
.navbar-brand img{width:135px; transition:all ease-in .2s;}
#menu-sitio .navbar-nav .nav-link{font-weight:400;color:#fff;font-size:14px;padding:0; padding-bottom:5px;transition:all ease-in .2s; position:relative;}
#menu-sitio .navbar-nav .nav-link:hover{transition:all ease-in .2s;color:#c9e6fb;}
#menu-sitio .navbar-nav .nav-link:before{content:''; display:block; position:absolute; left:0; bottom:0px; height:2px; width:0%;transition:all ease-in .2s; background:#ffaf3a;}
#menu-sitio .navbar-nav .nav-link:hover:before{width:100%;}
#menu-sitio{margin-top:20px;background:transparent;transition:all ease-in .5s;}
#menu-sitio .navbar-toggler-icon{background-image: url(../img/menu-azul.png);}
.navbar-toggler{border:none;}
#menu-sitio .navbar-toggler:focus{box-shadow:none;outline: none;}

#menu-sitio.scrolled-nav{-webkit-box-shadow: 0px 10px 24px 0px rgba(0,0,0,0.05);
-moz-box-shadow: 0px 10px 24px 0px rgba(0,0,0,0.05);
box-shadow: 0px 10px 24px 0px rgba(0,0,0,0.05);margin-top:0;background:#ffffff ;transition:all ease-in .2s;}
#menu-sitio.scrolled-nav .navbar-nav .nav-link{color:#002d64;}
#menu-sitio.scrolled-nav .navbar-nav .nav-link:hover{color:#002d64;}

/* Preloader CSS */
.loading {width: 100%;height: 100vh;position: fixed;background-color: #fff;z-index: 999999;overflow: visible; top:0;}
.loading img {position: absolute;top: 50%;left: 50%;margin: -80px 0 0 -80px;width: 160px;height: 160px;transition: all 0.3s ease;}
.loading.fade {animation-name: fade;animation-duration: 0.3s;animation-fill-mode: both;animation-iteration-count: 1;animation-delay: 0.3s;}


@media (max-width:1200px){
	/*intro*/
	#intro{background-position:160% 0; background-size:850px;}
	#intro h1{max-width:430px;}
	#intro .info-intro p{max-width:430px;}
	
	/*solucciones*/
	#soluciones{padding-bottom:150px;}
}


@media (max-width:991px){
	/*soluciones*/
	.ilustracion{width:100%; max-width:550px; position:relative; left:auto; top:auto; margin-top:-40px;}
	.servicio{height:auto;}
	
	/*que hacemos*/
	.iconos1{position:absolute; left:0px; bottom:auto; top:0; width:200px;}
.iconos2{position:absolute; right:0px; bottom:auto; top:0; width:170px;}
	#que-hacemos{padding-bottom:0;}
	
	/*ciberseguridad*/
	#ciberseguridad .btn-ciber{text-align:center;}
	.icono-amarillo{right:0; width:140px;}
	.ciberseguridad-info{padding-left:0;}
	
	
	/*intro*/
	#intro{background-position:140% 0; background-size:600px;}
	.info-intro{height:auto; padding-top:200px;}
	
	/*nav*/
.navbar-nav{display:inline-block;width:100%; text-align: center;}
	#menu-sitio .navbar-nav .nav-link{font-size:24px; padding:20px 0; color:#002d64;}
	#menu-sitio .navbar-nav .nav-link:hover{}
	#menu-sitio{-webkit-box-shadow: 0px 10px 24px 0px rgba(0,0,0,0.05);
-moz-box-shadow: 0px 10px 24px 0px rgba(0,0,0,0.05);
box-shadow: 0px 10px 24px 0px rgba(0,0,0,0.05);background:#fff; margin-top:0;}
	#menu-sitio.scrolled-nav .navbar-brand img{width:100px;}
	#menu-sitio .navbar-nav .nav-link:hover{color:#002d64;}
	#menu-sitio .navbar-nav .nav-link:hover:before{width:0%;}
	#menu-sitio .navbar-nav .nav-link{font-weight:700;}
}

@media (max-width:768px){
	h1{font-size:30px;}
	p{font-size:16px;}
	h2{font-size:25px;}
	
	/*soluciones*/
	#soluciones{padding-top:60px;}
	.texto-soluciones{text-align:center;}
	.btn-soluciones{margin-top:15px;text-align:Center; margin-bottom:30px;}
	#soluciones .btn-naranja{display:none;}
	
	/*que hacemos*/
	.iconos1, .iconos2{display:none;}
	.logo-circular{width:100px;}
	.forma2, .forma1{width:40px;}
	.btn-naranja, .btn-naranja:visited, .btn-naranja:active{font-size:15px;}
		
	/*intro*/
	#intro{margin-top:30px;background-position:300px 0; background-size:500px;}
	.info-intro{height:auto; min-height:0;padding-top:100px;padding-bottom:30px;}
	#intro h1{max-width:270px;}
	#intro .info-intro p{max-width:330px;}
	.btn-flecha-down, .btn-flecha-down:visited, .btn-flecha-down:active{font-size:15px;}
	.btn-flecha-down:after{width:35px; height:35px;}
	
	/*ciberseguridad*/
	.lista-tilo{font-size:16px;}
	
	/*contacto*/
	.caja-contacto{padding:40px 50px;}
	h4{margin-bottom:10px;font-size:25px;}
	.form-control{font-size:16px;}
	#contacto .btn-naranja{float:none;}
	.redes-flotante{display:none;}
}

@media (max-width:575px){
	#soluciones{padding-top:30px;}
	/*#soluciones h2 br{display:none !important; }*/
	#soluciones h2{text-align:center}
}

@media (max-width:480px){
	/*ciberseguridad*/
	h2{font-size:23px;}
	h1{font-size:25px;}
	.forma2, .forma1{width:30px;}
	.forma2{margin-left:0;}
	.forma1{margin-right:0;}
	.ciberseguridad{margin-left:-20%; width:123%;}
	#ciberseguridad{padding-bottom:100px;}
	.icono-amarillo{bottom:-130px;}
	.lista-tilo{columns:1;}
	.conoce-mas{margin-left:0;}
	.btn-ciber br{display:block;}
	
	/*soluciones*/
	.servicio{margin-top:20px;  padding:20px 30px 30px; }
.esquina{width:80px; }
h3{min-height:auto;margin-bottom:15px;width:calc(100% - 50px); font-size:19px;}
	h3 br{display:none !important;}
.servicio ul.lista-tilo{text-align:left;margin-top:0;font-size:15px;}
	.ilustracion{margin-top:-20px;}
	
/*intro*/
	#intro{text-align:center;background-position:right -10px; background-size:400px;}
	.info-intro{height:auto; padding-top:360px;}
	#intro h1{max-width:400px;}
	#intro .info-intro p{max-width:400px;}
	
	/*contacto*/
	.caja-contacto{padding:30px 40px;}
	.circulo{display:none;}
	.enlaces-footer a{margin-bottom:10px;}
}


@media (min-width:991px){
	/*nav*/
.navbar-nav li{display:inline-block;}
.navbar-nav li{margin-left:45px;}	
.navbar-nav{display:inline-block;width:100%; text-align: right;}
}
