#masthead {
   position:fixed!important;
  z-index:99999;
   width:100%;
  top:0;
  left:0;
}




ul#primary-menu {
  display: flex;
margin-bottom:10px;
  
}
ul#primary-menu > li > a {
  text-transform: uppercase;
}

.nav-search-cont{
    flex-direction:column;
  }
  

@media (min-width: 910px) {
    .min-910-hidden{
        display:none!important;
    }
  .nav-search-cont{
    flex-direction:column-reverse;
  }
    #toogle-main-menu{
        display:flex!important;
    }
  #toogle-main-menu-button {
    display: none;
  }
  ul#primary-menu {
    gap: 20px;
    justify-content: space-between;
  }
  #toogle-main-menu {
    justify-content: center;
    padding-left: 36px;
  }
  ul.sub-menu ul.sub-menu {
    flex-direction: column !important;
    /* padding: 20px; */
    margin: 0px !important;
  }
  ul.sub-menu a[title="_categorys"] ~ ul {
    background-color: #f7f7f7;
  }
  ul.sub-menu a[title="_categorys"] ~ ul > li > a {
    height: 70px !important;
    width: 250px !important;
    display: flex !important;
    align-items: center !important;
    padding: 0 10px !important ;
    font-size: 20px !important;
    color: white !important;
    background-color: rgb(177, 176, 176) !important;
  }
  ul.sub-menu a[title="_categorys"] ~ ul > li {
    margin-bottom: 2px;
  }
  ul.sub-menu a[title="_categorys"] {
    display: none !important;
  }

  ul#primary-menu > li > ul.sub-menu {
    padding: 20px;
    /* background-color: red; */
  }
  /* ul#primary-menu > li > ul.sub-menu::before {
    content: "";
    position: absolute;
    top: -40px;
    left: 50%;
    width: 250px;
    transform: translateX(-50%);
    height: 60px;
    background-color: red;
    z-index: 1;

  } */
  ul#primary-menu > li > ul.sub-menu {
    position: relative;
    display: none;
    position: absolute;
    top: 40px;
    left: 50%;
    transform: translateX(-50%);
    background-color: white;
    /*z-index: 1;*/
    /* width: 100%; */
    /* padding: 10px; */
    z-index: 9222;
    margin: 0;
    padding-top: 30px;
    border-radius: 4px;
  }
  ul#primary-menu > li:hover > a::after {
    content: "";
    position: absolute;
    bottom: -2px;
    left: 50%;
    transform: translateX(-50%);
    width: 20px;
    height: 2px;
    background-color: #be9600;
  }
  ul#primary-menu > li:hover > a {
    font-weight: bold;
    position: relative;
  }

  ul#primary-menu li:hover ul.sub-menu {
    display: flex;
  }

  ul.sub-menu a[title="colors"] ~ ul.sub-menu li a span {
    margin-top: 3px;
  }
  ul.sub-menu a[title="colors"] ~ ul.sub-menu li a {
    display: flex;
    justify-content: start;
    align-items: center;
  }

  a[title="parent_mega_dropdown"] ~ ul.sub-menu > li > a {
    display: block;
    padding: 20px;
    font-weight: bold;
    text-transform: uppercase;
  }

  /* a[title="parent_mega_dropdown"] ~ ul.sub-menu > li>ul{
  border-left: none!important;
  } */

  a[title~="_categorys"] ~ ul.sub-menu {
    padding: 5px !important;
  }
  a[title="parent_mega_dropdown"] ~ ul.sub-menu > li ul {
    padding: 20px;
    border-left: 2px solid #f7f7f7;
    display: none;
  }

  /*   */

  a[title="links_and_banner"] ~ ul.sub-menu {
    padding: 20px;
    background-color: white;
    display: flex;
    justify-content: space-between;
  }
  a[title="links_and_banner"] ~ ul.sub-menu > li:last-of-type {
    color: transparent !important;
    padding: 20px;
  }
    a[title="links_and_banner"] ~ ul.sub-menu > li:first-of-type {
width:300px;
  }
  a[title="links_and_banner"] ~ ul.sub-menu > li:first-of-type > a {
    display: block;
    padding-top: 20px;
    padding-bottom: 20px;

    font-weight: bold;
    text-transform: uppercase;
  }

  a[title="banner_image"] {
    color: transparent !important;
    pointer-events: none !important;
    width: 400px !important;
    height: 250px !important;
    display: block;
  }
a[title="contact"] {
    display: none;
  
  
  }
}  

@media (max-width: 910px) {
    .smoth-hidden{
    opacity:0!important;
    transform:translateX(-200%)!important;
}
masthead nav{
    /*height:100pximportant;*/
}

  /* hide search button on responsive  */

.toggle-search-modal,.custom-search-close{
  display:none!important;
}

ul#primary-menu {
  display: flex;
  
}
ul#primary-menu > li > a {
  text-transform: uppercase;
}
  

.nav-search-cont{
    flex-direction:column;
  }

@media (min-width: 910px) {
  .nav-search-cont{
    flex-direction:column-reverse;
  }
  .min-910-hidden{
      display:none;
  }
    #toogle-main-menu{
        display:flex!important;
    }
  #toogle-main-menu-button {
    display: none;
  }
  ul#primary-menu {
    gap: 20px;
    justify-content: space-between;
  }
  #toogle-main-menu {
    justify-content: center;
    padding-left: 36px;
  }
  ul.sub-menu ul.sub-menu {
    flex-direction: column !important;
    /* padding: 20px; */
    margin: 0px !important;
  }
  ul.sub-menu a[title="_categorys"] ~ ul {
    background-color: #f7f7f7;
  }
  ul.sub-menu a[title="_categorys"] ~ ul > li > a {
    height: 70px !important;
    width: 250px !important;
    display: flex !important;
    align-items: center !important;
    padding: 0 10px !important ;
    font-size: 20px !important;
    color: white !important;
    background-color: rgb(177, 176, 176) !important;
  }
  ul.sub-menu a[title="_categorys"] ~ ul > li {
    margin-bottom: 2px;
  }
  ul.sub-menu a[title="_categorys"] {
    display: none !important;
  }

  ul#primary-menu > li > ul.sub-menu {
    padding: 20px;
    /* background-color: red; */
  }
  /* ul#primary-menu > li > ul.sub-menu::before {
    content: "";
    position: absolute;
    top: -40px;
    left: 50%;
    width: 250px;
    transform: translateX(-50%);
    height: 60px;
    background-color: red;
    z-index: 1;

  } */
  ul#primary-menu > li > ul.sub-menu {
    position: relative;
    display: none;
    position: absolute;
    top: 40px;
    left: 50%;
    transform: translateX(-50%);
    background-color: white;
    z-index: 1;
    /* width: 100%; */
    /* padding: 10px; */
    z-index: 222;
    margin: 0;
    padding-top: 30px;
    border-radius: 4px;
  }
  ul#primary-menu > li:hover > a::after {
    content: "";
    position: absolute;
    bottom: -2px;
    left: 50%;
    transform: translateX(-50%);
    width: 20px;
    height: 2px;
    background-color: #be9600;
  }
  ul#primary-menu > li:hover > a {
    font-weight: bold;
    position: relative;
  }

  ul#primary-menu li:hover ul.sub-menu {
    display: flex;
  }

  ul.sub-menu a[title="colors"] ~ ul.sub-menu li a span {
    margin-top: 3px;
  }
  ul.sub-menu a[title="colors"] ~ ul.sub-menu li a {
    display: flex;
    justify-content: start;
    align-items: center;
  }

  a[title="parent_mega_dropdown"] ~ ul.sub-menu > li > a {
    display: block;
    padding: 20px;
    font-weight: bold;
    text-transform: uppercase;
  }

  /* a[title="parent_mega_dropdown"] ~ ul.sub-menu > li>ul{
  border-left: none!important;
  } */

  a[title~="_categorys"] ~ ul.sub-menu {
    padding: 5px !important;
  }
  a[title="parent_mega_dropdown"] ~ ul.sub-menu > li ul {
    padding: 20px;
    border-left: 2px solid #f7f7f7;
    display: none;
  }

  /*   */

  a[title="links_and_banner"] ~ ul.sub-menu {
    padding: 20px;
    background-color: white;
    display: flex;
    justify-content: space-between;
  }
  a[title="links_and_banner"] ~ ul.sub-menu > li:last-of-type {
    color: transparent !important;
    padding: 20px;
  }
    a[title="links_and_banner"] ~ ul.sub-menu > li:first-of-type {
width:300px;
  }
  a[title="links_and_banner"] ~ ul.sub-menu > li:first-of-type > a {
    display: block;
    padding-top: 20px;
    padding-bottom: 20px;

    font-weight: bold;
    text-transform: uppercase;
  }

  a[title="banner_image"] {
    color: transparent !important;
    pointer-events: none !important;
    width: 400px !important;
    height: 250px !important;
    display: block;
  }
a[title="contact"] {
    display: none;
  
  
  }
}  

 
a[title="bar"]:hover :after{
    z-index:-222!important;
}


@media (max-width: 910px) {
    
    .smoth-hidden{
    opacity:0!important;
    transform:translateX(-200%)!important;
}
.overflow-hidden-max-910{
    overflow:hidden!important;
}
  a[title="contact"] {
  display:block;
  }
    
    #masthead nav{
    height:70pximportant;
}
  ul.sub-menu a[title="_categorys"] {
    display: none !important;
  }
    ul.sub-menu a[title="_categorys"] ~ ul{
      display:none!important;
    }
  .max-910-hidden {
    display: none;
  }

  a[title="banner_image"],
  a[title="bar"] {
    display: none;
  }

  ul#primary-menu {
    flex-direction: column;
    gap: 10px;
    justify-content: start;
    z-index:90000000022;
    
  }
  /* azulajos > attr lists */
  a[title="parent_mega_dropdown"] ~ ul.sub-menu > li > ul.sub-menu > li > a {
    background: none !important;
    color: black !important;
  }
  a[title="parent_mega_dropdown"] ~ ul.sub-menu > li > ul.sub-menu,
  a[title="links_and_banner"] ~ ul.sub-menu > li > ul.sub-menu {
    display: none;
  }
  a[title="links_and_banner"] ~ ul.sub-menu > li > a,
  a[title="parent_mega_dropdown"] ~ ul.sub-menu > li > a {
    /* font-weight: bold; */
    text-transform: uppercase;
    position: relative;
  }
  a[title="links_and_banner"] ~ ul.sub-menu > li > a::after,
  a[title="parent_mega_dropdown"] ~ ul.sub-menu > li > a::after {
    content: "";
    background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="3" stroke="currentColor" class="size-6"><path stroke-linecap="round" stroke-linejoin="round" d="m19.5 8.25-7.5 7.5-7.5-7.5" /></svg>')
      no-repeat center;
    width: 14px;
    height: 14px;
    font-weight: bold;
    position: absolute;
    right: -20px;
    top: 50%;
    transform: translateY(-50%);
  }
  
  .smoth-hidden{
      opacity:0;
      transform:translate();
  }
  ul.sub-menu.show {
    display: block !important;
  }

  #toogle-main-menu {
    padding-left: 50px;
    flex-direction:column;
    align-items:start;
    padding-top: 21px;
    position: absolute;
    background: #ffffffed;
    width: 100%;
    height: 100%;
    overflow-y: auto;
    top: 55px;
    left: 0;
    /* transform: translateX(-200%); */
    transition: all .5s;
    z-index: 4444;
  }
}

  a[title="contact"] {
  display:block;
  }
    
    #masthead nav{
    height:70pximportant;
    position: relative;
}

  .max-960-hidden {
    display: none;
  }

  a[title="banner_image"],
  a[title="bar"] {
    display: none;
  }

  ul#primary-menu {
    flex-direction: column;
    gap: 10px;
    justify-content: start;
    
  }
  /* azulajos > attr lists */
  a[title="parent_mega_dropdown"] ~ ul.sub-menu > li > ul.sub-menu > li > a {
    background: none !important;
    color: black !important;
  }
  a[title="parent_mega_dropdown"] ~ ul.sub-menu > li > ul.sub-menu,
  a[title="links_and_banner"] ~ ul.sub-menu > li > ul.sub-menu {
    display: none;
  }
  a[title="links_and_banner"] ~ ul.sub-menu > li > a,
  a[title="parent_mega_dropdown"] ~ ul.sub-menu > li > a {
    /* font-weight: bold; */
    text-transform: uppercase;
    position: relative;
  }
  a[title="links_and_banner"] ~ ul.sub-menu > li > a::after,
  a[title="parent_mega_dropdown"] ~ ul.sub-menu > li > a::after {
    content: "";
    background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="3" stroke="currentColor" class="size-6"><path stroke-linecap="round" stroke-linejoin="round" d="m19.5 8.25-7.5 7.5-7.5-7.5" /></svg>')
      no-repeat center;
    width: 14px;
    height: 14px;
    font-weight: bold;
    position: absolute;
    right: -20px;
    top: 50%;
    transform: translateY(-50%);
  }
  
  .smoth-hidden{
      opacity:0;
      transform:translate();
  }
  ul.sub-menu.show {
    display: block !important;
  }

  #toogle-main-menu {
    padding-left: 50px;
    flex-direction:column;
    align-items:start;
    padding-top: 71px;
    position: absolute;
    background: #ffffffed;
    width: 100%;
    height: 100vh;
    /* overflow-y: auto; */
    top: 55px;
    left: 0;
    /* transform: translateX(-200%); */
    transition: all .5s;
    z-index: 999999999;
  }
}

 ul#primary-menu > li#remove-border-on-hover{
    pointer-events:none;
}




a[title="otros"] span{
   background:url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTUiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNSAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHJlY3QgeT0iMC41IiB3aWR0aD0iMTUiIGhlaWdodD0iMTUiIHJ4PSI1IiBmaWxsPSJ1cmwoI3BhaW50MF9saW5lYXJfNTE3XzYwMykiLz4KPHJlY3QgeD0iMSIgeT0iMS41IiB3aWR0aD0iMTMiIGhlaWdodD0iMTMiIHJ4PSI0IiBzdHJva2U9ImJsYWNrIiBzdHJva2Utb3BhY2l0eT0iMC4wOCIgc3Ryb2tlLXdpZHRoPSIyIi8+CjxkZWZzPgo8bGluZWFyR3JhZGllbnQgaWQ9InBhaW50MF9saW5lYXJfNTE3XzYwMyIgeDE9IjcuNSIgeTE9IjAuNSIgeDI9IjcuNSIgeTI9IjE1LjUiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIj4KPHN0b3Agc3RvcC1jb2xvcj0iI0UzQ0JCMSIvPgo8c3RvcCBvZmZzZXQ9IjAuMjMzMjMyIiBzdG9wLWNvbG9yPSJ3aGl0ZSIvPgo8c3RvcCBvZmZzZXQ9IjAuNDkyMzU0IiBzdG9wLWNvbG9yPSIjRDhEOEQ4Ii8+CjxzdG9wIG9mZnNldD0iMC43MzA0NjYiIHN0b3AtY29sb3I9IiNCMzdBNUMiLz4KPHN0b3Agb2Zmc2V0PSIxIiBzdG9wLWNvbG9yPSIjRjBGMEYwIi8+CjwvbGluZWFyR3JhZGllbnQ+CjwvZGVmcz4KPC9zdmc+Cg==");
 background-size:cover;
 background-position:center;
}