@media (min-width: 1400px) {
  .main-title {
    font-size: 57px;
    line-height: 69px;
  }
  .nmb-80 {
    margin-bottom: -80px;
  }
}
@media (min-width: 992px) and (max-width: 1399px) {
  .main-title {
    font-size: 49px;
    line-height: 62px;
  }
  .nmb-80 {
    margin-bottom: -80px;
  }
}
@media (max-width: 991px) {
  .main-title {
    font-size: 48px;
    line-height: 51px;
  }
  .nav_bg {
    background: transparent !important;
  }
  .nmb-80 {
    margin-bottom: -50px;
  }
}
.circle-shape {
  position: absolute;
  left: 0;
  right: 0;
}
@media (max-width: 767px) {
  .circle-shape img {
    height: 260px;
    margin: auto;
    display: flex;
  }
  .circle-shape {
    top: 0px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .circle-shape img {
    height: 500px;
    margin: auto;
    display: flex;
  }
  .circle-shape {
    top: 0px;
  }
}
@media (min-width: 992px) and (max-width: 1399px) {
  .circle-shape img {
    height: 440px;
    margin: auto;
    display: flex;
  }
  .circle-shape {
    top: -55px;
  }
}

@media (min-width: 1400px) {
  .circle-shape img {
    height: 479px;
    margin: auto;
    display: flex;
  }
  .circle-shape {
    top: -55px;
  }
}
.btn_yellow {
  background-color: #ffb114 !important;
  color: #fff !important;
}
.text_yellow {
  color: #ffb114 !important;
}
.bg_soft_ash {
  background-color: #f8fafb;
}
.bg_white_smoke {
  background-color: #f2f4f3 !important;
}
.bg_white_smoke_2 {
  background-color: #f2f4f6;
}
.text_black {
  color: #000 !important;
}
.nav_bg {
  background: linear-gradient(90deg, rgba(245, 245, 245, 0) 20%, rgb(0 16 5) 100%);
}
.bg_gradient_1 {
  background: linear-gradient(180deg, #f0ddb6 0%, #188753 100%);
}
.bg_gradient_2 {
  background: linear-gradient(180deg, #ffffff 26.44%, #188753 100%);
}
.bg_gradient_3 {
  background: linear-gradient(180deg, #e6d7ff 0%, #f2f4f3 81.93%);
}
.bg_gradient_4 {
  background: linear-gradient(0deg, #d3f3ff 0%, #f2f4f3 80.41%);
}
.bg_gradient_5 {
  background: linear-gradient(180deg, #bce6a2 0%, #f2f4f3 78.26%);
}
.bg_gradient_6 {
  background: linear-gradient(0deg, #ffcf6d 0%, #f2f4f3 73.6%);
}
.bg_gradient_7 {
  background: linear-gradient(90.14deg, #188753 -0.5%, #0a4228 99.01%);
}
.bg_solid_one {
  background-color: #fff9ec;
}
.bg_solid_two {
  background-color: #f3fff5;
}
.bg_solid_three {
  background-color: #f7fdf1;
}
.bg_solid_four {
  background-color: #f9fbf8;
}
.bg_green {
  background-color: #188753 !important;
}
.text_green {
  color: #188753 !important;
}
.btn_primary {
  border-color: #188753;
  background-color: #188753 !important;
  color: #fff !important;
}

.rounded-30 {
  border-radius: 30px;
}
.rounded-40 {
  border-radius: 40px;
}

@media (min-width: 768px) {
  .shape-left {
    position: absolute;
    left: 0;
    bottom: 80px;
    height: 50%;
    z-index: 0;
  }
  .shape-right {
    position: absolute;
    right: 0;
    top: 80px;
    height: 50%;
    z-index: 0;
  }

  .cta-shape-left {
    position: absolute;
    left: 0;
    bottom: 50px;
    height: 65%;
    z-index: 0;
  }
  .cta-shape-right {
    position: absolute;
    right: 0;
    top: 50px;
    height: 65%;
    z-index: 0;
  }
  .all-in-one-h {
    height: 490px;
  }
}
@media (max-width: 767px) {
  .shape-left {
    display: none;
  }
  .shape-right {
    display: none;
  }

  .cta-shape-left {
    display: none;
  }
  .cta-shape-right {
    display: none;
  }
  .title-h {
    height: 220px;
  }
  .all-in-one-h {
    height: 290px;
  }
}
.custom-faq .accordion-button.collapsed {
  color: #000000;
}
.custom-faq .card-header button {
  padding: 10px 49px 10px 22px !important;
  border-radius: 10px;
  color: #188753;
}
.custom-faq .card-header button::before {
  display: none !important;
}
.custom-faq .card-header button:after {
  margin-left: auto;
  content: "";
  right: 22px;
  position: absolute;
  background-image: url(../img/home-page/faq.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 0.9rem;
  transition: transform 0.2s ease-in-out;
  width: 20px;
  height: 20px;
  top: 15px;
}
.custom-faq .card-header button:not(.collapsed)::after {
  background-image: url(../img/home-page/faq-not.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 0.9rem;
  width: 20px;
  height: 20px;
  top: 15px;
}

@media (min-width: 992px) {
  .navbar.transparent:not(.fixed) {
    margin-top: 1.5rem;
  }
}
/* ========== hover ==========  */
.hover1 {
  transition: all 0.3s linear;
}

.hover1:hover {
  box-shadow: rgb(0 0 0 / 12%) 0px 20px 50px 0px;
  transition: all 0.3s linear;
}
.hover2 {
  transform: translateY(0);
  transition: all 0.3s linear;
}

.hover2:hover {
  transform: translateY(-0.4rem);
  box-shadow: 0 0.25rem 1.25rem rgb(197 197 197) !important;
  transition: all 0.3s linear;
}
.hover3 {
  transition: all 0.3s linear;
  overflow: hidden;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  transform: translateY(0);
}
.hover3 img {
  transition: all 0.35s ease-in-out;
}

.hover3:hover img {
  transform: scale(1.05);
}
.hover3:hover {
  box-shadow: rgb(0 0 0 / 16%) 1px 1px 10px 0px;
  transition: all 0.3s linear;
}

.hover4 {
  position: relative;
  overflow: hidden;
  z-index: 1;
  transition: all 0.3s linear;
  color: inherit;
}

.hover4::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, #f0ddb6 0%, #188753 100%);
  z-index: -1;
  opacity: 0;
  transition: opacity 0.3s linear;
}

.hover4:hover::before {
  opacity: 1;
}

.hover4:hover {
  transform: translateY(-0.4rem);
  box-shadow: 0 0.25rem 1.25rem rgb(197 197 197) !important;
  color: #fff;
}
.hover4 h3 {
  transition: color 0.3s linear;
}

.hover4:hover h3 {
  color: #fff;
}

.gui-pos-img {
  height: 230px;
}
.gui-pos {
  font-size: 2.8rem;
  font-weight: bold;
  color: #fff;
  font-weight: 900;
  margin-right: -29px;
  font-family: system-ui;
}
.fs-70 {
  font-size: 70px;
}