@charset "UTF-8";
/*
Theme Name: KTX
Author: Iconos Consultores
Description: Plantilla responsive KTX
Version: 1.0
Tags: responsive, movil, onepage
*/



* {
	margin: 0; padding: 0;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

html, body { 
	height:100%; font-family: 'Lato', sans-serif;  font-size:16px; line-height:1;
	position: relative; z-index: 2;
}

h1, h2, h3, h4, h5, h6 { margin: 0; font-weight:400; }
p{ line-height:1.5; }

article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
menu,
nav,
section,
summary {
	display: block;
}

/* slick */
.slick-list, .slick-track { overflow: hidden; }



/* ---------- GENERALES ----------- */
.main{ width:100%; z-index:2; position:relative; overflow:hidden;  }
.contenedor{ width:90%; max-width:1200px; margin: 0 auto !important; position:relative; }
.seccion{ position: relative; z-index: 2; background:#FFF;  }
.espacio-blanco{ height:100px; }

.titulo-seccion{ padding:30px 0; text-align:center; }
.titulo-seccion h2{ font-size:55px; font-weight:700; line-height:1em; color:#C6C6C6; text-transform:uppercase; }
.titulo-seccion h2:after{ 
	content:'';
	width:115px; height:10px; display:block; margin:15px auto 0 auto; 
	background:#3078be;
}

.limpiar{ clear: both; }
.oculto{ display: none; }
.noscroll{ overflow:hidden; }
.transition{
  -webkit-transition: all 0.2s cubic-bezier(0.62, 0.25, 0.26, 0.94);
  -moz-transition: all 0.2s cubic-bezier(0.62, 0.25, 0.26, 0.94);
  -ms-transition: all 0.2s cubic-bezier(0.62, 0.25, 0.26, 0.94);
  transition: all 0.2s cubic-bezier(0.62, 0.25, 0.26, 0.94);
}


@media screen and (max-width: 800px) {
   .oculto_movil{ display: none; }
}


.btn{
   display:inline-block; padding:0.5rem 0.8rem;  
   border:1px solid #e87c49;
   font-family:'Lato', sans-serif; font-size:1.5rem; font-weight:300; color:#e87c49; text-decoration:none; 
}


/* Columnas y Contenedores */
.col-1{  width:8.3333333%; }
.col-2{  width:16.6666666%; }
.col-3{  width:24.9999999%; }
.col-4{  width:33.3333332%; }
.col-5{  width:41.6666665%; }
.col-6{  width:49.9999998%; }
.col-7{  width:58.3333331%; }
.col-8{  width:66.6666664%; }
.col-9{  width:74.9999997%; }
.col-10{  width:83.333333%; }
.col-11{  width:91.6666663%; }
.col-12{  width:99.9999996%; }


@media screen and (max-width:1000px){ 
.col-l-1{ width:8.3333333%; }
.col-l-2{ width:16.6666666%; }
.col-l-3{ width:24.9999999%; }
.col-l-4{ width:33.3333332%; }
.col-l-5{ width:41.6666665%; }
.col-l-6{ width:49.9999998%; }
.col-l-7{ width:58.3333331%; }
.col-l-8{ width:66.6666664%; }
.col-l-9{ width:74.9999997%; }
.col-l-10{ width:83.333333%; }
.col-l-11{ width:91.6666663%; }
.col-l-12{ width:99.9999996%; }
}

@media screen and (max-width:800px){ 
.col-m-1{ width:8.3333333%; }
.col-m-2{ width:16.6666666%; }
.col-m-3{ width:24.9999999%; }
.col-m-4{ width:33.3333332%; }
.col-m-5{ width:41.6666665%; }
.col-m-6{ width:49.9999998%; }
.col-m-7{ width:58.3333331%; }
.col-m-8{ width:66.6666664%; }
.col-m-9{ width:74.9999997%; }
.col-m-10{ width:83.333333%; }
.col-m-11{ width:91.6666663%; }
.col-m-12{ width:99.9999996%; }
}

@media screen and (max-width:620px){ 
.col-s-1{ width:8.3333333%; }
.col-s-2{ width:16.6666666%; }
.col-s-3{ width:24.9999999%; }
.col-s-4{ width:33.3333332%; }
.col-s-5{ width:41.6666665%; }
.col-s-6{ width:49.9999998%; }
.col-s-7{ width:58.3333331%; }
.col-s-8{ width:66.6666664%; }
.col-s-9{ width:74.9999997%; }
.col-s-10{ width:83.333333%; }
.col-s-11{ width:91.6666663%; }
.col-s-12{ width:99.9999996%; }
}

@media screen and (max-width:500px){ 
.col-xs-1{ width:8.3333333%; }
.col-xs-2{ width:16.6666666%; }
.col-xs-3{ width:24.9999999%; }
.col-xs-4{ width:33.3333332%; }
.col-xs-5{ width:41.6666665%; }
.col-xs-6{ width:49.9999998%; }
.col-xs-7{ width:58.3333331%; }
.col-xs-8{ width:66.6666664%; }
.col-xs-9{ width:74.9999997%; }
.col-xs-10{ width:83.333333%; }
.col-xs-11{ width:91.6666663%; }
.col-xs-12{ width:99.9999996%; }
}

.col-container{ 
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-orient:horizontal;
  -webkit-box-direction:normal;
      -ms-flex-flow:row wrap;
          flex-flow:row wrap;
  -webkit-box-align:stretch;
      -ms-flex-align:stretch;
          align-items:stretch;
  -webkit-box-pack:justify;
      -ms-flex-pack:justify;
          justify-content:space-between;
}

.flex-row, .flex-column{ 
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-align:center;
      -ms-flex-align:center;
          align-items:center;
  -webkit-box-pack:justify;
      -ms-flex-pack:justify;
          justify-content:space-between;
}

.flex-row{ 
  -webkit-box-orient:horizontal;
  -webkit-box-direction:normal;
      -ms-flex-flow:row nowrap;
          flex-flow:row nowrap;
}

.flex-column{ 
  -webkit-box-orient:vertical;
  -webkit-box-direction:normal;
      -ms-flex-flow:column nowrap;
          flex-flow:column nowrap;
}

.flex-wrap{ 
  -ms-flex-wrap:wrap;
      flex-wrap:wrap;
}

.flex-align-stretch{ 
  -webkit-box-align:stretch;
      -ms-flex-align:stretch;
          align-items:stretch;
}

.flex-align-start{ 
  -webkit-box-align:start;
      -ms-flex-align:start;
          align-items:flex-start;
}

.flex-align-end{ 
  -webkit-box-align:end;
      -ms-flex-align:end;
          align-items:flex-end;
}

.flex-justify-center{ 
  -webkit-box-pack:center;
      -ms-flex-pack:center;
          justify-content:center;
}

.flex-justify-start{ 
  -webkit-box-pack:start;
      -ms-flex-pack:start;
          justify-content:flex-start;
}

.flex-justify-end{ 
  -webkit-box-pack:end;
      -ms-flex-pack:end;
          justify-content:flex-end;
}

.flex-justify-between{ 
  -webkit-box-pack:justify;
      -ms-flex-pack:justify;
          justify-content:space-between;
}

.flex-justify-around{ 
  -ms-flex-pack:distribute;
      justify-content:space-around;
}

.flex-center{ 
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-orient:vertical;
  -webkit-box-direction:normal;
      -ms-flex-flow:column nowrap;
          flex-flow:column nowrap;
  -webkit-box-align:center;
      -ms-flex-align:center;
          align-items:center;
  -webkit-box-pack:center;
      -ms-flex-pack:center;
          justify-content:center;
}




/* ------ CABECERO ------- */

/* cabecero logo */
.cabecero{ 
	width:100%; height:100px; position:fixed; top:0; left:0; z-index:1000;  
	background:#1e2d3b; 
	-webkit-box-shadow: 0px 6px 5px -6px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 6px 5px -6px rgba(0,0,0,0.3);
	box-shadow: 0px 6px 5px -6px rgba(0,0,0,0.3);
}
.cabecero-logo{ 
	width:330px; height:100px; float:left; padding-top:12px; 
	position:absolute; top:0; left:0; z-index:10;  
	background:#fa4616; text-align:center; 
}
.cabecera img{ width:auto;  height:75px; }
.cabecero-logo a{ display:block;  }

/* MENU TOPE */
.menu{ margin-top:2.8rem; position:relative; text-align:right;  }
.menu li{ display:inline-block; color:#FFF; }
.menu a{ 
   padding:0 35px; display:block; 
   font-size:0.9rem; color:#FFF; line-height:1.5rem; text-decoration:none; text-transform:uppercase; 
}
.menu a.active{ color:#fa4616; }


@media screen and (max-width:400px){
	.cabecero-logo{ width:70%;  }
}

/* menu movil */
.menu-bg, .btn-menu-movil{
	display:none; position: fixed; right: 25px; top: 25px; z-index:1000; 
	border-radius:4px; 
}
.menu-bg{
	-webkit-box-shadow: 0px 6px 5px -6px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 6px 5px -6px rgba(0,0,0,0.3);
	box-shadow: 0px 6px 5px -6px rgba(0,0,0,0.3);
}
.btn-menu-movil{ width:27px; height:18px; cursor:pointer; position: absolute; top:40px; right:20px;  }
.linea-menu{ position:absolute; width:100%; height:4px; background:#fa4616; border-radius:20px; opacity: 1;}
.linea1{ top:0; }
.linea2, .linea3{top:50%; margin-top:-2px;}
.linea4{ bottom:0;}
.boton-cerrar .linea1, .boton-cerrar .linea4{ opacity:0;}
.boton-cerrar .linea2{ transform:rotate(45deg);}
.boton-cerrar .linea3{ transform:rotate(-45deg);}
.menu-bg{ width: 100%; height:100%; background:#000; opacity:0.0; visibility:hidden; position:fixed; z-index: 999;}
.menu-bg-activo{ opacity:0.6; visibility:visible;}
.menu-activo{ right:0 !important;}

@media screen and (max-width:1020px){
	.menu a{ padding:0 20px; }
}
@media screen and (max-width:890px){
	.menu-bg, .btn-menu-movil{ display:block; }
	.menu-movil{ width: 320px; background: #fff; position: fixed; height: 100%; z-index: 999; right: -320px;}
	.menu-movil ul{ padding-top:80px;  }
	.menu-movil li{ display:block; color:#282828;  }
	.menu-movil a{ color:#282828;  line-height:3.5rem; }
	li.movil-inline{ display:inline-block; margin-top:1rem; padding:0;   }
}


/* ------ PIE ------- */
.pie{ width:100%; padding:35px 0 20px 0; z-index:2; position:relative; background:#FFF;  }
.pie{ font-size:12px; line-height:30px; }

.foot-redes{ text-align:right; }
.foot-redes li{ display:inline-block; }
.foot-redes a{ 
	width:30px; height:30px; display:block;
	border-radius:50%;
	background:#e0e0e0;
	text-align:center 
}

@media screen and (max-width:500px){
	.foot-redes{ text-align:left; }
}


/* ------ BANNER ------- */
.video{
	width:100%; height:auto; position:fixed; top:50%; left:50%; z-index:1;
	margin-top:50px;
	transform: translate(-50%, -50%);
}

.video_fondo{ padding-top:1050px; }
.cont-img-flot{  }
.img-flot{ 
	width:390px; height:622px; position:absolute; top:100%; right:0; z-index:3; overflow:hidden; 
	margin:-120px 0 0 0;
}
.banner-txt{
	width:80%; 
	font-size:60px; font-weight:700; line-height:1.3em; text-align:center; color:#FFF; 
	position:absolute; top:50%; left:10%; z-index:4;  
	transform:translate(0,-50%);
}


@media screen and (max-width:900px){
	.video{ width:auto; height:100%;   }
}
@media screen and (max-width:600px){
	.banner-txt{ font-size:50px; }
}
@media screen and (max-width:400px){
	.img-flot{ width:90%; }
	.img-flot img{ width:120%; }
}



/* ------ SERVICIOS ------- */
.servicios{ padding:50px 0 150px 0; position:relative; }
.serv-item{ padding:0 1rem; margin-bottom: 20px; }
.serv-item-cont{ background:#f7f7f7; }
.serv-info{ padding:10px 25px 35px 25px; }
.serv-img img{ width:100%; height:auto; }
.serv-item h3{ padding:2rem 0 1rem 0; font-size:1.5rem; font-weight:400; line-height:1.2em; color:#3D5975; }
.serv-item p{ color:#3B3A3A; }




/* ------ ABOUT ------- */
.about{
	padding:0 0 0 0; 
	background:#2b6ca3 url(../imgs/acerca/bg.webp) top right no-repeat;
	background-size:cover; 
}
.about .titulo-seccion{ text-align:left; }
.about .titulo-seccion h2:after{ margin:15px 0 0 0; }  
.about-info{ width:50%; padding:50px 60px; background:#f7f7f7;  color:#3B3A3A; }


@media screen and (max-width:800px){
	.about{ }
	.about-info{ width:80%;  }
}

/* ------ ESTADISTICAS ------- */
.datos{ 
	padding:55px 0; background:#2b6ca3; text-align:center; 
	font-size:22px; color:#FFF;
}
.dato-item{ padding:0 5%; position:relative; }
.dato-item:after{ 
	content:''; 
	width:2px; height:70px; position:absolute; top:50px; right:-1px;  
	background:#FFF;   
}
.dato-item:last-child::after{
	display:none; 
}
.datos-num{ padding:10px 0; display:block; font-size:60px; font-weight:700; }
.datos p{ line-height:1.3em;  }

@media screen and (max-width:800px){
	.dato-item{ padding:10px 5%; }
	.dato-item:after{ display:none; }
}



/* ------ PRODUCTOS ------- */
.productos{ padding:60px 0; }
.prod-item{ text-align:center; position:relative; }
.prod-overlay{
	position: absolute; top: 0; right: 0; bottom: 0; left: 0;
	background: rgba(255, 255, 255, 0.8);
	opacity: 0;
	-webkit-transition: opacity 0.4s ease 0s;
	-moz-transition: opacity 0.4s ease 0s;
	transition: opacity 0.4s ease 0s;
	overflow: hidden;
}
.prod-info{ width: 100%; height: 100%; display: table; table-layout: fixed;  }
.prod-info h3{
	vertical-align: middle; display: table-cell;
	font-size:24px; color:#3B3A3A; line-height: 1.3em; 
}
.prod-item a{ color:#3B3A3A; text-decoration:none;  }
.prod-item:hover .prod-overlay{
	opacity:1 
}

@media screen and (max-width:600px){
	.prod-item img{ width:100%; }
	.prod-overlay{ position:static; opacity:1; } 
}


/* ------ SOLUCIONES ------- */
.soluciones{ padding:60px 0; background:#f7f7f7; text-align:center; }
.sol-item{ padding:100px 40px 0 40px;  }
.sol-item h3{ font-size:30px; color:#C6C6C6; }
.sol-item h3 a{ color:#C6C6C6; }



/* ------ CONTACTO ------- */
.contacto{ padding:4rem 0; background:#FFF; color:#3B3A3A; }
.mapa{ height:300px; margin:20px 0;  overflow:hidden; background:#f2f2f2;  }

.contacto h3,
.contacto h4{ 
	font-size:25px; padding:1.5rem 0; font-weight:700; color:#1E2D3B; line-height:0.9em;  }
.contacto h4{ padding-top:60px; }
h4.borde-azul:before{ 
	content:'';
	width:65px; height:10px; display:block; margin:0 0 15px 0;
	background:#3078be;
}


.formulario{ padding:30px 0 0 0; width:70%; }
.formulario p{ clear:both; padding:0 0 30px 0; }
.cf_grupo{ padding:0.5rem 0 0 0; }

.cf_grupo input,
.cf_grupo textarea{
	width: 100%; clear:both; position: relative; display: block; padding:0 0.5rem;
	border-radius: 0; background:#f7f7f7; border:none;
	color: #3b3b3a; font-size:0.9rem; line-height:2.5; 
  	-webkit-appearance: none; /* for box shadows to show on iOS */
}
.cf_grupo textarea{ height:150px; }
.cf_grupo input:focus, .cf_grupo textarea:focus{ outline: none; }
.cf_grupo label{ display:none;  }
.cf_enviar{ 
	max-width:170px; padding:0 40px; margin-top:1rem; 
   font-size:1rem; line-height:2.5; color:#FFF; 
	background:rgba(40, 59, 98, 1); border:none; 
	cursor: pointer;
	-webkit-transition:all 300ms linear; 
	-moz-transition:all 300ms linear; 
	-ms-transition:all 300ms linear; 
	transition:all 300ms linear; 
}
.cf_derecha{ text-align:right; }


@media screen and (max-width:800px){
	.formulario{ padding:30px 0; width:100%; }
}



/* -------- detalle ------- */
.titulo-interna{ padding:89px 0 30px 0; margin-bottom:30px; text-align:left; background:#f7f7f7;  }
.titulo-interna h3{ font-size:55px; font-weight:700; line-height:1em; color:#C6C6C6; }
.titulo-interna h3:after{ 
	content:'';
	width:115px; height:10px; display:block; margin:15px 0 0 0; 
	background:#3078be;
}

.detalle{ padding:50px 0; }
.detalle-desc{ padding:0 30px 0 0; text-align:left; font-size:18px; }
.detalle-desc p{ padding:10px; line-height:2em; }
.detalle-desc li{ margin:0 0 0 30px; padding:10px 0 0 0; line-height:2em; }    

.contenedor-rotador{ width:476px; height:521px; overflow:hidden; position:relative; }
.flecha{ width:32px; height:100%; position:absolute; top:0; }
.prev{ left:0; }
.sig{ right:0; }
.flecha i{ width:32px; position:absolute; top:50%; left:0; margin-top:-10px; color:#FFF; text-align:center; }
.flecha i:before{ font-size:20px; text-shadow: 0px 0px 0px rgba(0, 0, 0, 1); }
.flecha:hover{ background:rgba(255,255,255,0.5); }



/* ------ ANIMATE ------- */

/*!
 * animate.css -http://daneden.me/animate
 * Version - 3.7.0
 * Licensed under the MIT license - http://opensource.org/licenses/MIT
 *
 * Copyright (c) 2018 Daniel Eden
 */

@-webkit-keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}

@-webkit-keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.fadeInLeft {
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
}

@-webkit-keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.fadeInRight {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight;
}

@-webkit-keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}

@-webkit-keyframes slideInLeft {
  from {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInLeft {
  from {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.animated.infinite {
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}

.animated.delay-1s {
  -webkit-animation-delay: 1s;
  animation-delay: 1s;
}

.animated.delay-2s {
  -webkit-animation-delay: 2s;
  animation-delay: 2s;
}

.animated.delay-3s {
  -webkit-animation-delay: 3s;
  animation-delay: 3s;
}

.animated.delay-4s {
  -webkit-animation-delay: 4s;
  animation-delay: 4s;
}

.animated.delay-5s {
  -webkit-animation-delay: 5s;
  animation-delay: 5s;
}

.animated.fast {
  -webkit-animation-duration: 800ms;
  animation-duration: 800ms;
}

.animated.faster {
  -webkit-animation-duration: 500ms;
  animation-duration: 500ms;
}

.animated.slow {
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
}

.animated.slower {
  -webkit-animation-duration: 3s;
  animation-duration: 3s;
}

@media (print), (prefers-reduced-motion) {
  .animated {
    -webkit-animation: unset !important;
    animation: unset !important;
    -webkit-transition: none !important;
    transition: none !important;
  }
}