@media only screen and (max-width: 400px) {
    :root {
      --nav-padding: 0px;
      --nav-ancho-buscador: 100%;
    }
  }
  @media only screen and (min-width: 401px) and (max-width: 700px) {
    :root {
        --nav-padding: 5px;
        --nav-ancho-buscador: 100%;
    }
  }
  @media only screen and (min-width: 701px) and (max-width: 1200px) {
    :root {
        --nav-padding: 10px;
        --nav-ancho-buscador: 30%;
    }
  }
  @media only screen and (min-width: 1201px) {
    :root {
        --nav-padding: 15px;
        --nav-ancho-buscador: 31%;
    }
  }
#menuleromemeron {
    width: 100%;
    color: #d8f602;
    position: relative;
    border-top:0px solid;
    }

    .navMenu{
        width: 100%;
        padding: var(--nav-padding);
        margin: 0px;
        display: flex;
        align-items: center;
        justify-content: center;
        background: linear-gradient(0deg, rgba(0,0,0,0.5), rgba(22,61,31,0.5), rgba(0,148,41,0.25)); 
    }
    #menuleromemerin {
    background: rgba(0,0,0,0.5);
    color: #d8f602;
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    }
    #menuleromemerin ul {
    float: left;
    list-style: none;
    margin: 0;
    padding: 0;
    }
    #menuleromemerin li {
    background: #000000;
    color: #A86212;
    list-style: none;
    margin: 0;
    padding: 0;
    font-size: 1.1em;
    border-left:1px solid #333;
    border-right:1px solid #333;
    }
    #menuleromemerin li a, #menuleromemerin li a:link, #menuleromemerin li a:visited {
    color: #FFF;
    display: block;
    font:normal 12px Helvetica, sans-serif; margin: 0;
    padding: 9px 12px 10px 12px;
    text-decoration: none;
    font-size: 1.1rem;
    }
    #menuleromemerin li a:hover, #menuleromemerin li a:active {
    background: #A86212;
    color: #0a0a0a;
    display: block;
    text-decoration: none;
    margin: 0;
    padding: 9px 12px 10px 12px;
    font-size: 1.12rem;
    }
    #menuleromemerin li {
    float: left;
    padding: 0;
    }
    #menuleromemerin li ul {
    z-index: 9999;
    position: absolute;
    left: -999em;
    height: auto;
    width: 160px;
    margin: 0;
    padding: 0;
    }
    #menuleromemerin li ul a {
    width: 140px;
    }
    #menuleromemerin li ul ul {
    margin: -25px 0 0 161px;
    }
    #menuleromemerin li:hover ul ul, #menuleromemerin li:hover ul ul ul, #menuleromemerin li.sfhover ul ul, #menuleromemerin li.sfhover ul ul ul { left: -999em;
    }
    #menuleromemerin li:hover ul, #menuleromemerin li li:hover ul, #menuleromemerin li li li:hover ul, #menuleromemerin li.sfhover ul, #menuleromemerin li li.sfhover ul, #menuleromemerin li li li.sfhover ul {
    left: auto;
    }
    #menuleromemerin li:hover, #menuleromemerin li.sfhover {
    position: static;
    }
    #menuleromemerin li li a, #menuleromemerin li li a:link, #menuleromemerin li li a:visited {
    background: #CE7115;
    width: 150px;
    color: #FFF;
    display: block;
    font:normal 12px Helvetica, sans-serif;
    margin: 0;
    padding: 9px 12px 10px 12px;
    text-decoration: none;
    z-index:9999;
    border-bottom:1px dotted #333;
    font-size: 1.1rem;
    }
    #menuleromemerin li li a:hover, #menuleromemerinli li a:active {
    background: #CE4015;
    color: #FFF;
    display: block; margin: 0;
    padding: 9px 12px 10px 12px;
    text-decoration: none;
    font-size: 1.12rem;
    }
    .buscador{
        background: linear-gradient(0deg, rgba(0,0,0,0.3),  rgba(0,0,0,0.5),  rgba(0,0,0,0.7)); 
        color: rgba(255,255,255,0.8);
        display: flex;
    }
    .liBuscador{
        width: var(--nav-ancho-buscador);
    }
    .lupa{
        background: linear-gradient(0deg, rgba(0,0,0,0.3),  rgba(0,0,0,0.5),  rgba(0,0,0,0.3)); 
    }
    .lupa:hover{
        background: linear-gradient(0deg, rgba(250,200,0,0.3),  rgba(250,200,0,0.5),  rgba(250,200,0,0.3)); 
    }
    .lupa:active{
        background: linear-gradient(0deg, rgba(250,100,0,0.3),  rgba(250,100,0,0.5),  rgba(250,100,0,0.3)); 
    }
    input[type=search] {
        position:relative;
        width: 50%;
        box-sizing: border-box;
        border: 2px solid #ccc;
        border-radius: 4px;
        font-size: 16px;
        background-color: white;
        background-position: 10px 10px; 
        background-repeat: no-repeat;
        padding: 12px 20px 12px 40px;
        -webkit-transition: width 0.4s ease-in-out;
        transition: width 0.4s ease-in-out;
        margin-left: auto;
      }
      input[type=search]:focus {
        width: 100%;
      }