/* Variables */
:root {
  --primary-color: #30A936;
  --secondary-color: #455A64;
  --hero-bg-color: #F0F0F3;
  --badge-bg-color: #98BC57;
  --yellow-color: #ECEA8E;
  --dark-gray: #263238;
  ;
}

.visibility-hidden {
  visibility: hidden !important;
}

body.hc-nav-open {
  position: static;
}

.hc-offcanvas-nav {
  font-family: 'Asap', sans-serif;
}

.hc-offcanvas-nav::after {
  background: none;
}

.hc-offcanvas-nav.disable-body.nav-open::after {
  visibility: hidden;
}

.hc-offcanvas-nav.hc-nav-1 .nav-container {
  width: 384px !important;
}

.hc-offcanvas-nav.hc-nav-1.nav-position-left .nav-container {
  background: url("../img/nav-bg.png") no-repeat;
  background-size: 100% 100%;
}

/* .hc-offcanvas-nav.hc-nav-1.nav-position-left .nav-container {
  background-image: url("data:image/svg+xml,%3Csvg width='384' height='100%' viewBox='0 0 384 1080' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 0H384C384 0 337.184 254 337.184 544.5C337.184 835 384 1080 384 1080H0V0Z' fill='%23455A64'/%3E%3C/svg%3E");
  background-repeat: no-repeat no-repeat;
  background-position: center right;
  background-size: cover;
} */

.hc-offcanvas-nav .nav-wrapper {
  position: relative;
}

.hc-offcanvas-nav a.nav-next:before {
  content: '';
  display: none;
}

.hc-offcanvas-nav .nav-wrapper-1 {
  width: 360px;
}

.hc-offcanvas-nav .nav-wrapper.nav-wrapper-0>.nav-content {
  background: none !important;
  padding-right: 60px;
}

.hc-offcanvas-nav .nav-wrapper.nav-wrapper-0::after {
  background: url("../img/nav-bg-dark.png") no-repeat;
  background-size: 100% 100%;
}

.hc-offcanvas-nav .nav-content {
  border-right: 1px solid #263238d5;
}

.hc-offcanvas-nav .nav-wrapper-0>.nav-content {
  border-right: none;
}

.hc-offcanvas-nav .nav-item-wrapper {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.hc-offcanvas-nav .nav-content>h2:first-child,
.hc-offcanvas-nav .ul-title .nav-item-link,
.hc-nav-1-nav-title-link h2 {
  font-size: 18px;
  font-weight: 700;
}

.hc-offcanvas-nav li:not(.custom-content) a {
  display: inline-block;
  border-radius: 50px;
  padding: 0px 10px !important;
  position: static;
  transition: .4s;
}

.nav-link-text {
  border-radius: 50px;
  padding: 0px 10px !important;
  transition: .4s;
}

.nav-link-text:hover {
  background: var(--dark-gray) !important;
}

.nav-item-link.no-hover:hover {
  background: none !important;
}

.hc-offcanvas-nav .nav-wrapper>.nav-content>ul:not(:last-child) {
  border: none;
}

.hc-nav-1-nav-title-link {
  color: var(--yellow-color);
}

.hc-nav-1-nav-title-link h2 {
  padding: 12px;
}

.hc-offcanvas-nav .nav-back a.nav-back-button,
.hc-offcanvas-nav .ul-title .nav-item-link {
  color: white;
}

.hc-offcanvas-nav li:not(.ul-title) {
  padding-left: 16px;
}

.hc-offcanvas-nav.nav-position-left.nav-open.nav-levels-overlap .nav-wrapper {
  box-shadow: none;
}

.hc-offcanvas-nav .nav-wrapper,
.hc-offcanvas-nav ul {
  background: none;
}

.hc-offcanvas-nav .nav-content>.nav-close {
  position: static;
}

.hc-offcanvas-nav .nav-title+.nav-close a:not(.has-label) {
  width: 48px;
  height: 48px;
  background: var(--primary-color);
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  right: 0;
  z-index: 10000;
}

.nav-back-button:hover {
  background: none !important;
}

.hc-offcanvas-nav li:not(.custom-content) a:not(.nav-back a):hover {
  background: var(--dark-gray);
}

.hc-offcanvas-nav:not(.touch-device) li:not(.nav-item-custom) .nav-next,
.hc-offcanvas-nav .nav-back a span {
  transition: .6s;
  right: 0;
}

.hc-offcanvas-nav .nav-back a.nav-back-button {
  display: flex;
  justify-content: space-between;
}

.hc-offcanvas-nav .nav-back a span {
  right: 20px;
  transform: rotate(180deg);
  position: relative;
  border-radius: 40%;
}

.hc-offcanvas-nav .nav-close-button span::before,
.hc-offcanvas-nav .nav-close-button span::after {
  content: none;
}

.hc-offcanvas-nav .nav-close-button span {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24' viewBox='0 -960 960 960' width='24'%3E%3Cpath fill='white' d='m256-200-56-56 224-224-224-224 56-56 224 224 224-224 56 56-224 224 224 224-56 56-224-224-224 224Z'/%3E%3C/svg%3E");
  background-repeat: no-repeat no-repeat;
  background-position: center center;
  background-size: cover;
  width: 36px;
  height: 36px;
  position: static;
  display: block;
}

#hc-nav-1 a,
#hc-nav-1 span {
  border: none;
}

#hc-nav-1 a {
  font-size: 18px;
  padding: 0;
}

#hc-nav-1 li {
  width: 100%;
}

#hc-nav-1 .nav-content {
  /* position: relative; */
  padding-top: 140px;
}

#hc-nav-1 .nav-close-button {
  width: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  background: var(--primary-color);
  border-radius: 50%;
  position: absolute;
  top: 32px;
  right: -18px;
}

#main-nav-desktop {
  display: none;
}

#navigation-menu * a  {
  color: white;
}

#navigation-menu * span  {
  color: white;
}


#navigation-menu .toggle {
  background: var(--primary-color);
  width: 64px;
  height: 64px;
  border-radius: 50%;
  top: 24px;
  left: 24px;
}

#nav-mobile-toggle .toggle {
  background: var(--primary-color);
  width: 64px;
  height: 64px;
  border-radius: 50%;
  top: -30px;
  right: 24px;
}


#navigation-menu .toggle span,
#navigation-menu .toggle span::before,
#navigation-menu .toggle span::after,
#nav-mobile-toggle .toggle span,
#nav-mobile-toggle .toggle span::before,
#nav-mobile-toggle .toggle span::after {
  left: 50%;
  transform: translateX(-50%);
  background: white;
  border-radius: 50px;
}

.nav-back {
  position: absolute;
  top: 20px;
  width: 100%;
  display: flex;
  justify-content: space-between;
}

.nav-back-button {
  text-decoration: underline !important;
}

.hc-offcanvas-nav .nav-back {
  top: 50px;
}
.hc-offcanvas-nav .nav-back .back-text {
  text-decoration: underline;
  cursor: pointer;
}

.hc-offcanvas-nav .nav-back a {
  top: 50%;
  transform: translateY(-50%);
}

#hc-nav-1 .nav-next {
  width: 35px;
  height: 24px;
  top: 50%;
  transform: translateY(-50%);
  transition: .4s;
  border-radius: 40%;
}

#hc-nav-1 .nav-next:hover {
  background: var(--dark-gray);
}

#hc-nav-1 .nav-next span {
  display: flex;
}

.hc-offcanvas-nav .nav-back a span::before,
#hc-nav-1 .nav-next span::before {
  content: '';
  background-image: url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 12 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.56423 6.75824H1.2896C1.07679 6.75824 0.897194 6.68505 0.750817 6.53867C0.604439 6.39229 0.53125 6.21271 0.53125 5.99991C0.53125 5.78711 0.604439 5.60752 0.750817 5.46114C0.897194 5.31476 1.07679 5.24157 1.2896 5.24157H8.56423L5.453 2.13034C5.30107 1.9784 5.22721 1.80027 5.23143 1.59592C5.23567 1.39158 5.31375 1.21344 5.46568 1.0615C5.61762 0.920682 5.79575 0.848155 6.0001 0.843921C6.20444 0.839699 6.38258 0.913555 6.53452 1.06549L10.9345 5.46549C11.0092 5.54012 11.0637 5.62297 11.0981 5.71404C11.1325 5.80509 11.1497 5.90038 11.1497 5.99991C11.1497 6.09943 11.1325 6.19472 11.0981 6.28577C11.0637 6.37684 11.0092 6.45969 10.9345 6.53432L6.53053 10.9383C6.38705 11.0818 6.21169 11.1535 6.00445 11.1535C5.7972 11.1535 5.61762 11.0818 5.46568 10.9383C5.31375 10.7864 5.23778 10.6061 5.23778 10.3976C5.23778 10.189 5.31375 10.0087 5.46568 9.85679L8.56423 6.75824Z' fill='%23ECEA8E'/%3E%3C/svg%3E%0A");
  background-repeat: no-repeat no-repeat;
  background-position: center center;
  background-size: cover;
  position: absolute;
  width: 16px;
  height: 16px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) rotate(0) !important;
  transition: .4s;
  border: none;
}

#nav-desktop-toggle {
  position: absolute;
  top: 32px;
  right: -10px;
  width: 48px;
  height: 48px;
  background: #30A936;
  border-radius: 50%;
  padding: 10px;
  z-index: 10000;
  cursor: pointer !important;
}

#nav-desktop-toggle a {
  display: block;
  height: 100%;
  position: relative;
}

#nav-desktop-toggle span {
  display: flex;
}

#nav-desktop-toggle span::before,
#nav-desktop-toggle span::after {
  content: '';
  background: white !important;
  width: 100% !important;
  height: 3px !important;
  position: absolute;
  top: 50%;
  transition: .4s;
}

#nav-desktop-toggle span::before {
  transform: translateY(-50%) rotate(-45deg) !important;
}

#nav-desktop-toggle span::after {
  transform: translateY(-50%) rotate(45deg) !important;
}

#nav-desktop-toggle:hover span::before,
#nav-desktop-toggle:hover span::after {
  background: rgba(236, 236, 236, 0.492) !important;
}


@media (min-width: 1400px) {
  .hc-offcanvas-nav .nav-title+.nav-close a:not(.has-label) {
    right: -15px;
  }
}

@media (max-width: 1199px) {

  .nav-back {
    padding-left: 30px;
  }

  .hc-offcanvas-nav.hc-nav-1 .nav-container,
  .hc-offcanvas-nav.hc-nav-1.nav-position-left .nav-container,
  .hc-offcanvas-nav.nav-open[class*='hc-nav-'] div.nav-container {
    background: var(--secondary-color);
  }

  .hc-offcanvas-nav.hc-nav-1 .nav-container,
  .hc-offcanvas-nav.hc-nav-1 .nav-wrapper {
    width: 100% !important;
  }

  .nav-back {
    display: flex;
    justify-content: space-between;
  }

  .hc-offcanvas-nav .nav-wrapper::after {
    background: var(--secondary-color) !important;
  }

  #hc-nav-1 .nav-close-button {
    right: 25px;
  }

  #nav-mobile-toggle {
    background: white;
    width: 100%;
    height: 44px;
    position: fixed;
    bottom: 0;
    z-index: 1000000;
  }

  #hc-nav-1 .nav-close-button {
    top: auto;
    bottom: 20px;
    z-index: 100000;
  }

  .bottom-frame {
    width: 100%;
    height: 44px;
    background: white;
    position: fixed;
    bottom: 0;
    z-index: 10000;
  }


  #nav-mobile-toggle .toggle {
    width: 56px;
    height: 56px;
  }

  #nav-mobile-toggle.mobile-btn .toggle span {
    background: var(--primary-color);
    top: 45%;
  }

  .hc-nav-trigger span,
  .hc-nav-trigger span::before,
  .hc-nav-trigger span::after {
    height: 3px;
  }

  #nav-mobile-toggle.mobile-btn .toggle span {
    top: 50%;
    left: 50%;
    background: white;
    border-radius: 50px;
  }

  #nav-mobile-toggle.mobile-btn .toggle.toggle-open span {
    top: 50%;
    left: 50%;
    background: transparent;
    border-radius: 50px;
  }

  #nav-mobile-toggle.mobile-btn .toggle.toggle-open span::before {
    top: 50%;
    left: 50%;
    transform: translate(-50%) rotate(45deg);
    background: white;
    border-radius: 50px;
  }

  #nav-mobile-toggle.mobile-btn .toggle.toggle-open span::after {
    top: 50%;
    left: 50%;
    transform: translate(-50%) rotate(-45deg);
    background: white;
    border-radius: 50px;
  }

  .nav-back {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    background: var(--secondary-color);
    z-index: 10000;
  }

  .hc-offcanvas-nav:not(.touch-device) li:not(.nav-item-custom).nav-parent a:not([disabled]):hover .nav-next {
    right: 0;
    top: -20px;
  }

  .hc-offcanvas-nav .nav-back a {
    padding-left: 20px !important;
  }

  .hc-offcanvas-nav .nav-back a span {
    right: 28px;
  }

  .hc-offcanvas-nav .nav-back a:hover span {
    right: 28px;
  }

  .hc-offcanvas-nav .nav-back a span::before,
  #hc-nav-1 a:not(.nav-close-button) .nav-next span::before {
    content: '';
    background-image: url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 12 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.56423 6.75824H1.2896C1.07679 6.75824 0.897194 6.68505 0.750817 6.53867C0.604439 6.39229 0.53125 6.21271 0.53125 5.99991C0.53125 5.78711 0.604439 5.60752 0.750817 5.46114C0.897194 5.31476 1.07679 5.24157 1.2896 5.24157H8.56423L5.453 2.13034C5.30107 1.9784 5.22721 1.80027 5.23143 1.59592C5.23567 1.39158 5.31375 1.21344 5.46568 1.0615C5.61762 0.920682 5.79575 0.848155 6.0001 0.843921C6.20444 0.839699 6.38258 0.913555 6.53452 1.06549L10.9345 5.46549C11.0092 5.54012 11.0637 5.62297 11.0981 5.71404C11.1325 5.80509 11.1497 5.90038 11.1497 5.99991C11.1497 6.09943 11.1325 6.19472 11.0981 6.28577C11.0637 6.37684 11.0092 6.45969 10.9345 6.53432L6.53053 10.9383C6.38705 11.0818 6.21169 11.1535 6.00445 11.1535C5.7972 11.1535 5.61762 11.0818 5.46568 10.9383C5.31375 10.7864 5.23778 10.6061 5.23778 10.3976C5.23778 10.189 5.31375 10.0087 5.46568 9.85679L8.56423 6.75824Z' fill='%23ECEA8E'/%3E%3C/svg%3E%0A");
    background-repeat: no-repeat no-repeat;
    background-position: center center;
    background-size: cover;
    position: absolute;
    width: 16px;
    height: 16px;
    top: 50%;
    left: 50%;
    transition: .4s;
    border: none !important;
  }

  .hc-offcanvas-nav .nav-back {
    top: 110px;
  }

  #hc-nav-1 .nav-content {
    padding-top: 160px;
  }
}

@media (max-width: 767.98px) {
  .hc-offcanvas-nav .nav-back {
    top: 90px;
  }
}

@media (max-width: 575.98px) {

  #hc-nav-1 .nav-content {
    padding-top: 130px;
  }
}