/* ---- Estilos básicos ---------------------------------------------------- */

body {
  margin: 0;
  padding: 0;
  width: 100%;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 16px;
  background-color: #FFF;
  color: #000000;
}

a {
  color:#192666;
  
}
a:hover {
  color:#4F6AD7;
}

p {
  margin: 0 2em 0 2em ;
  padding: 0;

	font-size: 20px;
line-height: 22px;}
.txt {
	margin: 20px 30px 0 30px;
	padding: 0;
	text-align: left;
	}   
.clear {
  clear: both;
}

h1, h2, h3, h4, h5 {
  margin: 1em 0;
  line-height: 1.5em;
  padding:0;
  text-align: center;
}

h1 {
  font-size: 200%;
  font-family: Arial, Helvetica, sans-serif;
  font-weight: normal;
  text-align:center;
}

h2 {
  font-size:180%;
  font-family: Arial, Helvetica, sans-serif;
  font-weight:normal;
}

h3 {
	font-family: Arial, Helvetica, sans-serif;	
  font-size:160%;

  margin: 0 0 0 2em ;
  font-weight:normal;
}
h5{
	 font-size: 100%;
  font-family: Arial, Helvetica, sans-serif;
  font-weight: normal;
}



/*

/* ---- Layout ------------------------------------------------------------- */

.contenedor {
 	 width: 98%;
	margin: 0 auto;

	background-color: #FFF;
	height: auto;

}

.cabecera {
	width: 100%;
	height: auto;
	margin: 0 0 0 0;
	padding: 0 0 0 0;

	background-color: #FFF;


}

#contenido {
	width: 98%;
	margin: 0 0 0 0;

	background-color: #FFF;
	text-align: left;
	color: #000000;
	height: auto;
	overflow: hidden;
  
}

#contenido #principal {
  float: left;
  width: 950px;
  margin-top: 15px;
  padding:0 0 0 20px;
  background-color: #FFF;
  height: auto;
  overflow: hidden;
}

#pie {
	clear: both;
	height: auto;
	width: 100%;
	/*background: url("../imagenes/fondo_articulo.jpg") no-repeat;*/
	color: #6685CC;
	position: relative;
	background-color: #000000;
}

/* ---- Cabecera ----------------------------------------------------------- */
#cabecera #logo {
  position: absolute;
  top: 35px;
  left: 200px;
  margin: 0;
}

#cabecera #logo a {
  color: black;
  display: block;
  line-height: 35px;
}

#cabecera #logo a:hover {
  color: red;
  /*text-decoration: underline;*/
}

/* ---- Menú --------------------------------------------------------------- 
* { 
margin: 0px;
padding: 0px; 
outline: 0;
}
* {margin: 0px;
padding: 0px; outline: 0;
}
html, body {width: 100%;
}
body {
font-family: 70%/160% Arial, Helvetica, sans-serif;
 margin: 10;
  padding: 0;
  background: #F2F5FE url("../imagenes/fondo5.jpg") 0 0 repeat-x;
  color: #192666;
}*/
#menudiv {
	width: 100%;
	height: 30px;
	margin: 0 0 0 0;
	padding: 0 auto;
	background-color: #000;
	/*font-family: Arial, Helvetica, sans-serif;*/
	font-family: 'Arial Narrow';
}
#menu {text-align: center;
font-size: 1.2em;
width:95%;
text-align: center;
z-index:40;
padding: 0 auto;
margin: 0 auto;
}
#menu ul {
	list-style-type: none;
	z-index:41;
}
#menu ul li {
	width: 140px;
	z-index:41;
	padding-top: 5px;
}
#menu ul li.nivel1 { 
	float: left;
	margin-right: 1px;
	z-index:40;
}
#menu ul li a {
	display: block;
	text-decoration: none;
	color: #fff;
	background-color: #000000;
	/*border: solid 1px #fff;*/
	position: relative;
	z-index: 45;
}
#menu ul li a.nivel2, #menu ul li a.nivel2ie {
	color: rgb(11, 173, 11);
	z-index:45;
}
#menu ul li a.nivel1, #menu ul li a.nivel2 {
	display: block!important;
	display: none;
	position: relative;
	z-index: 40;
}
#menu ul li:hover {
	position: relative;
}
#menu ul li a:hover, #menu ul li:hover a.nivel1 {
	background-color: #000000;
	color: rgb(11, 173, 11);
	position: relative;
	z-index: 40;
}
#menu ul li ul {
	display: none;
}
#menu ul li ul li ul {
	display: none;
}
#menu ul li:hover  ul.nivel2, #menu ul li a:hover  ul.nivel2{
	display: block;
	position: absolute;
	left: 0px;
	z-index:45;
}
#menu ul li ul li a:hover ul.nivel3, #menu ul li ul li:hover ul.nivel3 {
	display: block;
	position: absolute;
	left: 161px!important;
	left: 160px;
	top:0px!important;
	top: -21px;
	z-index:45;
}
#menu ul li ul li ul a:hover ul.nivel4, #menu ul li ul li ul li:hover ul.nivel4 {
	display: block;
	position: absolute;
	left: 161px!important;
	left: 160px;
	top:0px!important;
	top: -21px;
	z-index:45;
}

#menu ul li ul li a {
	width: 180px;
	padding: 10px 0px;
	border-top-color: transparent;
	z-index:45;
}
#menu ul li ul li a:hover {
	border-top-color: #000;
	position: relative;
	z-index:44;
}
#menu ul li ul li ul li a.primera {
	border-top-color: #fff;
	z-index:45;
}
table.falsa {
	border-collapse:collapse;
	border:0px;
	float: left;
	position: relative;
	z-index:45;
}


/* ---- Pie ---------------------------------------------------------------- */
#pie p {
	margin: 0;
	padding: 0;
	position: absolute;
	top: 10px;
	left: 40px;
}
/*------Formulario-----------------------------------------------------------*/

label {
  display: block;
  margin: .5em 0 0 0;
}
.btn {
  display: block;
  margin: 2em 0;
  float:left;
}
.btnborrar {
  display: block;
  margin: 2em 0;
  float:right;
}
div {
  margin: .2em 0;
}
div label {
  width: 1%;
  float: left;
}
form fieldset {
  float:left;
  width: 48%;
  margin:auto;
}
input:focus {
  border: 2px solid #000;
  background: #F3F3F3;
}
/*-------------------video----------------------------------------------*/
video {
	margin:200;
	float:200;
	
}
/*--------------------slider------------------------------------------------*/

#wrapper {
	width: 600px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 3px;
	padding: 10px;
	background: #292929 url('i/bg-slideshow.jpg') repeat-x;

	position: relative;
	z-index: 10;
	background-color: #000000;
 }
.reflect {   
	width:730px; 
	margin-left:auto; 
	margin-right:auto; 
	display:block; 
	margin-top:-30px; 
}

.JWslider {
	padding:0px;  
	position:relative; 
	z-index:11; 
	overflow:hidden;
	}
.JWslider ul{ 
	list-style:none;
	padding:0px;
	margin:0px; 
	position:relative;   
}
.JWslider ul li { 
	position:absolute; 
	display:block; 
	width:100%;
}
.JWslider ul li  img { 
	position:relative; 
	z-index:12; 
}
.JWslider .active { 
	z-index:13; 
}
.JWslider .reset { 
	z-index:14;
 }

.JWslider span { 
	display:none;
	color:#fff;
	bottom:0px; 
	padding:10px; 
	width:100%; 
	left:0px; 
	position:absolute!important; 
	z-index:15; 
	background:url('i/comment-bg.png'); 
	font-family: Arial, Helvetica, sans-serif;
}

.controls { 
	margin-top:20px;  
	position:relative; 
	background: url('i/control-bg.png') no-repeat; 
	display:block; 
	width:900x; 
	height:30px; 
	padding-left:150px; 
	margin:auto;
}
.controls li {   
	position:relative; 
	float:left; 
	margin:12px 5px 5px 5px; 
	display:block; 
	width:17px; 
	height:15px;  
	background: url('i/default.png') no-repeat; 
	text-indent:-9999px; 
	cursor:pointer;
}
.control_active {   
	background: url('i/active.png') no-repeat!important;
	height:20px!important; 
	margin-top:9px!important; 
	margin:auto;
}
.control_hover {  
	background: url('i/active.png') top no-repeat!important;
	height:20px!important;
	margin-top:9px!important;
	margin:auto;
 }

/*----------------cuadrodeTexto--------------------------*/
form{
   padding:2px;
   display:block;
   width:850px;
   height:0;
   margin: 2em 2em 0 25em;
   text-align:center;
   

}
/*
iframe{
margin-top:30px
}*/
/*-------------------tablaComun--------------------------------*/
td{
  color:black;
  font-weight:bold;
  font-size:150%;
  font: 130%/160% "verdana", serif;
  margin: 0 4em 0 4em ;
  padding: 10px 40px 20px 50px;
  border-collapse: collapse;


}
th{
	font: 130%/160% "verdana", serif;
	margin: 0 4em 0 4em ;
	padding: 10px 0 0 38px;
}
/*-------------------tablaDIV--------------------------------*/

#tabladiv {
    display: table;
    border-collapse: collapse;
    width: 800px;
      
    font: 130%/160% "verdana", serif;
	margin: 0 4em 0 4em;
	padding: 10px 0 0 38px;
	/*border: 1px solid #000;*/
}
#conttable {
    display: table-row;
	color:black;
    font-weight:bold;
    font-size:150%;
    font: 130%/160% "verdana", serif;
    margin: 0 4em 0 4em;
    padding: 10px 40px 20px 38px;
	/*border-collapse: collapse;*/
}
#columna1, #columna2, #columna3 {
    display: table-cell;
    border-collapse: collapse;
    vertical-align: middle;
    padding: 10px 40px 20px 38px;
	/*border: 1px solid #000;*/
}
/*----------------------------------------------------------*/

#tabladesc{
    display: table;
    border-collapse: collapse;
    width: 800px;
	height:100px;
      
    font: 130%/160% "verdana", serif;
	margin: 0 4em 0 4em;
	padding: 10px 0 0 38px;
	/*border: 1px solid #000;*/
}
#contdesc {
	display: table-row;
	color:black;
	font-weight:bold;
	font-size:120%;
	font: 120%/150% "verdana", serif;
	margin: 0 2em 0 2em;
	padding: 10px 20px 20px 20px;
	border-collapse: collapse;
	text-align: left;
}
#col1, #col2, #col3,#col4 {
    display: table-cell;
    border-collapse: collapse;
    vertical-align: baseline;
    padding: 10px 40px 20px 38px;
	/*border: 1px solid #000;*/
	width:100px;
	height:100;
	font-weight:bold;
	font: 90%/160% "verdana", serif;
}
#col1{
	background:#EFAA50;
}
#col2{
	background:#55A1D8;
}
#col3{
	background:#BFC7CA;
}
#col4{
	background:#FAFC5D;
}
/*-------------------columnas-------------------------------*/
#colu1{
	text-align: center;
	width:272px;
	display: table-cell;
	vertical-align: bottom;
	font-size:150%;
	font-weight:"verdana", serif;	
	
}
#colu2{
	text-align: center;
	width:272px;
	display: table-cell;
	vertical-align: middle;
	font-size:150%;
	font-weight:"verdana", serif;		
}
#colu3{
	text-align: center;
	width:272px;
	display: table-cell;
	vertical-align: bottom;
	font-size:150%;
	font-weight:"verdana", serif;	
}

/*-------------------preguntasFrecuentes---------------------*/
#question{
	width:300px;
	margin:auto;
	margin-top:50px;
}
#enlace{
	float:left;
	width:75px;
	height:25px;
	background:#bdbdbd;
	color:#ff0000;
	text-decoration:none;
	border-radius:5px 5px 0 0;
	text-align:left;
	letter-spacing:0px;

}
#enlace:hover{
	letter-spacing:1px;
}
#texto{
	clear:both;
	margin:0px;
	overflow-x:hidden;

	
}
.mitad {
	float:left;
	width:50%;
	}
/*-------------------productos-----------------------*/
.yee-col-md-3 img{
	border:0px solid #dee0db;
}
.yee-col-md-3 img:hover{
	border:3px solid blue; 
	color:#7ac143;
}
.yee-nav-tabs > li > a{
	background-color: blue; 
	color: #333; 
	border-radius:0 0 0 0;
	}
.yee-nav-tabs > li > a:hover{
	background-color:#7ac143;
	}
.yee-nav-tabs > li.active > a, .yee-nav-tabs > li.active > a:hover, .yee-nav-tabs > li.active > a:focus {
	color:#7ac143};

.error {
	text-align:center;
	font-family: Arial, Helvetica, sans-serif;
	font-weight:bold;
	font-size:16px;
	}
.texto {
	font-size:16px;
	font-weight:bold;
	}
.telefono {
	font-size: 24px;
	font-weight: bold;
	line-height: 26px;
}
p {
	font-family: Arial, Helvetica, sans-serif;
}
.bigger {
	font-size: 1.5em;
	font-family: Arial, Helvetica, sans-serif;
}
.tienda {
	width: 95%;
	height:auto;
	text-align: right;
}
.dercecha{
	text-align: right;
}
.loscuatro {
	width: 100%;
	height:auto;
	background-color: #FFF;
	margin: 0 auto;
	overflow: hidden;
}
.unodecuatro {
	width: 340px;
	height: 550px;
	float: left;

	margin: 0 auto;
padding: 0 auto;
}
.unodecuatroalar {
	width: 80%;
	height: auto;
	float: left;
background-color: #FAFC5D;
text-align: center;
}
.doscuartos {
	width: 60%;
	height: 500px;
	margin: 0 auto;
	background-color: #192666;
}
.imagenunodecuatro {
	width:320px;
	height: 270px;
margin: 0 auto;
padding: 0 auto;
text-align: center;
float: left;

}

.textounodecuatro {
	width: 100%;
	height: auto;
	text-align: center;
	font-family: Verdana, Geneva, Tahoma, sans-serif;
	font-size: 22;
}
.imagenalar {
	width:320px;
	height: 350px;

text-align: center;
float: left;

margin-left: 20%;
}
.textoalar1de4 {
	width: 300px;
	height: 350px;
	text-align: left;
	font-family: Verdana, Geneva, Tahoma, sans-serif;
	font-size: 22;
	float: left;

	margin-left: 15%;
}
.franjablanca {
	width: 100%;
	height: 10px;

float: left;
}
.imagenindex {
	width: 100%;
	height: auto;
	background-color: #fff;
}
.envios {
	width: 100%;
	height: 220px;
	background-color: #fff;

}
.tercioenvio {
	padding-top: 15px;
	width: 33%;
	height: 200px;
	background-color: #fff;
	float: left;
}
.elige {
	display: block;
	float: left;
	width: 100%;
	height: 60px;
	background-color: #fff;
	font-family: Arial, Helvetica, sans-serif;
}
.centra {
	text-align: center;
}
.paracuatro {
	width: 100%;
	height: 265px;
	background-color: #fff;
	font-family: Arial, Helvetica, sans-serif;
	
}
.prinunodecuatro {
	height:265px ;
	width: 25%;
	float: left;
	border-bottom-style: solid;
	border-bottom-color: #000;
	border-bottom-right-radius: 1pt;
}
.imgprinunodecuatro {
	width: 100%;
	height: 195px;
	text-align: center;
}
.txtprinunodecuatro {
	width: 100%;
	height: 70px;
	text-align: center;
}
.txtprinunodecuatro a{
	width: 100%;
	height: 70px;
	text-align: center;
	font-size: 18px;
}
#paracinco {
	width: 100%;

	background-color: greenyellow;
}
.unodecinco {
	width: 320px;
	height: 265px;
	background-color: green;
	float: left;
	display: block;
}
.centrafuente {
	text-align: center ;
	font-size: 16px;
}
.footer {
	width: 100%;
	height: 195px;
	background-color: #000;
	font-family: 'Arial Narrow';
	float: left;
}
.redes {
	width: 80px;
	height: auto;
	color: #fff;

	float: left;
	margin: 30px 0 0 50px;
	overflow: hidden;
}
.redes p {
	text-align: center;
	padding: 0;
	margin: 0;
}
.quienes {
	width: 250px;
	height: 175px;
	color: #fff;
	float: right;

	margin: 0;
	padding: 0;
}
.quienes p {
	text-align: center;
	padding: 0;
	margin: 0;
}
.quienes a {
	color: #fff;
}
.contacto-ventas {
	width: 400px;
	height: 175px;
	color: #fff;
	float: left;

	margin: 0;
}

.zktecoext {
	width: 100%;

	height: auto;
	float: left;

}
.zktecoint {
width: 340px;
padding-left: 5%;
height: auto;
float: left;

}
.zktecoint30 {
	width: 30%;

float: left;
}
.pzkteco {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 18px;
}
.esclusadiv {
	width: 100%;
	height: auto;
	font-family: Arial, Helvetica, sans-serif;
}
.esclusaima {
	width: 802px;
	height: auto;
	margin: 0 auto;
	font-family: Arial, Helvetica, sans-serif;
}
.doscolu {
	width: 100%;
	height: 1100px;
}
.unacoldedos {
	width: 350px;
	margin: 0;
	padding:0 ;
	float: left;
	height: auto;
}
.unacoldedos-01 {
	width: 350px;
	margin: 0;
	padding:0 ;
	float: left;
	height: 500px;
}
.unacoldedos-02 {
	width: 350px;
	margin: 0;
	padding:0 ;
	float: left;
	height: 650px;
}
.doscolubar {
	width: 100%;
	height: 400px;

}
.doscolubarlx {
	width: 100%;
	height: 500px;

}
.doscolubar-01 {
	width: 100%;
	height: 500px;

}
.doscolubar-02 {
	width: 100%;
	height: 550px;

}
.doscolubar-03 {
	width: 100%;
	height: 580px;
}
.col350 {
	width: 350px;
	margin-left: 20px;
	height: auto;
	float: left;
}
.paquetes {
	width: 340px;
	height: 160px;
	border: black, double, 5px;
	float: left;
	overflow: hidden;
	border-radius: 10px;
}
.paquetes h3 {
	text-align: center;
	margin: 0;
	padding: 0;
}
img {
	width:100%;
	height:auto;
}
.chiqui01 {
	width: 66%;
	height: auto;
	padding: 0 30px;
}
.chiqui02 {
	width: 50%;
	height: auto;
	margin: 0 auto;
	text-align: center;
	padding-left: 20%;
}
.chiqui03 {
	width: 33%;
	height: auto;
	margin: 0 auto;
	text-align: center;
	padding-left: 20%;
}
.chiqui04 {
	width: 20%;
	height: auto;
}
.chiqui05 {
	width: 10%;
	height: auto;
}
.tercio1 {

	height: auto;
	width: 365px;
	float: left;
	margin-left: 3%;
	text-align: center;
	overflow: hidden;
}
.tercio1 p {
	text-align: left;
}
.tercio2 {
	
	width: 365px;
	height: 300px;
	float: left;
	margin-left: 3%;
}
.tercio3 {
	width: 365px;
	height: 300px;
	float: left;
	margin-left: 3%;	
}

.imagec {
	width:50%;
	height:auto;
	margin-left: 10%;
}
.imaged {
	width:66%;
	height:auto;
	margin-left: 10%;
}
.dosterc {
	height: 300px;
	width: 66%;
	float: left;
	margin-left: 3%;
	
}
.txtproductos {
	padding: 0;
	
}
.arriba {
	width:98%;
	height:300px;
	background-image: url("/images/pantallainic/pantalla-interactiva-touch-zkteco-inteligente-wifi-1.jpg");
	
}
.textoarriba {
	width:55%;
	margin: 0 0 0 45%;
}
.textoarriba h1 {
	margin: 0;
	padding: .5em 0;
	font-size: 2.5em;
	margin-block-start: 0;
    margin-block-end:0;
	text-align: left;
	line-height: 1em;
	font-weight: bold;

}
.textoarriba h4 {
	margin: 0;
	padding: 0;
	font-size: 1.5em;
	font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
	line-height: 1em;
	text-align: left;
}
.textoarriba ul {

	margin: 0;
	padding: 0;
	overflow: hidden;
	
}
.textoarriba li {
	list-style-type:disc;
	color: #000;
	float: left;
	font-size: 1.3em;
	font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
	margin: 0 0 0 25px;
	padding: 0 6px 0 6px;
	
}
.linea01screen {

	float:left;

	width:100%;

	height:250px;

	}
.mitadscreen {
	width:48%;
	margin:5px 0 5px 10px;
	float:left;

	height:230px;
	
}
.mitadscreenimagen {
	width:48%;
	margin:5px 0 5px 10px;
	float:left;

	height:230px;

}
.mitadscreentxt {
	width:40%;
	margin: 3em 0 0 55%;
	height: auto;
}
.mitadscreentxt h4 {
	margin: 0;
	padding: 0;
	font-size: 1.5em;
	font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
}
.dostercioscreenimagen {
	width:60%;
	margin:5px 0 5px 10px;
	float:left;

	height:230px;
}
.dostercioscreenimagen img {
	width:100%;
	height:auto;
}
.untercioscreentxt {
	width:25%;
	margin:2em 0 5px 8%;
	float:left;

	height:150px;	

}
.untercioscreentxt h4 {
	margin: 0;
	padding: 0;
	font-size: 1.5em;
	font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
}
.textodom {
	width: 80%;
	margin: 0 auto;
	height: auto;
}
.mitadbarra {
	width: 360px;
	height: 480px;
	/*background-color: #4F6AD7;*/
	min-width: 360px;
float: left;
}
.cienxcien {
	width: 100%;
	height: auto;
	overflow: hidden;
	float: left;
}
/*
.unodecuatro ul {
	background-color: #000;
	color: #fff;
}*/
.catalogo-flotante {
    position: fixed;
    right: 20px;
    top: 100px;
    z-index: 998;
        background: #a6ce00;
	
    color: #1c1d1e;
    padding: 10px 18px;
    border-radius: 30px;
        box-shadow: 0 4px 12px rgba(166, 206, 0, 0.35);
        text-decoration: none;
    font-weight: 600;
    font-size: 0.9rem;
    font-family: 'Segoe UI', 'Inter', sans-serif;
        display: flex;
    align-items: center;
    gap: 8px;
        border: none;
        transition: all 0.3s ease;
        animation: fadeInRight 0.4s ease-out 0.2s both;
}

.catalogo-flotante i {
    font-size: 16px;
    color: #1c1d1e;
}

.catalogo-flotante:hover {
    background: #94b800;
    transform: translateY(-2px) scale(1.02);
    box-shadow: 0 6px 18px rgba(166, 206, 0, 0.5);
    padding-right: 22px;
}

.catalogo-tooltip {
    position: absolute;
    right: 100%;
    top: 50%;
    transform: translateY(-50%);
    margin-right: 12px;
    background: #1c1d1e;
    color: #ffffff;
    padding: 6px 14px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 500;
    white-space: nowrap;
    opacity: 0;
    visibility: hidden;
    transition: all 0.25s ease;
    pointer-events: none;
    border: 1px solid #a6ce00;
}
.catalogo-texto {
	color: #000;
}
.catalogo-tooltip::after {
    content: '';
    position: absolute;
    left: 100%;
    top: 50%;
    transform: translateY(-50%);
    border: 6px solid transparent;
    border-left-color: #a6ce00;
}

.catalogo-flotante:hover .catalogo-tooltip {
    opacity: 1;
    visibility: visible;
    margin-right: 16px;
}