

/* CSS de Botones-dinamicos */
   
/* Sweep To Right */
/*whatsapp*/
.whatsapp {
  position:fixed;
  width:60px;
  height:60px;
  bottom:100px;
  left:10px;
  background-color:#fff;
  color:#FFF;
  border-radius:50px;
  text-align:center;
  font-size:30px;
  z-index:100;
}

.whatsapp-icon {
  margin-top:5px;
}
/*boton*/
.boton {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  position: relative;
  -webkit-transition-property: color;
  transition-property: color;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  color:#000000 !Important;
  text-decoration:none;
  border:2px solid #000000;
  border-radius: 2px;
  margin:5px;
  padding:10px 20px;
  background: #f6f5f4;
  text-align:center !Important;
  min-width:100px;
}
.boton:before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color:#000000;
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transform-origin: 0 50%;
  transform-origin: 0 50%;
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.boton:hover, .hvr-sweep-to-right:focus, .hvr-sweep-to-right:active {
  color: #f6f5f4 !Important;
}
.boton:hover:before, .hvr-sweep-to-right:focus:before, .hvr-sweep-to-right:active:before {
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
}   

/*boton*/
.boton-gen {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  position: relative;
  -webkit-transition-property: color;
  transition-property: color;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  color:#ffffff !Important;
  text-decoration:none;
  border:2px solid #333333;
  border-radius: 2px;
  margin:5px;
  padding:10px 20px;
  background: #333333;
  text-align:center !Important;
  min-width:100px;
}
.boton-gen:before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color:#eeeeee;
    border-radius: 2px;
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transform-origin: 0 50%;
  transform-origin: 0 50%;
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.boton-gen:hover, .hvr-sweep-to-right:focus, .hvr-sweep-to-right:active {
  color: #333333 !Important;
    border-radius: 2px;
}
.boton-gen:hover:before, .hvr-sweep-to-right:focus:before, .hvr-sweep-to-right:active:before {
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
}   

/*Boton gen 1*/
.boton-gen-1 {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  position: relative;
  -webkit-transition-property: color;
  transition-property: color;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  color:#ffffff !Important;
  text-decoration:none;
  border:2px solid #333333;
  border-radius: 2px;
  margin:5px;
  padding:6px 20px;
  background: #333333;
  text-align:center !Important;
  min-width:100px;
}
.boton-gen-1:before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color:#eeeeee;
    border-radius: 2px;
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transform-origin: 0 50%;
  transform-origin: 0 50%;
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.boton-gen-1:hover, .hvr-sweep-to-right:focus, .hvr-sweep-to-right:active {
  color: #333333 !Important;
    border-radius: 2px;
}
.boton-gen-1:hover:before, .hvr-sweep-to-right:focus:before, .hvr-sweep-to-right:active:before {
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
}   


/*Boton menos altura fontsize 12px*/
.boton-gen-2 {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  position: relative;
  -webkit-transition-property: color;
  transition-property: color;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  color:#ffffff !Important;
  text-decoration:none;
  border:2px solid #333333;
  border-radius: 2px;
  margin:5px;
  padding:4px 8px;
  font-size:13px;
  background: #333333;
  text-align:center !Important;
  min-width:100px;
}
.boton-gen-2:before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color:#eeeeee;
    border-radius: 2px;
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transform-origin: 0 50%;
  transform-origin: 0 50%;
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.boton-gen-2:hover, .hvr-sweep-to-right:focus, .hvr-sweep-to-right:active {
  color: #333333 !Important;
    border-radius: 2px;
}
.boton-gen-2:hover:before, .hvr-sweep-to-right:focus:before, .hvr-sweep-to-right:active:before {
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
}   

/*Boton menos altura fontsize 11px*/
.boton-gen-3 {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  position: relative;
  -webkit-transition-property: color;
  transition-property: color;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  color:#ffffff !Important;
  text-decoration:none;
  border:2px solid #333333;
  border-radius: 2px;
  margin:5px;
  padding:1px 6px;
  font-size:11px;
  background: #333333;
  text-align:center !Important;
  min-width:100px;
}
.boton-gen-3:before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color:#eeeeee;
    border-radius: 2px;
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transform-origin: 0 50%;
  transform-origin: 0 50%;
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.boton-gen-3:hover, .hvr-sweep-to-right:focus, .hvr-sweep-to-right:active {
  color: #333333 !Important;
    border-radius: 2px;
}
.boton-gen-3:hover:before, .hvr-sweep-to-right:focus:before, .hvr-sweep-to-right:active:before {
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
}   

/**/
.sweep-right {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  position: relative;
  -webkit-transition-property: color;
  transition-property: color;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  color:#f6f5f4 !Important;
  text-decoration:none;
  border:1px solid #f6f5f4;
  margin:5px;
  padding:10px 20px;
  background-color:#000000;
  width:100%;
  max-width:400px !Important;
}
.sweep-right:before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #f6f5f4;
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transform-origin: 0 50%;
  transform-origin: 0 50%;
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.sweep-right:hover, .hvr-sweep-to-right:focus, .hvr-sweep-to-right:active {
  color: #000000 !Important;
}
.sweep-right:hover:before, .hvr-sweep-to-right:focus:before, .hvr-sweep-to-right:active:before {
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
}

/**/
.sweep-right-com {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  position: relative;
  -webkit-transition-property: color;
  transition-property: color;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  color:#f6f5f4 !Important;
  text-decoration:none;
  border:1px solid #f6f5f4;
  margin:5px;
  padding:10px 20px;
  background-color:#000000;
  text-align:center !Important;
  min-width:200px;
}
.sweep-right-com:before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #f6f5f4;
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transform-origin: 0 50%;
  transform-origin: 0 50%;
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.sweep-right-com:hover, .hvr-sweep-to-right:focus, .hvr-sweep-to-right:active {
  color: #000000 !Important;
  box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
}
.sweep-right-com:hover:before, .hvr-sweep-to-right:focus:before, .hvr-sweep-to-right:active:before {
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
}
#contenedor-centro {
text-align:center;
}

/*Seccion de divs prederminados*/
.div-uno {
display:inline-block;
vertical-align:top;
margin:10px;
width:95%;
padding:20px;
background-color:#f5f5f5;
border-radius:6px;
text-decoration:none;
}
#div-uno {
column-count:1;
/*display:inline-block;*/
width:100%;
padding:20px;
background-color:#f5f5f5;
border-radius:6px;
text-decoration:none;
}
#div-dos {
column-count:2;
column-gap: 3em;
column-rule: 1px solid #eeeeee;
column-width: 450px;
display:inline-block;
margin:0px;
width:100%;
padding:10px;
vertical-align:top;
background-color:#f5f5f5;
border-radius:6px;
text-decoration:none;
}
#div-tres {
column-count:3;
column-gap: 3em;
column-rule: 1px solid #eeeeee;
column-width: 300px;
display:inline-block;
margin:10px auto;
width:100%;
padding:20px;
vertical-align:top;
background-color:#ffffff;
border-radius:6px;
text-decoration:none;
justify-content:center;

}
#div-cuatro {
column-count:4;
column-gap: 3em;
column-rule: 1px solid #eeeeee;
column-width: 200px;
display:inline-block;
margin:10px;
width:100%;
vertical-align:top;
padding:20px;
background-color:#f5f5f5;
border-radius:6px;
text-decoration:none;
}
#div-caja300 {
display:inline-block;
width:85%;
max-width:300px;
height:250px;
overflow:auto;
margin:3px auto;
padding:15px;
color:#666666;
/*background-color:#FBFBFB;*/
background-color:#FBFBFB;
   opacity:1.0; /* Opacidad 60% */
/*background-color:rgb(255,255,255);
   opacity:0.9; /* Opacidad 60% */
border: 1px Solid #EFEFEF;
border-radius: 1px;
vertical-align:top;
box-shadow: 0px 10px 10px -6px #A8A8A8;

}
#div-caja300:hover {background-color:#F2F2F2;color:#000000;}

#div-caja150 {
display:inline-block;
width:85%;
max-width:150px;
height:200px;
overflow:auto;
margin:3px auto;
padding:15px;
color:#666666;
/*background-color:#FBFBFB;*/
background-color:#FBFBFB;
   opacity:1.0; /* Opacidad 60% */
/*background-color:rgb(255,255,255);
   opacity:0.9; /* Opacidad 60% */
border: 1px Solid #EFEFEF;
border-radius: 1px;
vertical-align:top;
box-shadow: 0px 10px 10px -6px #A8A8A8;

}
#div-caja150:hover {background-color:#F2F2F2;color:#000000;}

/*Caja con texto especial para imagenes de fondo*/
.div-caja-texto-trans {
display:inline-block;
width:100%;
/*max-width:300px;*/
/*height:250px;*/
overflow:auto;
margin:3px auto;
padding:15px;
/*color:#666666;*/
/*background-color:#FBFBFB;*/
background-color:#FBFBFB;
   opacity:1.0; /* Opacidad 60% */
/*background-color:rgb(255,255,255);
   opacity:0.9; /* Opacidad 60% */
border: 1px Solid #EFEFEF;
border-radius: 1px;
vertical-align:top;
box-shadow: 0px 10px 10px -6px #A8A8A8;
transition-duration: 0.6s;

}
.div-caja-texto-trans:hover {background-color:#F2F2F2;color:#000000;transition-duration: 0.6s;}


#promobox {
display: inline-block;
max-width:320px;
height:570px;
overflow-y: hidden; /* Hide vertical scrollbar */
overflow-x: hidden; /* Hide horizontal scrollbar */
margin:2px auto;
padding:20px;
color:#666666;
/*background-color:#FBFBFB;*/
background-color:#FBFBFB;
opacity:1.0; /* Opacidad 60% */
/*background-color:rgb(255,255,255);*/
border: 1px Solid #EFEFEF;
border-radius: 1px;
vertical-align:top;
box-shadow: 0px 10px 10px -6px #A8A8A8;

}

#promobox:hover {
    background-color: #F2F2F2;
    color: #000000;
}

/*------------------------------------------------------------------------------------------------------------------------------------------*/
/*Tablas para el editor. Identificadas por id*/

#tabla0 {
color: #333333;
margin:0 auto;
text-align:center;
overflow:hidden;
line-height:1.2rem;
}

#tabla0 img{
max-height:240px;
}

#tabla0 tbody{ /*Tabla completa*/
width:100%;
margin:auto;
 }
#tabla0 tr{ /*Filas*/
display:inline-block;
text-align:inherit;
width:95%;
max-width:290px;
min-height:25px;
overflow:hidden;
background-color:#ffffff;
color:#333333;
margin:5px;
margin-top:5px;
padding:10px;
font-size:0.9em;
border:0px solid #FF6699;
box-shadow: rgba(0, 0, 0, 0.1) 0px 3px 8px;
border-radius:6px;
vertical-align:top;
}
#tabla0 tr:hover{
cursor:pointer;
box-shadow: rgba(0, 0, 0, 0.50) 0px 3px 8px;
transition: 0.3s;
}
#tabla0 td{ /*Columnas*/
display:inline-block;
width:100%;
margin:0 auto;
/*background-color:#FF66CC;
color:#FFFFFF;
padding:20px;
border:1px solid #000000;
/*box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
border-radius:8px;*/
vertical-align:top;
}


/*---------------------------------------------------*/

#tabla0-1 {color:#333333;
margin:0 auto;
text-align:center;
overflow:hidden;
line-height:1.2rem;
}

#tabla0-1 img{
width:100%;
max-height:250px;
border-radius:10%;
border: solid 4px #f0f0f0;
}

#tabla0-1 tbody{ /*Tabla completa*/
width:100%;
margin:auto;
 }
#tabla0-1 tr{ /*Filas*/
display:inline-block;
text-align:inherit;
width:95%;
max-width:250px;
min-height:25px;
overflow:hidden;
background-color:#ffffff;
color:#000000;
margin:2px;
margin-top:5px;
padding:10px;
border:0px solid #FF6699;
/*box-shadow: rgba(0, 0, 0, 0.1) 0px 3px 8px;*/
border-radius:6px;
vertical-align:top;
}
#tabla0-1 tr:hover{
cursor:pointer;
box-shadow: rgba(50, 50, 93, 0.25) 0px 30px 60px -12px, rgba(0, 0, 0, 0.3) 0px 18px 36px -18px;
transition: 0.3s;
}
#tabla0-1 td{ /*Columnas*/
display:inline-block;
width:100%;
margin:0 auto;
/*background-color:#FF66CC;
color:#FFFFFF;
padding:20px;
border:1px solid #000000;
/*box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
border-radius:8px;*/
vertical-align:top;
}



/* Tablas especiales ------------------------------------------------------------------------------------------------------*/

#tabla1 {
color:#333333;
margin:0 auto;
text-align:center;
}

#tabla1 img{ /*Tabla completa*/
/*width:100%;
max-width:200px;*/
height:100%;
max-height:200px;
transition: 0.3s;
}

#tabla1 tbody{ /*Tabla completa*/
width:100%;
margin:0 auto;
 }
#tabla1 tr{ /*Filas*/
display:inline-block;
width:85%;
max-width:300px;
overflow:hidden;
background-color:#ffffff;
color:#000000;
margin:4px;
padding:15px;
border:0px solid #FF6699;
box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
border-radius:6px;
vertical-align:top;
}
#tabla1 tr:hover{
box-shadow: rgba(0, 0, 0, 0.50) 0px 3px 8px;
transition: 0.3s;
}
#tabla1 td{ /*Columnas*/
display:inline-block;
width:100%;
margin:0 auto;
/*background-color:#FF66CC;
color:#FFFFFF;
padding:20px;
border:1px solid #000000;
/*box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
border-radius:8px;*/
vertical-align:top;
}

/* Tabla 1-1 con filete sin sombra* -------------------------------------------------------*/
#tabla1-1 {
color:#333333;
margin: 0 auto;
text-align:center;
}

#tabla1-1 img{ /*Tabla completa*/
/*width:100%;
max-width:200px;*/
height:100%;
max-height:250px;
transition: 0.3s;
}

#tabla1-1 tbody{ /*Tabla completa*/
width:100%;
margin:0 auto;

 }
#tabla1-1 tr{ /*Filas*/
display:inline-block;
width:95%;
max-width:300px;
overflow:hidden;
background-color:#ffffff;
color:#000000;
margin:4px auto;
padding:15px;
border: solid 0px #FF6699;
/*box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;*/
border-radius:6px;
vertical-align:top;
}
#tabla1-1 tr:hover{
box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
/*box-shadow: rgba(0, 0, 0, 0.50) 0px 3px 8px;*/
transition: 0.3s;
}
#tabla1-1 td{ /*Columnas*/
display:inline-block;
width:100%;
margin:0 auto;
/*background-color:#FF66CC;
color:#FFFFFF;
padding:20px;
border:1px solid #000000;
/*box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
border-radius:8px;*/
vertical-align:top;
}


/* Tabla 2 asume los colores del menu ------------------------------------------------------------------------------------------------------*/
#tabla2 table{
margin:0 auto;
text-align:center;
}

#tabla2 tbody{ /*Tabla completa*/
width:100%;
margin:0 auto;
text-align:center;
 }
#tabla2 tr{ /*Filas*/
display:inline-block;
width:85%;
max-width:360px;
overflow:hidden;
background-color:#333333;
color:#ffffff;
margin:4px;
padding:10px;
border:0px solid #FF6699;
box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
border-radius:8px;
vertical-align:top;
}
#tabla2 a{
background-color:#333333;
color:#ffffff;
text-decoration:none;
}
#tabla2 tr:hover{
background-color:#333333;
color:#ffffff;
box-shadow: rgba(0, 0, 0, 0.50) 0px 3px 8px;
transition: 0.4s;
}
#tabla2 td{ /*Columnas*/
display:inline-block;
width:100%;
margin:0 auto;
vertical-align:top;
}

#tabla2 img{ /*Tabla completa*/
width:100%;
max-width:300px;
height:100%;
max-height:250px;
}

/* Tabla 3 asume los colores del menu ------------------------------------------------------------------------------------------------------*/
#tabla3 {
margin:0 auto;
text-align:center;
}

#tabla3 tbody{ /*Tabla completa*/
width:90%;
margin:0 auto;
 }
#tabla3 tr{ /*Filas*/
display:inline-block;
width:85%;
max-width:500px;
overflow:hidden;
background-color:#ffffff;
color:#333333;
margin:10px;
padding:20px;
border:1px solid #f5f5f5;
/*box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;*/
border-radius:8px;
vertical-align:top;
cursor:pointer;
transition: 0.6s;
}
#tabla3 tr:hover{
background-color:#333333;
color:#ffffff;
box-shadow: rgba(0, 0, 0, 0.50) 0px 3px 8px;
transition: 0.6s;
}
#tabla3 td{ /*Columnas*/
display:inline-block;
width:100%;
margin:0 auto;
vertical-align:top;
}

#tabla3 img{ /*Tabla completa*/
width:100%;
max-width:600px;
height:100%;
max-height:500px;
margin:0 auto;
text-align:center;
/*padding:20px;*/
}

/* Tabla 4 asume los colores del menu ------------------------------------------------------------------------------------------------------*/
#tabla4 {
margin:0 auto;
width:90%;
overflow:hidden;
}

#tabla4 tbody{ /*Tabla completa*/
margin:0 auto;
 }
  
  /* intercalado de colores
#tabla4 tbody tr:nth-child(even) {
	background: #000000;
}
*/
 
#tabla4 tr{ /*Filas*/
display:inline-block;
width:100%;
/*max-width:980px;*/
overflow:hidden;
background-color:#f4f4f4;
color:#333333;
margin:10px;
padding:8px;
border:0px solid #FF6699;
box-shadow: rgba(0, 0, 0, 0.2) 0px 3px 8px;
border-radius:0px;
vertical-align:top;
cursor:pointer;
}
#tabla4 tr:hover{
background-color:#333333;
color:#ffffff;
box-shadow: rgba(0, 0, 0, 0.40) 0px 3px 8px;
transition: 0.3s;
}
#tabla4 td{ /*Columnas*/
display:inline-block;
width:100%;
margin:0 auto;
vertical-align:top;
}

#tabla4 img{ /*Tabla completa*/
width:100%;
max-width:300px;
height:100%;
max-height:250px;
}

#tabla4-1 tr{
position: relative;
width:100%;
/*height:60px;*/
vertical-align:middle;
padding:20px 20px;
margin:0px;
background-color:#ffffff;
color:#333333;
border: 0px solid #333333;
box-shadow: rgba(0, 0, 0, 0.0) 0px 3px 8px;
transition: 0.3s;
border-bottom:1px solid #333333;
}
#tabla4-1 tr:hover{
background-color:#ffffff;
color:#333333;
box-shadow: rgba(0, 0, 0, 0.0) 0px 3px 8px;
transition: 0.3s;
border-bottom:1px solid #333333;
}


#tabla4-2 tr{
width:100%;
/*height:60px;*/
vertical-align:middle;
padding:20px 20px;
margin:0px;
/*background-color:#333333;*/
/*color:#f4f4f4;*/
border: 0px solid #333333;
box-shadow: rgba(0, 0, 0, 0.0) 0px 3px 8px;
}
#tabla4-2 tr:hover{
background-color:#333333;
color:#ffffff;
box-shadow: rgba(0, 0, 0, 0.0) 0px 3px 8px;
transition: 0.3s;
}

/* Estilo para tabla5 */
#tabla5 {
    width: 100vw; /* Hace que la tabla ocupe el 100% del ancho de la ventana */
    max-width: 100%; /* Previene que la tabla exceda el ancho del contenedor */
    border-collapse: collapse; /* Elimina espacios entre las celdas */
    margin: 0; /* Elimina margen */
    padding: 0; /* Elimina padding */
    background-color: #333333; /* Color de fondo dinámico */
    color: #ffffff; /* Color de texto dinámico */
    position: relative; /* Para ajustes de posicionamiento */
    left: 50%; /* Para centrar la tabla */
    transform: translateX(-50%); /* Ajusta para centrar completamente */
    transition: transform 0.3s ease; /* Añade una transición suave */
}

#tabla5:hover {
    transform: translateX(-50%) scale(1.05); /* Aumenta el tamaño al hacer hover */
}

#tabla5 td {
    padding: 20px; /* Espaciado interno en la celda */
    text-align: center; /* Alineación del texto al centro */
    border: 0px solid #ddd; /* Bordes de la celda */
}

#tabla5 .info-cell {
    font-size: 1.5em; /* Tamaño de fuente más grande para el contenido */
    color: #ffffff; /* Color del texto */
}

/* Tabla6 ------------------------------------------------------------------------------------------------*/

#tabla6 {
color:#333333;
margin:0 auto;
text-align:center;
}

#tabla6 img{ /*Tabla completa*/
/*width:100%;
max-width:200px;*/
height:100%;
max-height:200px;
transition: 0.3s;
}

#tabla6 tbody{ /*Tabla completa*/
width:100%;
margin:0 auto;
 }
 
#tabla6 tr{ /*Filas*/
display:inline-block;
width:80%;
max-width:300px;
overflow:hidden;
background-color:#ffffff;
color:#000000;
margin:15px;
padding:20px;
line-height: 1.4em;
border:0px solid #FF6699;
box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
border-radius:8px;
vertical-align:top;
text-align:left;
}
#tabla6 tr:hover{
box-shadow: rgba(0, 0, 0, 0.50) 0px 3px 8px;
transition: 0.3s;
}
#tabla6 td{ /*Columnas*/
display:inline-block;
width:100%;
margin:0 auto;
/*background-color:#FF66CC;
color:#FFFFFF;
padding:20px;
border:1px solid #000000;
/*box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
border-radius:8px;*/
vertical-align:top;
}


/*----------------------------------------------------------------------------------------------------------------------*/

#tabla-precios {
            width: 90%;
            border-collapse: collapse;
			border-radius: 10px;
			box-shadow: rgba(0, 0, 0, 0.16) 0px 10px 36px 0px, rgba(0, 0, 0, 0.06) 0px 0px 0px 1px;
			
        }
        #tabla-precios th, 
        #tabla-precios td {
            border: 1px solid #ddd;
            padding: 8px;
            text-align: center;
        }
        #tabla-precios th {
            background-color: #333333;
			color:#ffffff;
        }
        #tabla-precios td.hidden {
            visibility: hidden;
            border: none;
        }
		
		/* Eliminar el borde de la primera columna en la última fila */
        #tabla-precios tr:last-child td:first-child {
            border: none !important;
			font-size:1.2em;
        }

        /* Estilos para pantallas pequeñas */
        @media screen and (max-width: 600px) {
            #tabla-precios {
                border: 0;
				font-size:0.9em;
				
            }
            
        }


#tablaHR{width:100%;margin:0 auto;border-bottom: 1px solid #D4D4D4;padding:4px;}
#tablaAviso{width:100%;margin:0;border-bottom: 1px solid #D4D4D4;padding:10px;background-color:#f4f4f4;}

.tabla-imagenes {
	margin: 0 auto;
	padding:4px;
	}
	
	.tabla-imagenes img {
	text-align:center;
	vertical-align:middle;
	padding:2px;
	border: 0px solid #000000;
	}


/*Otros elementos*/
#youtube {width:90%;max-width:900px;height:100vh;max-height:450px;margin:4px;border-radius:8px;box-shadow: rgba(0, 0, 0, 0.38) 0px 3px 8px;}
#youtube300 {display:inline-block;width:90%;max-width:300px;height:100vh;max-height:280px;margin:4px;border-radius:8px;box-shadow: rgba(0, 0, 0, 0.38) 0px 3px 8px;}
#youtube500 {display:inline-block;width:90%;max-width:500px;height:100vh;max-height:400px;margin:4px;border-radius:8px;box-shadow: rgba(0, 0, 0, 0.38) 0px 3px 8px;}

#imgBlog {display:inline-block;border-radius:0px;padding:1px;box-shadow: rgba(0, 0, 0, 0.3) 0px 5px 9px;transition: transform .2s;}
#imgBlog:hover {transform: scale(1.2);}

#eframeH300 {width:90%;max-height:300px;box-shadow: rgba(0, 0, 0, 0.3) 0px 5px 9px;padding:8px;}

@media (max-width: 980px) {
#tabla1 {width:100%;min-width:280px;margin:0 auto;float:left;padding:0px;}
#tabla1-1 {width:100%;min-width:280px;margin:0 auto;float:left;padding:0px;}
		#tabla1-1 img{width:90%;}
#tabla2 {width:100%;min-width:280px;margin:0 auto;float:left;padding:0px;}
#tabla3 {position:absolute;left:-100px;width:90%;margin:0;padding:0px;border:0px solid #f4f4f4;}
		#tabla3 tr{width:80%;box-shadow: rgba(0, 0, 0, 0.0) 0px 3px 8px;border:2px solid #f5f5f5;}
		#tabla3 img{ /*Tabla completa*/
			position:absolute;
			width:100%;
			max-width:500px;
			height:100%;
			max-height:350px;
			margin:0 auto;
			padding:0px;
}
#eframeH300 {width:90%;max-height:100px;}

}

 /* Estilo básico para el texto sin borde*/
 	 
    .barra-hover {
      /*font-size: 20px;*/
      font-weight: bold;
	  text-decoration:none;
      color: #000000;
	  background-color: #ffffff; /* Color de la barra */
	  margin: 2px;
	  border: solid 0px #000000;
	  border-radius:8px;
	  padding:2px 2px 2px 2px;
      position: relative;
      display: inline-block;
      padding-bottom: 5px; /* Espacio para la barra */
      transition: color 0.3s ease; /* Transición suave del color */
    }

    /* Barra que aparece al hacer hover */
    .barra-hover::after {
      content: "";
      position: absolute;
      left: 0;
      bottom: 0;
      width: 100%;
      height: 2px;
      background-color: #000000; /* Color de la barra */
      transform: scaleX(0);
      transform-origin: bottom right;
      transition: transform 0.3s ease-out; /* Efecto de la barra */
    }

    /* Efecto hover: hace que la barra se expanda */
    .barra-hover:hover {
      color: #000000; /* Cambio de color al hacer hover */
    }

    .barra-hover:hover::after {
      transform: scaleX(1); /* Expande la barra */
      transform-origin: bottom left;
    }
	
	/* Estilo básico para el texto con borde*/
 	 
    .barra-hover-borde {
      font-size: 20px;
      font-weight: bold;
      color: #000000;
	  background-color: #ffffff; /* Color de la barra */
	  margin: 2px;
	  border: solid 1px #000000;
	  border-radius:8px;
	  padding:2px 20px 4px 8px;
      position: relative;
      display: inline-block;
      padding-bottom: 5px; /* Espacio para la barra */
      transition: color 0.3s ease; /* Transición suave del color */
    }

    /* Barra que aparece al hacer hover */
    .barra-hover-borde::after {
      content: "";
      position: absolute;
      left: 0;
      bottom: 0;
      width: 100%;
      height: 2px;
      background-color: #000000; /* Color de la barra */
      transform: scaleX(0);
      transform-origin: bottom right;
      transition: transform 0.3s ease-out; /* Efecto de la barra */
    }

    /* Efecto hover-borde: hace que la barra se expanda */
    .barra-hover-borde:hover {
      color: #000000; /* Cambio de color al hacer hover */
    }

    .barra-hover-borde:hover::after {
      transform: scaleX(1); /* Expande la barra */
      transform-origin: bottom left;
    }

/* Estilos Imagenes */

	.imagen1 {
	vertical-align:middle;
	padding:2px;
	border: 0px solid #000000;
	}
