/*RESET*/
*{
  margin: 0;
  padding: 0;
  font-family: Verdana, Geneva, Tahoma, sans-serif;
}
/*HEADER*/
header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1000; /* Evita que otros elementos tapen la barra */
  height: 35px;
  background: #146430;
  padding: 0 150px;
  color: #fff;
  display: flex;/*orden, uno a lado de otro*/
  justify-content: flex-start;/*separacion de palabras*/
  align-items: center;/*centra en horizontal*/
}
img.logo {
  width: 120px;
  left: auto;
  position: absolute;
  top: 10;
  left: 0;
}
.buscador {
  display: flex;
  align-items: center;
  margin-left: 0px;
}
.buscador input[type="text"] {
  width: 220px;
  padding: 7px 12px;
  border: none;
  outline: none;
  font-size: 14px;
}
.buscador button {
  padding: 7px 16px;
  border: none;
  background: #e1a50b;
  color: #fff;
  cursor: pointer;
  font-size: 14px;
}
.buscador button:hover {
  background: #c48f08;
}
nav {/*fondo de textos*/
  background-color: #146430;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 14px;
}
nav ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}
nav ul li {
  display: inline-block;
  position: relative;
}
nav ul li a {
  display: block;
  padding: 15px 20px;
  text-decoration: none;
  color: #fff;
}
nav ul li a:hover {
  background-color: #555555;
}
nav ul li:hover>ul {
  display: block;
}
nav ul ul {
  display: none;
  position: absolute;
  background-color: #555;
}
nav ul ul li {
  display: block;
}
nav ul ul li a {
  padding: 10px 20px;
  margin-bottom: 4px;
}
.menu a{
  color: #fff;
  text-decoration: none;/*quita subrrayado*/
  padding: 0 10px;
  transition: 0.4s;
}
.mostrar-menu, 
.esconder-menu {
  font-size: 30px;
  cursor: pointer;
  display: none;
  transition: 0.4s;
}
.mostrar-menu{
  order:1;
}
.menu a:hover,
.mostrar-menu,
.esconder-menu:hover{
  color: #e1a50b;
}
#check{
  display: none;
}

/*RESPONSIVE para tablet*/
@media(max-width: 768px){
  /*HEADER*/
  header{
    height: 36px;
    padding: 0 8px 0 0;
    justify-content: flex-start;
  }
  img.logo{
    position: static;
    height: 30px;
    width: 120px;
    align-self: flex-start;
    margin: 3px 0 0 0;
  }
.buscador{
    flex: 1;
    max-width: 220px;
    min-width: 5px;
    margin: 0 0 0 2px;
  }
  .buscador input[type="text"]{
    width: 100%;
    min-width: 0;
    padding: 5px 10px;
    font-size: 18px;/*texto en busqueda*/
  }
  .buscador button{
    padding: 7px 8px;
    font-size: 14px;
    flex-shrink: 0;
  }
  .mostrar-menu,
  .esconder-menu{
    display: block;
  }
  .mostrar-menu{
    flex-shrink: 0;
    font-size: 42px;
    line-height: 1;
    margin-left: 48px;
  }
  .menu{
    position: fixed;
    width: 100%;
    height: 100vh;
    background: #146430;
    /*left: 0; solo era para ver como estaba quedando*/
    right: -100%;/*este estaba comenrado*/
    top: 0;
    text-align: center;/*alinea en persiana*/
    padding: 100px 0px; 
    z-index: 100;
    transition: 0.8s;
  }
  .menu a{
    display: block;
    padding: 20px;

  }
  .esconder-menu{
    position: absolute;
    top: 40px;
    right: 40px;
  }
  #check:checked ~ .menu{
    right: 0;
  }
}