.header {
  z-index  : 997;
  position : relative;
}

.header.is-overlay {
  position : absolute;
  top      : 0;
  right    : 0;
  left     : 0;
}

.header.is-overlay .header_container {
  background-color : transparent;
}

.header.is-sticky .header_container {
  position           : absolute;
  top                : 0;
  right              : 0;
  left               : 0;
  -moz-transition    : all 0.1s linear;
  -ms-transition     : all 0.1s linear;
  -o-transition      : all 0.1s linear;
  -webkit-transition : all 0.1s linear;
  transition         : all 0.1s linear;
}

.header.is-sticky-active .header_container {
  position                    : fixed;
  border-bottom-color         : var( --color-secondary );
  -moz-box-shadow             : 0 5px 20px rgba(186, 189, 165, 0.2);
  -webkit-box-shadow          : 0 5px 20px rgba(186, 189, 165, 0.2);
  box-shadow                  : 0 5px 20px rgba(186, 189, 165, 0.2);
  -webkit-animation-duration  : 0.5s;
  animation-duration          : 0.5s;
  -webkit-animation-fill-mode : both;
  animation-fill-mode         : both;
  -webkit-animation-name      : ntrHeaderSticky;
  animation-name              : ntrHeaderSticky;
}

.header.header-fixed,
.header.header-fixed .header_container {
  position : fixed;
}

.header.is-sticky-active.is-overlay .header_container {
  background-color : var( --color-dark );
}

.header_container {
  position : relative;
}

.header_menu {
  display     : flex;
  align-items : center;
}

.header_menu_item:not(:first-child) {
  margin-left : 30px;
}

.header_menu_link {
  display     : flex;
  color       : var( --color-text );
  align-items : center;
}

.header_menu_link:hover {
  color : var( --color-primary );
}

.header_menu_link_icon {
  font-size : 24px;
  flex      : 0 0 auto;
}

.header_nav_mega,
.header_nav_sub {
  background-color : var( --color-white );
}

.header_nav ul li {
  position : relative;
  margin-top: -1px;
}

.header_nav ul li.has-sub ul li {
  border-top : 1px solid var( --color-secondary );
}

.header_nav ul li.has-sub ul li:hover {
  border-color : transparent;
}

.header_nav li a {
  display       : block;
  position      : relative;
  color         : var( --color-dark );
  overflow      : hidden;
  text-overflow : ellipsis;
  white-space   : nowrap;
}

.header_nav ul li:hover > a {
  color : var( --color-white );
}

.header_nav ul li > a > .button_text {
  z-index            : 2;
  position           : relative;
  color              : inherit;
  -webkit-transition : all .8s;
  transition         : all .8s;
}

.header_nav ul li:hover > a > .button_text {
  color : inherit;
}

.header_nav ul li > a:after {
  content            : '';
  position           : absolute;
  top                : -10px;
  right              : -10px;
  bottom             : 100%;
  left               : -10px;
  border-radius      : 0 0 100% 100%/0 0 100% 100%;
  background         : var( --color-secondary );
  -webkit-transition : all 0.6s cubic-bezier(1, 0, 0.55, 1);
  transition         : all 0.6s cubic-bezier(1, 0, 0.55, 1);
}

.header_nav ul li:hover > a:after {
  bottom        : -10px;
  border-radius : 0;
}

@media
  (max-width : 1024px) {
  .header_nav {
    z-index             : 997;
    position            : fixed;
    top                 : 0;
    left                : -100%;
    width               : 300px;
    height              : 100vh;
    overflow            : auto;
    border-right        : 1px solid var( --color-secondary );
    background-color    : var( --color-white );
    background-repeat   : no-repeat;
    background-position : right bottom;
    background-size     : 100%;
    -moz-box-shadow     : 5px 0 20px rgba(186, 189, 165, 0.2);
    -webkit-box-shadow  : 5px 0 20px rgba(186, 189, 165, 0.2);
    box-shadow          : 5px 0 20px rgba(186, 189, 165, 0.2);
    -moz-transition     : left 0.3s linear;
    -ms-transition      : left 0.3s linear;
    -o-transition       : left 0.3s linear;
    -webkit-transition  : left 0.3s linear;
    transition          : left 0.3s linear;
  }
  
  .admin-bar .header_nav {
    top : 32px;
  }
    .admin-bar .wixi_nav.is-sticky.is-sticky-active .header_nav {
        top: 0;
    }
  .header_nav.is-active {
    left : 0;
  }
  
  .header_nav_close {
    display          : flex;
    height           : 50px;
    padding-left     : 30px;
    background-color : var(--color-white);
    align-items      : center;
    justify-content  : space-between;
  }
  
  .header_nav_close_icon {
    width      : 50px;
    text-align : center;
    font-size  : 12px;
  }
  
  .header_nav_arrow {
    display         : flex;
    position        : absolute;
    top             : 0;
    right           : 0;
    width           : 50px;
    height          : 50px;
    align-items     : center;
    font-size       : 14px;
    justify-content : center;
    cursor          : pointer;
  }
  
  .header_nav_arrow:hover {
    background : var( --color-dark );
  }
  
  .header_nav_arrow:hover .icon {
    color : var( --color-white );
  }
  
  .header_nav_arrow .icon {
    display         : flex;
    align-items     : center;
    justify-content : center;
  }
  
  .header_nav_arrow .icon::after {
    z-index            : 1;
    position           : absolute;
    color              : inherit;
    text-align         : center;
    font-family        : 'Font Awesome 5 Free';
    font-size          : 13px;
    font-weight        : 900;
    -webkit-transition : all 400ms linear;
    transition         : all 400ms linear;
  }
  
  .is-arrow-up2::after {
    content : '\f077';
  }
  
  .is-arrow-down2::after {
    content : '\f078';
  }
  
  .header_nav ul li,
  .header_nav ul li.has-sub ul li:first-child {
    border-top : 1px solid var( --color-secondary );
  }
  
  .header_nav > ul.header_nav_items > li:last-child {
    border-bottom : 1px solid var( --color-secondary );
  }
  
  .header_nav ul li.has-sub ul li:last-child {
    border-bottom : 0;
  }
  
  .header_nav_mega,
  .header_nav_sub {
    display : none;
  }
  
  .header_nav li.has-mega.is-active > .header_nav_sub,
  .header_nav li.has-sub.is-active > .header_nav_sub {
    display : block;
  }
  
  .header_nav li a {
    height        : 50px;
    padding-right : 50px;
    padding-left  : 30px;
    line-height   : 50px;
  }
  
  .header_nav li.is-active > a {
    color : var( --color-dark );
  }
  
  .header_nav > ul > li.has-sub .header_nav_sub ul li a {
    padding-left : 50px;
  }
  
  .header_nav ul li:hover {
    border : 0;
  }
  
.header_nav_toggle.menu-toggle {
    display      : flex;
    margin-right : 0;
    margin-left  : 0;
    align-items  : center;
    cursor       : pointer;
    right        : 0;
    color        : #fff;
}
  
  .header_nav_toggle.menu-toggle .icon {
    display      : table-cell;
    margin-right : 6px;
  }
  
  .header_nav_toggle.menu-toggle .icon i {
    display    : block;
    width      : 20px;
    height     : 3px;
    margin     : 4px 0;
    background : #fff;
  }
  
  .menu-toggle:hover .icon i {
    margin             : 8px 0;
    -webkit-transition : all .3s;
    transition         : all .3s;
  }
}

@media
  ( max-width : 767px ) {
}

@media
  ( min-width : 576px ) {
  .header_menu {
    margin-left : auto;
  }
}

@media
  (min-width : 768px ) {
}

@media
  ( min-width : 1024px ) {
  .header_nav li.has-sub {
    position : relative;
  }
  
  .header_nav li.has-sub:hover {
    z-index : 1;
  }
  
  .header_nav li.has-sub:hover > .header_nav_sub {
    display : block;
  }
  
  .header_nav li.has-mega:hover > .header_nav_mega {
    display : block;
  }
  
  .header_nav > ul {
    display   : flex;
    margin    : 0;
    flex-wrap : wrap;
  }
  
  .header_nav ul li.has-sub ul li:first-child {
    border-top : 0;
  }
  
  .header_nav ul li > a {
    padding   : 10px 20px;
    font-size : 16px;
  }
  
  .header_nav ul li.has-sub ul li a {
    color : var( --color-dark );
  }
  
  .header_nav > ul > li > .header_nav_sub {
    top  : 100%;
    left : 0;
  }
  
  .header_nav > ul > li > .header_nav_sub .header_nav_sub {
    top          : -10px;
    left         : 100%;
    padding-left : 20px;
  }
  
  .header_nav_toggle {
    display : none;
  }
  
  .header_nav_close {
    display : none;
  }
  
  .header_nav_arrow {
    display : none;
  }
  
  .header_nav_mega,
  .header_nav_sub {
    display  : none;
    position : absolute;
  }
  
  .header_nav_sub ul li > a {
    display     : block;
    padding     : 10px 20px;
    font-size   : 14px;
    white-space : nowrap;
  }
  
  .header_nav_mega,
  .header_nav_sub > ul {
    min-width        : 160px;
    background-color : var(--color-white );
  }
  
  .header_nav_mega {
    top     : 100%;
    right   : 0;
    left    : 0;
    padding : 30px;
  }
  
  .header_nav_mega_menu_item:not(:first-child) {
    margin-top : 10px;
  }
}

@-webkit-keyframes ntrHeaderSticky {
  from {
    -webkit-transform : translate3d(0, -100%, 0);
    transform         : translate3d(0, -100%, 0);
  }
  
  to {
    -webkit-transform : translate3d(0, 0, 0);
    transform         : translate3d(0, 0, 0);
  }
}

@keyframes ntrHeaderSticky {
  from {
    -webkit-transform : translate3d(0, -100%, 0);
    transform         : translate3d(0, -100%, 0);
  }
  
  to {
    -webkit-transform : translate3d(0, 0, 0);
    transform         : translate3d(0, 0, 0);
  }
}
.header_nav .splitting .whitespace {
    width: 5px;
}
.header_nav ul li:hover > a > span > span > .char {
  -webkit-animation       : fadeInUp2 0.3s cubic-bezier(0.3, 0, 0.7, 1) both;
  animation               : fadeInUp2 0.3s cubic-bezier(0.3, 0, 0.7, 1) both;
  -webkit-animation-delay : calc(30ms * var(--char-index));
  animation-delay         : calc(30ms * var(--char-index));
}

.header_nav ul li.has-sub:hover .header_nav_sub ul li {
  -webkit-animation       : fadeInUp2 0.3s cubic-bezier(0.3, 0, 0.7, 1) both;
  animation               : fadeInUp2 0.3s cubic-bezier(0.3, 0, 0.7, 1) both;
  -webkit-animation-delay : calc(30ms * var(--char-index));
  animation-delay         : calc(30ms * var(--char-index));
}

.wixi_nav .menu-toggle:hover .char {
  -webkit-animation       : fadeInUp2 0.3s cubic-bezier(0.3, 0, 0.7, 1) both;
  animation               : fadeInUp2 0.3s cubic-bezier(0.3, 0, 0.7, 1) both;
  -webkit-animation-delay : calc(30ms * var(--char-index));
  animation-delay         : calc(30ms * var(--char-index));
}
