/* ---------------------------- Header Nav ------------------------------------- */
body {
  background-color: #fff;
}

#main-body {
  margin-top: 30px !important;
}

.amx-header-container {
  -webkit-box-shadow: 0px -2px 10px 5px rgba(0,0,0,0.16);
  -moz-box-shadow: 0px -2px 10px 5px rgba(0,0,0,0.16);
  box-shadow: 0px -2px 10px 5px rgba(0,0,0,0.16);
}

.amx-nav-top {
  background: #fff;
  color: #232323;
  font-weight: 500;
  font-size: 1.6rem;
  font-family: 'Montserrat',Helvetica,Arial,Lucida,sans-serif;
  padding-top: 5px;
  padding-bottom: 5px;
  display: flex;
  border-bottom: 1px solid #d8d8d8;
}

.amx-nav-top a {
  color: #6e6e6e;
}

.amx-nav-top a:hover,
.amx-nav-top a:focus {
  color: #df4661;
  text-decoration: none;
}

.amx-nav-top ul {
  list-style: none;
  padding: 5px 0;
  margin: 0;
  display: flex;
  margin-left: auto;
}

.amx-nav-top li {
  margin-left: 40px;
  margin-right: 40px;
}

.amx-boton-carrito,
.amx-boton-salir {
  color: white !important;
  font-size: 1.6rem;
  background: #df4661;
  padding: 7px 60px;
  border-radius: 22px;
  margin-top: 5px;
  margin-bottom: 5px;
}

.amx-boton-carrito:hover,
.amx-boton-salir:hover {
  background: #fa6b85;
}

.amx-nav-mid {
  display: flex;
  align-items: center;
  padding: 10px;
  background: #fff;
  padding-left: 10rem;
  padding-right: 10rem;
}

.amx-nav-mid a {
  font-size: 1.5rem;
  color: #6A6A6A;
  font-weight: 600;
}

.amx-nav-mid a:hover,
.amx-nav-mid a:focus {
  text-decoration: none;
  color: #000;
}

.amx-header-logo img {
  height: 7rem;
}

.amx-nav-mid-primary,
.amx-nav-mid-secondary {
  list-style: none;
  display: flex;
  margin: 0;
  padding: 0;
  margin-left: 60px;
  height: 100%;
}

.amx-nav-mid-secondary {
  margin-left: auto;
}

.amx-nav-mid-primary li a,
.amx-nav-mid-secondary li a {
  padding: 34px 20px;
}

.amx-nav-mid-primary li a:hover,
.amx-nav-mid-primary li a:focus,
.amx-nav-mid-secondary li a:hover,
.amx-nav-mid-secondary li a:focus {
  background: #119ad7;
}

.amx-nav-mid-primary li a:hover,
.amx-nav-mid-primary li a:focus,
.amx-nav-mid-secondary li a:hover,
.amx-nav-mid-secondary li a:focus {
  text-decoration: none;
}

.label-info {
    background-color: transparent;
    color: #df4661;
}

.amx-mobile-menu,
.amx-mobile-menu-close {
  display: none;
}

.amx-nav-mid-mobile {
  display: none;
}

.amx-nav-mid-mobile-active {
  display: block !important;
  transition: all 1s ease-out;
}

@media (max-width: 1508px) {
  .amx-nav-mid a {
    font-size: 1.5rem;
  }

  .amx-nav-mid-primary li a,
  .amx-nav-mid-secondary li a {
    padding: 35px 10px;
  }
}

@media (max-width: 1350px) {
  .amx-nav-mid {
    padding-left: 7rem;
    padding-right: 7rem;
  }
}

@media (max-width: 1320px) {
  .amx-nav-mid-primary {
    margin-left: 25px;
  }

  .amx-nav-mid {
    padding-left: 6rem;
    padding-right: 6rem;
  }
}

@media (max-width: 1250px) {
  .amx-nav-mid {
    padding-left: 5rem;
    padding-right: 5rem;
  }

  .amx-nav-mid-primary {
    margin-left: 15px;
  }
}

@media (max-width: 1200px) {
  .amx-mobile-menu,
  .amx-mobile-menu-close {
    display: inline-block;
  }

  .amx-boton-activo {
    width: auto;
    margin-left: auto;
    margin-right: 1rem;
  }

  .amx-boton-oculto {
    display: none;
  }

  .amx-nav-mid-primary,
  .amx-nav-mid-secondary {
    display: none;
  }

  .amx-mobile-menu i,
  .amx-mobile-menu-close i {
    font-size: 3rem;
  }

  .amx-mobile-menu:hover i,
  .amx-mobile-menu-close:hover i {
    color: #df4661;
  }

  .amx-nav-mid-mobile {
    display: none;
    transition: all 1s ease-out;
    background: rgb(70,45,188);
    background: linear-gradient(156deg, rgba(70,45,188,1) 0%, rgba(77,48,216,1) 36%, rgba(71,101,213,1) 77%);
    padding: 0;
    margin: 0;
  }

  .amx-nav-mid-mobile a {
    color: white;
  }

  .amx-nav-mid-mobile-primary,
  .amx-nav-mid-mobile-secondary {
    list-style: none;
    margin: 0;
    padding: 0;
  }

  .amx-nav-mid-mobile-primary li a,
  .amx-nav-mid-mobile-secondary li a {
    display: inline-block;
    width: 100%;
    padding: 10px 45px;
    font-weight: 600;
  }

  .amx-nav-mid-mobile-primary li a:hover,
  .amx-nav-mid-mobile-primary li a:focus,
  .amx-nav-mid-mobile-secondary li a:hover,
  .amx-nav-mid-mobile-secondary li a:focus {
    /* background: #4D30D8; */
    /* background: rgba(77, 48, 216, 0.7); */
    background: rgba(71,101,213,0.7);
    text-decoration: none;
  }

  .amx-nav-mid-mobile-secondary {
    margin-top: 10px;
  }

  .dropdown-menu {
    width: 100%;
    background-image: url(https://dev.servnet.mx/wp-content/uploads/2020/11/menu-background.jpg)!important
  }

  .dropdown-menu li {
    padding: 5px 5px;
  }

  .dropdown-menu li a {
    padding-top: 0;
    padding-bottom: 0;
  }

  .dropdown-menu li:hover {
    background: transparent;
  }

  .dropdown-menu li a:hover {
    color: #df4661;
    background: transparent;
  }
}

@media (max-width: 710px) {

  .amx-nav-top {
    flex-direction: column;
    font-size: 1.4rem;
  }

  .amx-nav-top ul {
    margin-left: 0;
    flex-direction: column;
    align-items: center;
  }

  .amx-nav-top li {
    margin: 5px 0;
  }

  .amx-boton-carrito
  .amx-boton-salir {
    font-size: 1.2rem;
  }

  .amx-boton-carrito-li,
  .amx-boton-salir-li {
    margin-top: 10px !important;
  }

  .amx-header-logo img {
    height: 6rem;
  }
}

/*----------------------------------------------------------------------------*/

.amx-nav-mid-primary .dropdown-menu {
  width: 500px;
  left: -100px;
  top: 50px;
  background-image: url(https://dev.servnet.mx/wp-content/uploads/2020/11/menu-background.jpg)!important
}

.amx-nav-mid-secondary .dropdown-menu {
  width: 300px;
  left: -200px;
  top: 50px;
  background-image: url(https://dev.servnet.mx/wp-content/uploads/2020/11/menu-background.jpg)!important
}

.amx-nav-mid-primary .dropdown-menu li,
.amx-nav-mid-secondary .dropdown-menu li {
  padding: 5px 5px;
}

.amx-nav-mid-primary .dropdown-menu li a,
.amx-nav-mid-secondary .dropdown-menu li a {
  padding-top: 0;
  padding-bottom: 0;
}

.amx-nav-mid-primary .dropdown-menu li:hover,
.amx-nav-mid-secondary .dropdown-menu li:hover {
  background: transparent;
}

.amx-nav-mid-primary .dropdown-menu li a:hover,
.amx-nav-mid-secondary .dropdown-menu li a:hover {
  color: #df4661;
  background: transparent;
}

.nav-divider {
  border-bottom: 1px solid #ddd;
}

.nav-divider a {
  display: none !important;
}

/*----------------------------------------------------------------------------*/

.amx-social-icons {
  display: flex;
  list-style: none;
}

.amx-social-icons li a {
  border: 1px solid #fff;
  width: 50px;
  height: 50px;
  margin-right: 20px;
  border-radius: 25px;
  display: inline-block;
  background-color: aliceblue;
}

.amx-social-icons li a:hover {
  text-decoration: none;
  transition: all .3s ease-in-out;
  background-color: #df4661;
  border-color: #df4661;
}

.amx-social-icons li a:hover::before {
  
  color: aliceblue;
}

.amx-link-fb::before {
  font-family: "Font Awesome 5 Brands";
  content: "\f39e";
  font-size: 28px;
  position: relative;
  top: 4px;
  left: 15px;
  color: #483698;
}

.amx-link-linkedin::before {
  font-family: "Font Awesome 5 Brands";
  content: "\f0e1";
  font-size: 28px;
  position: relative;
  top: 4px;
  left: 12px;
  color: #483698;
}

.amx-link-insta::before {
  font-family: "Font Awesome 5 Brands";
  content: "\f16d";
  font-size: 28px;
  position: relative;
  top: 4px;
  left: 12px;
  color: #483698;
}

/*----------------------------------------------------------------------------*/

.amx-dropdown:hover .amx-dropdown-options {
  display: flex;
  visibility: visible;
  opacity: 1;
  transition: opacity .3s ease-in-out;
}

.amx-dropdown-options-inside {
  flex: 1 1 auto;
  border-right: 1px dotted #BBB;
  padding: 0 5rem;
}

.amx-dropdown-options-inside:last-child {
  border-right: none;
}

.amx-dropdown-options {
  position: absolute;
  width: 90%;
  left: 5%;
  top: 125px;
  visibility: hidden;
  background-color: #fff;
  background-image: url(https://www.servnet.mx/wp-content/uploads/2020/11/menu-background.jpg)!important;
  z-index: 10;
  padding: 3rem 10rem;
  -webkit-box-shadow: 0px 4px 20px 0px rgba(0,0,0,0.16);
  -moz-box-shadow: 0px 4px 20px 0px rgba(0,0,0,0.16);
  box-shadow: 0px 4px 20px 0px rgba(0,0,0,0.16);
  opacity: 0;
}

.amx-dropdown-link {
  display: block;
  padding: 5px !important;
}

.amx-dropdown-link:hover {
  color: #df4661 !important;
  background: transparent !important;
}