/*MENU y SUBMENU*/
.navbar {
  padding: 0;
}
#menu {
  /* background-color: var(--menu-bg-color) !important ; */
  /* background-color: transparent !important ; */
  background-image: url("../images/stm_bg_menu.jpg") !important;

  background: radial-gradient(
    ellipse farthest-corner at 50% 90%,
    #ec530f,
    #ec530f 10%,
    #ec530f 70%,
    #d04100
  ); /*Test GRadial Gradient*/
}
#menu1 {
  background-image: url("../images/HOME/STMS_Home_DuxPlus_BG.jpg") !important;
}
#menu2 {
  background-color: var(--menu-bg-color-education) !important;
}

#menu ul li a,
#menu i,
.textFooter,
.txtMenuLogo,
#menu1 ul li a,
#menu1 i {
  color: var(--menu-txt-color);
}
#menu ul i,
.socialMedia i,
.subMenuSticky a,
.subMenuNoSticky a,
.shoppingCart,
#menu1 ul i {
  /* margin: 10px; */
  margin: 5px 5px;
}
#menu ul li.active a,
#menu ul li a:hover,
#menu1 ul li.active a,
#menu1 ul li a:hover {
  text-decoration: underline;
  color: var(--menu-txt-color-active);
}
#ulMainMenu {
  margin: auto;
}
.nav-barleft {
  margin-left: auto !important;
}
#ulMainMenu a {
  font-size: 0.79em;
  font-family: GoboldLowPLus;
  padding: 0.5em 1em;
  letter-spacing: 1.8px;
}
.mainMenuSticky {
  position: sticky;
  top: 0;
  z-index: 1000;
}
.subMenuSticky {
  position: sticky;
  top: 0;
  background: transparent;
  text-align: center;
  z-index: 1000;
  border-bottom: 1px solid var(--border-color-sm);
  background: rgba(255, 255, 255, 0.85);
  backdrop-filter: blur(10px);
  padding: 0em;
}
.subMenuNoSticky {
  position: relative;
  top: 0;
  background: transparent;
  text-align: center;
  z-index: 1000;
  border-bottom: 1px solid var(--border-color-sm);
  background: rgba(255, 255, 255, 0.85);
  backdrop-filter: blur(10px);
  padding: 0em;
}

.subMenuSticky a,
.subMenuNoSticky a,
#ulSubMenu li a,
#Submenu a {
  color: var(--submenu-txt-color);
  font-family: GoboldLowPLus;
  font-size: 0.77em;
  letter-spacing: 1.8px;
}
.subMenuSticky a:hover,
.subMenuNoSticky a:hover,
#ulSubMenu li a:hover,
#Submenu a:hover {
  color: gray;
  text-decoration: underline;
}
#Submenu button {
  /* margin-left: 30%; */
  /* margin-left: 23%; */
  width: auto;
}
.subMenuSticky .infoSubMenu,
.subMenuNoSticky .infoSubMenu {
  margin: auto;
  align-items: center;
  padding: 0;
}
.navbar-brand {
  margin-left: 1em;
}
#divShoppinCart {
  margin-right: 1rem;
}
.logoImg {
  width: 25px;
  height: 40px;
}
.txtMenuLogo img {
  width: 180px;
  height: 40px;
}
.txtMenuSTM img {
  width: 80px;
  height: 40px;
}

.imgSubMenu {
  width: 20px;
  height: 20px;
}
/*SUBMENU HLP*/
#ulSubMenuPowerHLP {
  margin: auto;
  height: 16vh;
}
.NavItemSubMenuPowerHLP {
  position: relative;
}
.NavItemSubMenuPowerHLP ul {
  list-style: none;
  text-align: left;
  margin: 10% 0;
}
.linkNavItemPowerHLP2 {
  display: flex !important;
  height: 0 !important;
}
.linkNavItemPowerHLP figure {
  display: flex;
  position: relative;
}
.elementListNavItemPowerHLP {
  font-family: "Gnuolane_RG" !important;
  color: #9a9a9a !important;
}

.titleSubMenuHLP:hover{
  text-decoration: none !important;
}


.titleListNavItemPowerHLP {
  color: #8e908f !important;
}
.divPowerChargers {
  top: 0;
}
.divAccesories {
  top: 0;
}
/*FIN SUBMENU HLP*/

/* @media only screen and (max-width: 600px){
 .logoImg{
  width: 25px; 
  height: 40px; 
 }
 .txtMenuLogo{
  display: none;
 }
 }
@media only screen and (min-width: 768px){
 .logoImg{
  width: 25px; 
  height: 40px; 
 }
 .txtMenuLogo{
  display: none;
 }
}
@media only screen and (min-width: 1200px){
 .logoImg{
  width: 25px; 
  height: 40px; 
 }
 .txtMenuLogo{
  display: contents;
  width: 180px;
  height: 40px;
 }
 .navbar-brand{
  padding-top: 2px;
  padding-bottom: 2px;
 }
} */

@media only screen and (min-width: 768px) {
  .txtMenuLogo {
    display: contents;
  }
  .txtMenuSTM {
    display: none;
  }
  .txtMenuSTM {
    display: none;
  }
}

@media only screen and (max-width: 767px) {
  .txtMenuLogo {
    display: none;
  }
  .txtMenuSTM {
    display: none;
  }
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 1) and (-webkit-min-device-pixel-ratio: 2) {
  .txtMenuLogo {
    display: none;
  }
  .txtMenuSTM {
    display: contents;
  }
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 1) and (-webkit-min-device-pixel-ratio: 2) {
  .txtMenuLogo {
    display: contents;
  }
  .txtMenuSTM {
    display: none;
  }
}
