section {
  padding: 1em 0;
  position: relative;
}
section.site-main {
  padding: 0;
}
@media (max-width: 479px) {
  section.site-main {
    overflow-x: hidden;
  }
}

.hp-intro .hp-intro--grid {
  position: relative;
}
.hp-intro .fp-intro--text {
  position: relative;
  padding: 1em 0 2em 0;
}
@media (max-width: 767px) {
  .hp-intro {
    padding-bottom: 0;
  }
  .hp-intro .hp-intro--posts {
    margin-left: -20px;
    margin-right: -20px;
    border-radius: 0;
    padding: 4em 0 0 0;
    margin-top: -5em;
  }
  .hp-intro .hp-intro--posts .post-preview-thumbnail {
    border-radius: 0;
  }
}

.cta-block-wrapper {
  display: grid;
  grid-template-columns: 1fr;
  grid-gap: 25px;
  align-items: center;
}
@media (min-width: 769px) {
  .cta-block-wrapper {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr 1fr;
  }
}
@media (min-width: 1025px) {
  .cta-block-wrapper {
    grid-auto-flow: column;
    grid-template-columns: 1fr 1fr 1fr;
  }
}
.cta-block-wrapper .cta-block {
  border: 1px solid var(--color-border);
  background: #fff;
  box-shadow: var(--box-shadow-card);
  border-radius: var(--border-radius-large);
  padding: 1.5em;
  min-height: 120px;
  display: flex;
  align-items: center;
  grid-gap: 1em;
  line-height: var(--heading-line-height);
  position: relative;
  overflow: hidden;
}
.cta-block-wrapper .cta-block:hover {
  transform: scale(1.02);
}
.cta-block-wrapper .cta-block .cta-block--icon {
  font-size: 2.2em;
  color: var(--color-primary);
}
.cta-block-wrapper .cta-block .cta-block--heading {
  color: var(--color-secondary);
  font-size: 1.1em;
  font-weight: var(--font-weight-bold);
}
.cta-block-wrapper .cta-block.cta-block--featured {
  display: block;
  background: var(--color-secondary);
  font-size: 1.2em;
  min-height: 265px;
}
@media (min-width: 769px) {
  .cta-block-wrapper .cta-block.cta-block--featured {
    grid-row: span 2;
  }
}
.cta-block-wrapper .cta-block.cta-block--featured .cta-block--heading {
  color: #ffffff;
}
.cta-block-wrapper .cta-block.cta-block--featured img {
  position: absolute;
  right: 4%;
  top: 3.4em;
  width: 260px;
}
@media (min-width: 769px) {
  .cta-block-wrapper .cta-box {
    grid-row: span 2;
    grid-column: span 2;
  }
}
.cta-block-wrapper .cta-box p {
  margin: 0;
}
.cta-block-wrapper .cta-box a {
  margin: 0 auto;
}

.hp-cta-compare {
  display: block;
  position: relative;
  background: var(--color-bg-gradient);
  border-radius: var(--border-radius-large);
  padding: 1.5em;
  text-align: center;
  color: #fff;
  overflow: hidden;
}
.hp-cta-compare .cta-block-heading {
  margin: 1em 0;
}
.hp-cta-compare .hp-cta-compare--icon img {
  width: 80px;
  display: block;
  margin: 0 auto 1.5em auto;
  position: relative;
  z-index: 1;
}
.hp-cta-compare a.btn {
  display: inline-block;
  z-index: 1;
  white-space: nowrap;
  position: relative;
}
@media (max-width: 479px) {
  .hp-cta-compare a.btn {
    width: 100%;
  }
}

.hp-cta-block--socials {
  position: relative;
  padding: 1.25em;
  text-align: center;
  display: block;
  background: var(--color-light);
  border-radius: var(--border-radius-large);
}
.hp-cta-block--socials .hp-cta-block--socials-btns {
  display: flex;
  justify-content: center;
  flex-flow: wrap;
  gap: 0.75em;
}
.hp-cta-block--socials .hp-cta-block--socials-btns a {
  background: var(--color-primary);
  color: #fff;
  text-align: center;
  border-radius: var(--border-radius-round);
  font-size: 1.4em;
  width: 65px;
  height: 65px;
  display: grid;
  align-items: center;
  transition: background 0.2s linear;
}
.hp-cta-block--socials .hp-cta-block--socials-btns a:hover {
  background: var(--color-cta-hover);
}

.section-reverse {
  margin-top: 2em;
  background: var(--color-tertiary);
  color: var(--color-light);
  position: relative;
}
.section-reverse h2 {
  color: #fff;
}
.section-reverse section:first-child {
  padding-bottom: 0;
}
.section-reverse .swiper.miles-swiper .swiper-arrow {
  background: rgba(255, 255, 255, 0.2);
  color: #fff;
}
.section-reverse .swiper.miles-swiper .swiper-arrow:not(.swiper-button-disabled):hover {
  background: rgba(255, 255, 255, 0.3);
}
.section-reverse .post-preview-content .post-title {
  color: var(--color-light);
}
.section-reverse .post-preview-content .post-date {
  display: none;
}
.section-reverse .swiper.miles-swiper .swiper-scrollbar {
  background: rgba(255, 255, 255, 0.1);
}
.section-reverse .swiper.miles-swiper .swiper-scrollbar .swiper-scrollbar-drag {
  background: rgba(255, 255, 255, 0.3);
}

.hp-pop-articles {
  overflow-x: hidden;
  overflow-y: hidden;
  position: relative;
  margin-bottom: -2em;
  padding-bottom: 4em;
}
.hp-pop-articles .miles-o {
  z-index: -1;
  right: -5em;
  top: 0;
  left: auto;
}

.site-main .links ul li {
  margin-bottom: 1em;
}
.site-main .links ul li::before {
  width: 1.4em;
}

.marquee-wrapper {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  padding: 0;
  margin: 0;
  width: 100vw;
}
.marquee-wrapper .marquee {
  display: flex;
  align-items: center;
  justify-content: center;
  animation: Marquee 40s linear infinite;
}
.marquee-wrapper .marquee a.marquee-item {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20.5vw;
  /*line 43 is very important. since we have 16 items, width of the Marquee which is 200vw must be devided between them. which turns out to be 12.5vw*/
  margin: 10px;
  border-radius: 15px;
}
.marquee-wrapper .marquee a.marquee-item img {
  object-fit: contain;
  width: 100%;
  height: 100%;
  max-width: 70px;
  max-height: 50px;
}

@keyframes Marquee {
  0% {
    transform: translateX(50vw);
    -webkit-transform: translateX(50vw);
  }
  100% {
    transform: translateX(-50vw);
    -webkit-transform: translateX(-50vw);
  }
}
#modalPromo .close-btn {
  display: none;
}

body.milesModalOpen #modalPromo {
  transform: translateY(100%);
  transition: translateY 0.2s linear;
  position: fixed;
  bottom: 0;
  width: 100%;
  z-index: 4;
  padding: 0;
  animation: slideUp 0.25s;
  animation-fill-mode: forwards;
  animation-delay: 1s;
  animation-timing-function: ease-out;
  border-radius: 0;
}
body.milesModalOpen #modalPromo .newsletter-cta {
  border-radius: 0;
  width: 100%;
  padding: 1.5em 0 1.5em 0;
  margin-bottom: 0;
}
body.milesModalOpen #modalPromo .newsletter-heading {
  padding-right: 1em;
}
body.milesModalOpen #modalPromo .container {
  max-width: none;
  background: var(--color-secondary);
  display: flex;
}
@keyframes slideUp {
  0% {
    transform: translateY(100%);
  }
  100% {
    transform: translateY(0%);
  }
}
body.milesModalOpen #modalPromo .newsletter-signup--post-bottom {
  background: var(--color-tertiary);
  border-radius: 0;
}
body.milesModalOpen #modalPromo .close-btn {
  display: block;
  order: 2;
  flex-shrink: 0;
  color: #fff;
  background: rgba(255, 255, 255, 0.15);
}
@media (max-width: 767px) {
  body.milesModalOpen #modalPromo .close-btn {
    margin-top: 0.5em;
    margin-right: -0.5em;
  }
}

.newsletter-wrapper .newsletter-signup--post-bottom {
  margin: 0;
}
.newsletter-wrapper .close-btn {
  display: none;
}

.our-mission .miles-o {
  display: none;
}
.our-mission .miles-circle-image {
  overflow: hidden;
  border-radius: 100%;
  margin: 0 auto;
  width: 250px;
  height: 250px;
}
@media (min-width: 769px) {
  .our-mission .miles-circle-image {
    width: 480px;
    height: 480px;
  }
}
.our-mission .miles-circle-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@media screen and (min-width: 768px) {
  .hp-intro {
    margin-bottom: 0;
  }
  .hp-intro .hp-intro--grid .fp-intro--text {
    z-index: 3;
    grid-column: 1;
  }
  .hp-intro .hp-intro--grid .hp-intro--posts .swiper.miles-swiper {
    padding: 4em 0 0 0;
    margin-top: 0;
  }
  .hp-cta-compare {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: left;
    grid-gap: 1.5em;
    margin: 0 auto;
    padding: 1.5em 2em 1.5em 2em;
  }
  .hp-cta-compare .hp-cta-compare--icon img {
    margin-bottom: 0;
  }
  .hp-cta-compare .miles-o {
    left: -3em;
    top: 0.75em;
  }
  .hp-cta-compare .miles-o svg {
    width: 400px;
    height: 400px;
  }
  .hp-cta-compare .miles-clouds {
    width: 200px;
    right: 0.5em;
    bottom: 0.5em;
  }
  body.milesModalOpen #modalPromo .container {
    padding: 0 2em 0 3em;
    align-items: center;
  }
  body.milesModalOpen #modalPromo .container .newsletter-cta {
    padding: 2em 0;
  }
  .hp-pop-articles {
    padding-top: 0;
    margin-top: -2em;
  }
  .hp-cta-block--socials {
    margin-top: 1.4em;
    padding: 2em 1.25em;
  }
  .hp-cta-block--socials .hp-cta-block--socials-btns a {
    width: 3em;
    height: 3em;
  }
}
@media screen and (min-width: 1024px) {
  section {
    padding: 2em 0;
  }
  .hp-intro {
    margin-bottom: -2em;
    padding-bottom: 3em;
  }
  .hp-intro .hp-intro--grid {
    display: grid;
    align-items: center;
    grid-gap: 4em;
    grid-template-columns: 1fr 2fr;
    max-width: initial;
  }
}
@media screen and (min-width: 1024px) and (min-width: 1521px) {
  .hp-intro .hp-intro--grid {
    grid-gap: 6em;
  }
}
@media screen and (min-width: 1024px) {
  .hp-intro .post-title {
    font-size: 1.7em;
  }
  .hp-intro .featured-post .post-preview .post-preview-content {
    padding: 2em;
  }
  .hp-intro .featured-post .post-preview .post-preview-thumbnail {
    min-height: 440px;
  }
  .site-main .links ul {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 4em;
  }
  .marquee-wrapper {
    margin-top: 2em;
    width: 200vw;
  }
  .marquee-wrapper .marquee a.marquee-item {
    width: 10.5vw;
    margin: 0 3em;
  }
  .marquee-wrapper .marquee a.marquee-item img {
    max-width: 140px;
    max-height: 60px;
  }
  .our-mission .container-2col {
    grid-gap: 4em;
  }
  .our-mission .miles-o {
    display: block;
    right: 0;
    top: -4em;
    left: auto;
    z-index: -1;
  }
  .our-mission .miles-o svg {
    width: calc(20vw + 400px);
    height: calc(20vw + 400px);
  }
  .faq-desc-sticky {
    position: sticky;
    top: 4em;
  }
}

/*# sourceMappingURL=front-page.css.map */