/* 20210306 Degui: maquetado cabecera */

/*
* muestra la pagina en diferentes tamaño de pantallas
* http://www.responsinator.com/
*/

/* 20210621 responsive */
@media (max-width: 800px) {
  .header-principal-info {
	  display:none;
  } 
  .header-principal-central {
	  display:none;
  } 
  .header-cel-top{
	  display:block;z-index:90;width:100%;
  }
  .header-cel-central {
	  background-color:#ffeb3b;z-index:90;width:100%;
	  display:block;
  }
  .header-principal-menu-h {
	  background-color:#FFBF00;width:100%;z-index:90;
  }
}
@media (min-width: 800px) {
  .header-principal-info {
	  display:block;
  }
  .header-principal-central{
	  display:block;
	  background-color:#ffeb3b;z-index:90;1top:0px;width:100%;
  }
   .header-cel-top{
	  display:none;
  } 
  .header-cel-central {
	  display:none;
  } 
  .header-principal-menu-h {
	  background-color:#FFBF00;width:100%;z-index:90;height:55px;
  }
  .header-principal-menu-h > container{
	  background-color:#FFBF00;
	  height:55px;
  }
}
/* usado para fijar la cabecera */
.fijar-heder-principal{position:fixed; top:0;}

/* Boton buscar productos */
.botonBuscarPrincipal {
      background-color: #3498DB; 
      color: #EEE;
      size: 5px;
      width: 100%;
      height: 34px;
}

/* Formulario emergente para login */
.frmLoginPrincipal{
	display:none;position:absolute;z-index:100;background-color:#f6f6f6;padding:10px;opacity:0.9;
}

/* ---------- Buscador Cel desplegable con transiciones solo CSS [ini] ---------- */
#divBuscarCel{
  display:inline;
  font-size:1em;
  border-radius: 8em;
  /*border:0.1em solid rgba(218,208,190,1);*/
  border:0.1em solid rgba(46,134,193,1);
  box-shadow:0 0 0.3em rgba(60,60,60,0.4);
  padding:0.5em;
  background:white;
}
#txtBuscarCel{
  1transition:all 0.2s ease-out;
  width:80%;
  border-radius:0;
  box-shadow:none;
  outline: none;
  padding:0;
  margin:0;
  border:0;
  1background-color: transparent;
  1opacity:0;
}
#txtBuscarCel:focus{
  1width:11em;
  1opacity:1;
}
#lblBuscarCel{
  padding-left: 1px;
  display:inline-block;
  margin-top:0.4em;
  /*color:rgba(218,208,190,1);*/
  color:rgba(46,134,193,1);
  text-shadow:0 0 0.1em rgba(60,60,60,0.3);
  position: relative;
  1left:0.1em;
}
/* ---------- Buscador desplegable con transiciones solo CSS [fin] ---------- */

/* Menu Head */
nav#menuH ul ul {
    1display: none;
    1position: absolute;
    1top:100%;
    1margin:0;
    1padding:2px 0 0 4px;
}
nav#menuH ul li:hover > ul {
    1display: block;
}
nav#menuH ul {
    1background: #000;
    1box-shadow: 0px 0px 8px rgba(0,0,0,0.15);
    list-style: none;
    1position: relative;
    display: inline-table;
    padding:0px;  /* ajuste de caja */
    margin:4px;   /* ajuste de caja */
}
nav#menuH ul li {
    float: left;
}
nav#menuH ul li a:hover{
    color: #FFF;
}
nav#menuH ul li a {
    display: block; 
    padding: 0px 8px; /* espacio entre palabras */
    color: #7E5109;
    text-decoration: none;
    font-size:1em;
    font-family: arial, serif, verdana;
}
nav#menuH ul ul li{
    1float:none;
    1position: relative;
}
nav#menuH ul ul ul {
    1position: absolute; 
    1left: 100%; 
    1top:0;
    1width:130px;
}

/* ### menu categoria [ini] ### */
.menuCategoria {
  position: relative;
  display: inline-block;
}

.menuCategoria-btn {
  /*background-color: #f4d03f;*/
  background-color: #fff176;
  color: #6495ED;
  padding: 16px;
  font-size: 16px;
  border: none;
  cursor: pointer;
}

.menuCategoria2-btn {
  background-color: #ffeb3b;
  color: #6495ED;
  padding: 16px;
  font-size: 16px;
  border: none;
  cursor: pointer;
}

.menuCategoria-content {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  1min-width: 81.5em;
  min-width: 71.5em;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  padding:25px;
  z-index:100;
}

/*.menuCategoria:hover .menuCategoria-content {
  display: block;
}*/

.menuCategoria:hover .menuCategoria-btn {
  background-color: #f9f9f9;
  /*color: #2E86C1;*/
  color: #1E90FF;
}

.menuCategoria2:hover .menuCategoria2-btn {
  background-color: #f9f9f9;
  /*color: #2E86C1;*/
  color: #1E90FF;
}

.efectoMenuAero-panel-opLogin {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  min-width: 10.5em;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  padding:20px;
  z-index:100;
}

.menuCategoria2:hover .efectoMenuAero-panel-opLogin {
  display: block;
}

.menuCategoriaCel-content {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  min-width: 50em;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  padding:20px;
  z-index:100;
}


/* ### menu categoria [fin] ### */


/* 20250104 Degui: icono X */
.fa.fa-twitter{
	font-family:sans-serif;
}
.fa.fa-twitter::before{
	content:"𝕏";
	font-size:1.2em;
}
