.hero-banner {
  position: relative;
  height: 560px; /* ss changes*/
}
.hero-banner::after {
  background-color: rgba(38,40,43,.1);
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%
}
.hero-banner__image {
  position: relative;
  z-index: 0
}
.hero-banner__image img {
  max-height: 86vh;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover
}
.hero-banner__container {
  position: absolute;
  top: 200px;
  right: 0;
  left: 0;
  z-index: 2;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%)
}
@media (min-width:576px) {
  .hero-banner__container {
    top: 60%
  }
}
@media (max-width:575px) {
  .hero-banner__container {
    top: 50%
  }
}
@media (min-width:1441px) {
  .hero-banner__container {
    top: 50%
  }
}
.hero-banner__content {
  width: 100%
}
@media (min-width:768px) {
  .hero-banner__content {
    width: 476px
  }
}
@media (min-width:992px) {
  .hero-banner__content {
    /* width: 576px */
    width: 700px;
  }
}
.hero-banner__title {
  color: #fdfeff;
  font-family: BioRhyme;
  font-size: 36px;
  font-style: normal;
  font-weight: 700;
  letter-spacing: 2px;
  line-height: 44px;
  margin-bottom: 15px
}
@media (min-width:992px) {
  .hero-banner__title {
    font-size: 50px;
    line-height: 56px
  }
}
.hero-banner__desc {
  color: #fdfeff;
  font-size: 16px;
  line-height: 24px;
  margin-bottom: 40px
}
@media (min-width:992px) {
  .hero-banner__desc {
    font-size: 20px;
    line-height: 28px
  }
}
.hero-banner__cta {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  list-style: none
}

.hero-banner__cta li {
  margin-right: 30px /*ss change*/
}
.hero-banner__cta li a {
  color: #fdfeff;
  font-size: 16px;
  line-height: 19px;
  padding: 12px 20px
}
.hero-banner__cta li a:focus,
.hero-banner__cta li a:hover {
  color: #fdfeff
}
@media (min-width:992px) {
  .hero-banner__cta li a {
    font-size: 18px;
    line-height: 27px;
    padding: 16px 32px
  }
}
@media (max-width:767px) {
  .hero-banner__image img{
      max-height: 100%;
  }
  .hero-banner__container {
      top: 35%
    }

}
.store-banner__box img {
  height: 320px;
  object-fit: cover;
}
@media (max-width:575.98px) {
.store-banner__box img {
  height: 240px;
  object-fit: cover;
}
}
/*# sourceMappingURL=maps/hero-banner.css.map */