{% set naranja = '#ef5122' %}
{% set grisClaro = '#dddddf' %}
{% set grisOscuro = '#425364' %}
{% set gris = '#a8aaad' %}

@font-face {
  font-family: Chapaza;
  src: url('https://f.hubspotusercontent40.net/hubfs/6409895/Tipografia/Chapaza.woff');
}

.menu {
  text-transform: uppercase;
  letter-spacing: 3px;
  font-size: 14px;
}
.menu__list {
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  align-items: center;
  margin: 17px 0;
}
.menu__option,
.submenu__option {
  list-style: none;
}
.ab-2022 .menu > ul.menu__list > li.menu__option > a {
  text-decoration: none;
  color: #fff;
}

.ab-2022 contentSubmenu2 {
padding: 20px 0 0 !important;
}
.submenu__option a {
  text-decoration: none;
  color: #000;
}

/* menu animacion */
.menu__list li.menu__option > a {
  background-image: linear-gradient(
    to right,
    rgba(0, 0, 0, 0.9) 0%,
    rgba(0, 0, 0, 0.9) 100%
  );
  background-repeat: no-repeat;
  background-position: 0% 65%;
  background-size: 0% 2px;
  transition: background-size 0.3s;
  color:#000;
}

.ab-2022 .menu__list li.menu__option > a {
    background-image: linear-gradient( to right, #FFF 0%, #fff 100% );
}



.menu__list li.menu__option a:hover {
  background-size: 100% 2px;
}
/* menu animacion */

.option--orange a {
  color: #000000;
  font-family: 'Avenir Heavy';
  font-size: 10px !important;
}

li.menu__option.optionSubmenu--hover:hover .contentSubmenu,
li.menu__option.optionSubmenu--hover:hover .contentSubmenu2 {
  visibility: visible;
}
.optionSubmenu--hover > a,
.menu__option--hover a {
  padding: 25% 0;
}
/*
.contentSubmenu {
  justify-content: space-around;
  align-items: baseline;
  position: fixed;
  width: 75%;
  left: 12.5%;
  background-color: rgba(255, 255, 255, 0.8);
  margin: 29px 0 0 0;
  padding: 15px 2% 15px 0;
  visibility: hidden;
  display: flex;
}
*/

.contentSubmenu,
.contentSubmenu2{
  display: flex;
  flex-direction: column;
  /* justify-content: space-around;
  align-items: baseline; */
  position: fixed;
  /* Valores de width y left originales */
  width: 100%;
  left: 0%;
  background-color: rgba(255, 255, 255, 0.9);
  margin: 29px 0 0 0;
  /*padding: 15px 15% 0;*/
  visibility: hidden;
}

.contentSubmenu .listSubmenu {
    padding: 0 0 20px;
}
ul.submenu__list{
  min-width: 250px;
}

.submenu__list .submenu__option {
  padding: 3px 0;
}
.contentSubmenu .listSubmenu > .submenu__list:nth-child(2)::before,
.contentSubmenu .listSubmenu > .submenu__list:nth-child(3)::before,
.contentSubmenu .listSubmenu > .submenu__list:nth-child(4)::before {
  content: '';
  position: absolute;
  background-color: #a8aaad;
  width: 1px;
  height: 90%;
  top: 0;
  margin-left: -2%;
}

li.submenu__option:hover a {
  color: #000000;
}

.contentNational,
.contentInternational,
.listSubmenu{
  display: flex;
  flex-direction: row;
  width: 75%;
  margin: 0 auto;
}

.contentNational .title,
.contentInternational .title {
  min-width: 160px;
  font-family: 'Chapaza', san-serif;
  padding: 10px 0 0;
}

.contentNational .submenuNational,
.contentInternational .submenuInternational {
  display: flex;
  justify-content: space-around;
  align-items: baseline;
}

.contentInternational {
  margin: 25px auto;
}

.ab-2022 .contentSubmenu2, .ab-2022 .contentSubmenu {
  padding-top:20px;
}

.contentSubmenu2 .submenuNational > .submenu__list:nth-child(1)::before,
.contentSubmenu2 .submenuNational > .submenu__list:nth-child(2)::before,
.contentSubmenu2 .submenuNational > .submenu__list:nth-child(3)::before,
.contentSubmenu2 .submenuNational > .submenu__list:nth-child(4)::before {
  content: '';
  position: absolute;
  background-color: #a8aaad;
  width: 1px;
  /*height: 40%;  aplica cuando estan las opciones internacionales */
  height: 65%;    /* aplica cuando solo esta claudio coello */
  top: -5px;
  margin-top: 15px;
  margin-left: -1.5%;
}

.contentSubmenu2 .submenuInternational > .submenu__list:nth-child(1)::before,
.contentSubmenu2 .submenuInternational > .submenu__list:nth-child(2)::before{
  content: '';
  position: absolute;
  background-color: #a8aaad;
  width: 1px;
  /*height: 50%;   aplica a todas las opciones internacionales */
  height: 25%;    /* solo para claudio coello */
  bottom: 4%;
  margin-top: 15px;
  margin-left: -1.5%;
}
.referidos #ab-header,
.hs-content-id-22896293371 #ab-header{
    background-color: #000 !important;
}
.referidos #ab-header.headerBlanco,
.hs-content-id-22896293371 #ab-header.headerBlanco {
    background-color: rgba(255,255,255,0.9) !important;
}