.page-template-front-page {
  background: var(--color-light-bg);
}
.page-template-front-page .entry-header,
.page-template-front-page .entry-header-no-image {
  margin-top: 0;
  margin-bottom: 0;
  padding-top: 0;
  padding-bottom: 0;
}
.page-template-front-page .aff-header-wrapper {
  background: var(--hero-bg-color);
  position: relative;
}
.page-template-front-page .aff-header-wrapper .entry-header-text {
  padding: 2.8em 0 3em 0;
  color: var(--hero-text-color);
  max-width: 700px;
}
.page-template-front-page .aff-header-wrapper .entry-header-text h1 {
  margin: 0;
  padding-top: 0;
  padding-bottom: 0.4em;
  color: var(--hero-text-color);
}
.page-template-front-page .aff-header-wrapper .entry-header-text a.btn {
  display: inline-block;
}
@media (max-width: 1023px) {
  .page-template-front-page .aff-header-wrapper .entry-header-profile {
    padding-bottom: 1em;
  }
  .page-template-front-page .aff-header-wrapper .entry-header-profile .entry-header-image {
    width: 300px;
    height: 300px;
    margin: 0 auto;
    border-radius: 100%;
    overflow: hidden;
    margin-bottom: 2em;
  }
}
.page-template-front-page .aff-header-wrapper .entry-header-centered {
  display: block;
  margin: 0 auto;
  text-align: center;
  justify-content: center;
}
.page-template-front-page .aff-header-wrapper .entry-header-centered .entry-header-text {
  position: relative;
  z-index: 1;
  margin: 0 auto;
  padding: 4em 0;
}
.page-template-front-page .aff-header-wrapper .entry-header-centered .entry-header-image {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 0;
  opacity: 0.3;
  margin: 0;
}
.page-template-front-page .aff-frontpage-before-content {
  max-width: 700px;
  margin: 1em auto;
  text-align: center;
}
.page-template-front-page .aff-cards-by-cat-heading {
  text-align: center;
  margin: 1em auto 0 auto;
  max-width: 700px;
}
.page-template-front-page .aff-cards-by-cat {
  margin-bottom: 5em;
}
.page-template-front-page.card-single-header-white-text .aff-header-wrapper {
  color: #fff;
}
.page-template-front-page.card-single-header-white-text .aff-header-wrapper h1 {
  color: #fff;
}
.page-template-front-page .site-main ul.miles-faq > li a.faq-toggle {
  background: #fff;
}

@media screen and (min-width: 1024px) {
  .page-template-front-page .aff-header-wrapper .entry-header-profile {
    padding-bottom: 0;
    grid-template-columns: 1fr 0.7fr;
  }
  .page-template-front-page .aff-header-wrapper .entry-header-profile .entry-header-image {
    height: 100%;
    position: relative;
  }
  .page-template-front-page .aff-header-wrapper .entry-header-profile .entry-header-image::before, .page-template-front-page .aff-header-wrapper .entry-header-profile .entry-header-image::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    width: min(30%, 15rem);
    z-index: 1;
    pointer-events: none;
  }
  .page-template-front-page .aff-header-wrapper .entry-header-profile .entry-header-image::before {
    left: 0;
    background: linear-gradient(to right, var(--hero-bg-color), color-mix(in srgb, var(--hero-bg-color) 0%, transparent));
  }
  .page-template-front-page .aff-header-wrapper .entry-header-profile .entry-header-image::after {
    right: 0;
    background: linear-gradient(to left, var(--hero-bg-color), color-mix(in srgb, var(--hero-bg-color) 0%, transparent));
  }
  .page-template-front-page .aff-header-wrapper .entry-header-profile .entry-header-image img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 0;
  }
}

/*# sourceMappingURL=data:application/json;charset=utf-8,%7B%22version%22:3,%22sourceRoot%22:%22%22,%22sources%22:%5B%22../sass/aff-frontpage.scss%22,%22../sass/abstracts/variables/_breakpoints.scss%22%5D,%22names%22:%5B%5D,%22mappings%22:%22AAEA;EACC;;AAGA;AAAA;EAEC;EACA;EACA;EACA;;AAID;EACC;EACA;;AAGA;EACC;EACA;EACA;;AAEA;EACC;EACA;EACA;EACA;;AAGD;EACC;;ACifA;ED3eD;IACC;;EAEA;IACC;IACA;IACA;IACA;IACA;IACA;;;AAMH;EACC;EACA;EACA;EACA;;AAEA;EACC;EACA;EACA;EACA;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAOH;EACC;EACA;EACA;;AAGD;EACC;EACA;EACA;;AAGD;EACC;;AAKA;EACC;;AAEA;EACC;;AAMH;EACC;;;AAMF;EAOG;IACC;IACA;;EAGA;IACC;IACA;;EAEA;IAEC;IACA;IACA;IACA;IACA;IACA;IACA;;EAGD;IACC;IACA;;EAOD;IACC;IACA;;EAOD;IACC;IACA;IACA;IACA;IACA;IACA;IACA%22,%22file%22:%22aff-frontpage.css%22,%22sourcesContent%22:%5B%22@use%20'abstracts/abstracts';%5Cn%5Cn.page-template-front-page%20%7B%5Cn%5Ctbackground:%20var(--color-light-bg);%5Cn%5Cn%5Ct//%20Resets%5Cn%5Ct.entry-header,%5Cn%5Ct.entry-header-no-image%20%7B%5Cn%5Ct%5Ctmargin-top:%200;%5Cn%5Ct%5Ctmargin-bottom:%200;%5Cn%5Ct%5Ctpadding-top:%200;%5Cn%5Ct%5Ctpadding-bottom:%200;%5Cn%5Ct%7D%5Cn%5Cn%5Ct//%20Header%5Cn%5Ct.aff-header-wrapper%20%7B%5Cn%5Ct%5Ctbackground:%20var(--hero-bg-color);%5Cn%5Ct%5Ctposition:%20relative;%5Cn%5Cn%5Cn%5Ct%5Ct.entry-header-text%20%7B%5Cn%5Ct%5Ct%5Ctpadding:%202.8em%200%203em%200;%5Cn%5Ct%5Ct%5Ctcolor:%20var(--hero-text-color);%5Cn%5Ct%5Ct%5Ctmax-width:%20700px;%5Cn%5Cn%5Ct%5Ct%5Cth1%20%7B%5Cn%5Ct%5Ct%5Ct%5Ctmargin:%200;%5Cn%5Ct%5Ct%5Ct%5Ctpadding-top:%200;%5Cn%5Ct%5Ct%5Ct%5Ctpadding-bottom:%200.4em;%5Cn%5Ct%5Ct%5Ct%5Ctcolor:%20var(--hero-text-color);%5Cn%5Ct%5Ct%5Ct%7D%5Cn%5Cn%5Ct%5Ct%5Cta.btn%20%7B%5Cn%5Ct%5Ct%5Ct%5Ctdisplay:%20inline-block;%5Cn%5Ct%5Ct%5Ct%7D%5Cn%5Ct%5Ct%7D%5Cn%5Cn%5Ct%5Ct//%20Layout%20option%20-%20Profile%20(mobile%20through%20below%20desktop)%5Cn%5Ct%5Ct@include%20abstracts.media('%3Cdesktop')%20%7B%5Cn%5Ct%5Ct%5Ct.entry-header-profile%20%7B%5Cn%5Ct%5Ct%5Ct%5Ctpadding-bottom:%201em;%5Cn%5Cn%5Ct%5Ct%5Ct%5Ct.entry-header-image%20%7B%5Cn%5Ct%5Ct%5Ct%5Ct%5Ctwidth:%20300px;%5Cn%5Ct%5Ct%5Ct%5Ct%5Ctheight:%20300px;%5Cn%5Ct%5Ct%5Ct%5Ct%5Ctmargin:%200%20auto;%5Cn%5Ct%5Ct%5Ct%5Ct%5Ctborder-radius:%20100%25;%5Cn%5Ct%5Ct%5Ct%5Ct%5Ctoverflow:%20hidden;%5Cn%5Ct%5Ct%5Ct%5Ct%5Ctmargin-bottom:%202em;%5Cn%5Ct%5Ct%5Ct%5Ct%7D%5Cn%5Ct%5Ct%5Ct%7D%5Cn%5Ct%5Ct%7D%5Cn%5Cn%5Ct%5Ct//%20Layout%20option%20-%20Centered%5Cn%5Ct%5Ct.entry-header-centered%20%7B%5Cn%5Ct%5Ct%5Ctdisplay:%20block;%5Cn%5Ct%5Ct%5Ctmargin:%200%20auto;%5Cn%5Ct%5Ct%5Cttext-align:%20center;%5Cn%5Ct%5Ct%5Ctjustify-content:%20center;%5Cn%5Cn%5Ct%5Ct%5Ct.entry-header-text%20%7B%5Cn%5Ct%5Ct%5Ct%5Ctposition:%20relative;%5Cn%5Ct%5Ct%5Ct%5Ctz-index:%201;%5Cn%5Ct%5Ct%5Ct%5Ctmargin:%200%20auto;%5Cn%5Ct%5Ct%5Ct%5Ctpadding:%204em%200;%5Cn%5Ct%5Ct%5Ct%7D%5Cn%5Cn%5Ct%5Ct%5Ct.entry-header-image%20%7B%5Cn%5Ct%5Ct%5Ct%5Ctposition:%20absolute;%5Cn%5Ct%5Ct%5Ct%5Cttop:%200;%5Cn%5Ct%5Ct%5Ct%5Ctright:%200;%5Cn%5Ct%5Ct%5Ct%5Ctbottom:%200;%5Cn%5Ct%5Ct%5Ct%5Ctleft:%200;%5Cn%5Ct%5Ct%5Ct%5Ctwidth:%20100%25;%5Cn%5Ct%5Ct%5Ct%5Ctheight:%20100%25;%5Cn%5Ct%5Ct%5Ct%5Ctborder-radius:%200;%5Cn%5Ct%5Ct%5Ct%5Ctopacity:%200.3;%5Cn%5Ct%5Ct%5Ct%5Ctmargin:%200%5Cn%5Ct%5Ct%5Ct%7D%5Cn%5Ct%5Ct%7D%5Cn%5Cn%5Ct%7D%5Cn%5Cn%5Ct//%20Content%5Cn%5Ct.aff-frontpage-before-content%20%7B%5Cn%5Ct%5Ctmax-width:%20700px;%5Cn%5Ct%5Ctmargin:%201em%20auto;%5Cn%5Ct%5Cttext-align:%20center;%5Cn%5Ct%7D%5Cn%5Cn%5Ct.aff-cards-by-cat-heading%20%7B%5Cn%5Ct%5Cttext-align:%20center;%5Cn%5Ct%5Ctmargin:%201em%20auto%200%20auto;%5Cn%5Ct%5Ctmax-width:%20700px;%5Cn%5Ct%7D%5Cn%5Cn%5Ct.aff-cards-by-cat%20%7B%5Cn%5Ct%5Ctmargin-bottom:%205em;%5Cn%5Ct%7D%5Cn%5Cn%5Ct//%20white%20text%5Cn%5Ct&.card-single-header-white-text%20%7B%5Cn%5Ct%5Ct.aff-header-wrapper%20%7B%5Cn%5Ct%5Ct%5Ctcolor:%20%23fff;%5Cn%5Cn%5Ct%5Ct%5Cth1%20%7B%5Cn%5Ct%5Ct%5Ct%5Ctcolor:%20%23fff;%5Cn%5Ct%5Ct%5Ct%7D%5Cn%5Ct%5Ct%7D%5Cn%5Ct%7D%5Cn%5Cn%5Ct//%20FAQ%5Cn%5Ct.site-main%20ul.miles-faq%3Eli%20a.faq-toggle%20%7B%5Cn%5Ct%5Ctbackground:%20%23fff;%5Cn%5Ct%7D%5Cn%5Cn%7D%5Cn%5Cn//%20---------------------------------------------%20Desktop%5Cn@media%20screen%20and%20(min-width:%201024px)%20%7B%5Cn%5Cn%5Ct.page-template-front-page%20%7B%5Cn%5Ct%5Ct//%20Header%5Cn%5Ct%5Ct.aff-header-wrapper%20%7B%5Cn%5Cn%5Ct%5Ct%5Ct//%20Layout%20option%20-%20Profile%5Cn%5Ct%5Ct%5Ct.entry-header-profile%20%7B%5Cn%5Ct%5Ct%5Ct%5Ctpadding-bottom:%200;%5Cn%5Ct%5Ct%5Ct%5Ctgrid-template-columns:%201fr%200.7fr;%5Cn%5Cn%5Ct%5Ct%5Ct%5Ct//%20Image%20gradient%20overlay%5Cn%5Ct%5Ct%5Ct%5Ct.entry-header-image%20%7B%5Cn%5Ct%5Ct%5Ct%5Ct%5Ctheight:%20100%25;%5Cn%5Ct%5Ct%5Ct%5Ct%5Ctposition:%20relative;%5Cn%5Cn%5Ct%5Ct%5Ct%5Ct%5Ct&::before,%5Cn%5Ct%5Ct%5Ct%5Ct%5Ct&::after%20%7B%5Cn%5Ct%5Ct%5Ct%5Ct%5Ct%5Ctcontent:%20'';%5Cn%5Ct%5Ct%5Ct%5Ct%5Ct%5Ctposition:%20absolute;%5Cn%5Ct%5Ct%5Ct%5Ct%5Ct%5Cttop:%200;%5Cn%5Ct%5Ct%5Ct%5Ct%5Ct%5Ctbottom:%200;%5Cn%5Ct%5Ct%5Ct%5Ct%5Ct%5Ctwidth:%20min(30%25,%2015rem);%5Cn%5Ct%5Ct%5Ct%5Ct%5Ct%5Ctz-index:%201;%5Cn%5Ct%5Ct%5Ct%5Ct%5Ct%5Ctpointer-events:%20none;%5Cn%5Ct%5Ct%5Ct%5Ct%5Ct%7D%5Cn%5Cn%5Ct%5Ct%5Ct%5Ct%5Ct&::before%20%7B%5Cn%5Ct%5Ct%5Ct%5Ct%5Ct%5Ctleft:%200;%5Cn%5Ct%5Ct%5Ct%5Ct%5Ct%5Ctbackground:%20linear-gradient(%5Cn%5Ct%5Ct%5Ct%5Ct%5Ct%5Ct%5Ctto%20right,%5Cn%5Ct%5Ct%5Ct%5Ct%5Ct%5Ct%5Ctvar(--hero-bg-color),%5Cn%5Ct%5Ct%5Ct%5Ct%5Ct%5Ct%5Ctcolor-mix(in%20srgb,%20var(--hero-bg-color)%200%25,%20transparent)%5Cn%5Ct%5Ct%5Ct%5Ct%5Ct%5Ct);%5Cn%5Ct%5Ct%5Ct%5Ct%5Ct%7D%5Cn%5Cn%5Ct%5Ct%5Ct%5Ct%5Ct&::after%20%7B%5Cn%5Ct%5Ct%5Ct%5Ct%5Ct%5Ctright:%200;%5Cn%5Ct%5Ct%5Ct%5Ct%5Ct%5Ctbackground:%20linear-gradient(%5Cn%5Ct%5Ct%5Ct%5Ct%5Ct%5Ct%5Ctto%20left,%5Cn%5Ct%5Ct%5Ct%5Ct%5Ct%5Ct%5Ctvar(--hero-bg-color),%5Cn%5Ct%5Ct%5Ct%5Ct%5Ct%5Ct%5Ctcolor-mix(in%20srgb,%20var(--hero-bg-color)%200%25,%20transparent)%5Cn%5Ct%5Ct%5Ct%5Ct%5Ct%5Ct);%5Cn%5Ct%5Ct%5Ct%5Ct%5Ct%7D%5Cn%5Cn%5Ct%5Ct%5Ct%5Ct%5Ctimg%20%7B%5Cn%5Ct%5Ct%5Ct%5Ct%5Ct%5Ctposition:%20absolute;%5Cn%5Ct%5Ct%5Ct%5Ct%5Ct%5Cttop:%200;%5Cn%5Ct%5Ct%5Ct%5Ct%5Ct%5Ctleft:%200;%5Cn%5Ct%5Ct%5Ct%5Ct%5Ct%5Ctwidth:%20100%25;%5Cn%5Ct%5Ct%5Ct%5Ct%5Ct%5Ctheight:%20100%25;%5Cn%5Ct%5Ct%5Ct%5Ct%5Ct%5Ctobject-fit:%20cover;%5Cn%5Ct%5Ct%5Ct%5Ct%5Ct%5Ctborder-radius:%200;%5Cn%5Ct%5Ct%5Ct%5Ct%5Ct%7D%5Cn%5Ct%5Ct%5Ct%5Ct%7D%5Cn%5Ct%5Ct%5Ct%7D%5Cn%5Cn%5Cn%5Ct%5Ct%7D%5Cn%5Ct%7D%5Cn%5Cn%7D%22,%22$breakpoints:%20(%5Cn%20%20%20%20%20%20%20%20'phone':%20767px,%5Cn%20%20%20%20%20%20%20%20'tablet':%20768px,%5Cn%20%20%20%20%20%20%20%20'desktop':%201024px,%5Cn%20%20%20%20%20%20%20%20'LGdesktop':%201250px%5Cn)%20!default;%5Cn%5Cn%5Cn///%20http://include-media.com%5Cn///%20Creates%20a%20list%20of%20static%20expressions%20or%20media%20types%5Cn///%5Cn///%20@example%20scss%20-%20Creates%20a%20single%20media%20type%20(screen)%5Cn///%20%20$media-expressions:%20('screen':%20'screen');%5Cn///%5Cn///%20@example%20scss%20-%20Creates%20a%20static%20expression%20with%20logical%20disjunction%20(OR%20operator)%5Cn///%20%20$media-expressions:%20(%5Cn///%20%20%20%20'retina2x':%20'(-webkit-min-device-pixel-ratio:%202),%20(min-resolution:%20192dpi)'%5Cn///%20%20);%5Cn///%5Cn$media-expressions:%20(%5Cn%20%20%20%20%20%20%20%20'screen':%20'screen',%5Cn%20%20%20%20%20%20%20%20'print':%20'print',%5Cn%20%20%20%20%20%20%20%20'handheld':%20'handheld',%5Cn%20%20%20%20%20%20%20%20'landscape':%20'(orientation:%20landscape)',%5Cn%20%20%20%20%20%20%20%20'portrait':%20'(orientation:%20portrait)',%5Cn%20%20%20%20%20%20%20%20'retina2x':%20'(-webkit-min-device-pixel-ratio:%202),%20(min-resolution:%20192dpi),%20(min-resolution:%202dppx)',%5Cn%20%20%20%20%20%20%20%20'retina3x':%20'(-webkit-min-device-pixel-ratio:%203),%20(min-resolution:%20350dpi),%20(min-resolution:%203dppx)'%5Cn)%20!default;%5Cn%5Cn%5Cn///%5Cn///%20Defines%20a%20number%20to%20be%20added%20or%20subtracted%20from%20each%20unit%20when%20declaring%20breakpoints%20with%20exclusive%20intervals%5Cn///%5Cn///%20@example%20scss%20-%20Interval%20for%20pixels%20is%20defined%20as%20%601%60%20by%20default%5Cn///%20%20@include%20media('%3E128px')%20%7B%7D%5Cn///%5Cn///%20%20/*%20Generates:%20%2A/%5Cn///%20%20@media%20(min-width:%20129px)%20%7B%7D%5Cn///%5Cn///%20@example%20scss%20-%20Interval%20for%20ems%20is%20defined%20as%20%600.01%60%20by%20default%5Cn///%20%20@include%20media('%3E20em')%20%7B%7D%5Cn///%5Cn///%20%20/*%20Generates:%20%2A/%5Cn///%20%20@media%20(min-width:%2020.01em)%20%7B%7D%5Cn///%5Cn///%20@example%20scss%20-%20Interval%20for%20rems%20is%20defined%20as%20%600.1%60%20by%20default,%20to%20be%20used%20with%20%60font-size:%2062.5%25;%60%5Cn///%20%20@include%20media('%3E2.0rem')%20%7B%7D%5Cn///%5Cn///%20%20/*%20Generates:%20%2A/%5Cn///%20%20@media%20(min-width:%202.1rem)%20%7B%7D%5Cn///%5Cn$unit-intervals:%20(%5Cn%20%20%20%20%20%20%20%20'px':%201,%5Cn%20%20%20%20%20%20%20%20'em':%200.01,%5Cn%20%20%20%20%20%20%20%20'rem':%200.1,%5Cn%20%20%20%20%20%20%20%20'':%200%5Cn)%20!default;%5Cn%5Cn///%5Cn///%20Defines%20whether%20support%20for%20media%20queries%20is%20available,%20useful%20for%20creating%20separate%20stylesheets%5Cn///%20for%20browsers%20that%20don't%20support%20media%20queries.%5Cn///%5Cn///%20@example%20scss%20-%20Disables%20support%20for%20media%20queries%5Cn///%20%20$im-media-support:%20false;%5Cn///%20%20@include%20media('%3E=tablet')%20%7B%5Cn///%20%20%20%20.foo%20%7B%5Cn///%20%20%20%20%20%20color:%20tomato;%5Cn///%20%20%20%20%7D%5Cn///%20%20%7D%5Cn///%5Cn///%20%20/*%20Generates:%20%2A/%5Cn///%20%20.foo%20%7B%5Cn///%20%20%20%20color:%20tomato;%5Cn///%20%20%7D%5Cn///%5Cn$im-media-support:%20true%20!default;%5Cn%5Cn///%5Cn///%20Selects%20which%20breakpoint%20to%20emulate%20when%20support%20for%20media%20queries%20is%20disabled.%20Media%20queries%20that%20start%20at%20or%5Cn///%20intercept%20the%20breakpoint%20will%20be%20displayed,%20any%20others%20will%20be%20ignored.%5Cn///%5Cn///%20@example%20scss%20-%20This%20media%20query%20will%20show%20because%20it%20intercepts%20the%20static%20breakpoint%5Cn///%20%20$im-media-support:%20false;%5Cn///%20%20$im-no-media-breakpoint:%20'desktop';%5Cn///%20%20@include%20media('%3E=tablet')%20%7B%5Cn///%20%20%20%20.foo%20%7B%5Cn///%20%20%20%20%20%20color:%20tomato;%5Cn///%20%20%20%20%7D%5Cn///%20%20%7D%5Cn///%5Cn///%20%20/*%20Generates:%20%2A/%5Cn///%20%20.foo%20%7B%5Cn///%20%20%20%20color:%20tomato;%5Cn///%20%20%7D%5Cn///%5Cn///%20@example%20scss%20-%20This%20media%20query%20will%20NOT%20show%20because%20it%20does%20not%20intercept%20the%20desktop%20breakpoint%5Cn///%20%20$im-media-support:%20false;%5Cn///%20%20$im-no-media-breakpoint:%20'tablet';%5Cn///%20%20@include%20media('%3E=desktop')%20%7B%5Cn///%20%20%20%20.foo%20%7B%5Cn///%20%20%20%20%20%20color:%20tomato;%5Cn///%20%20%20%20%7D%5Cn///%20%20%7D%5Cn///%5Cn///%20%20/*%20No%20output%20%2A/%5Cn///%5Cn$im-no-media-breakpoint:%20'desktop'%20!default;%5Cn%5Cn///%5Cn///%20Selects%20which%20media%20expressions%20are%20allowed%20in%20an%20expression%20for%20it%20to%20be%20used%20when%20media%20queries%5Cn///%20are%20not%20supported.%5Cn///%5Cn///%20@example%20scss%20-%20This%20media%20query%20will%20show%20because%20it%20intercepts%20the%20static%20breakpoint%20and%20contains%20only%20accepted%20media%20expressions%5Cn///%20%20$im-media-support:%20false;%5Cn///%20%20$im-no-media-breakpoint:%20'desktop';%5Cn///%20%20$im-no-media-expressions:%20('screen');%5Cn///%20%20@include%20media('%3E=tablet',%20'screen')%20%7B%5Cn///%20%20%20%20.foo%20%7B%5Cn///%20%20%20%20%20%20color:%20tomato;%5Cn///%20%20%20%20%7D%5Cn///%20%20%7D%5Cn///%5Cn///%20%20%20/*%20Generates:%20%2A/%5Cn///%20%20%20.foo%20%7B%5Cn///%20%20%20%20%20color:%20tomato;%5Cn///%20%20%20%7D%5Cn///%5Cn///%20@example%20scss%20-%20This%20media%20query%20will%20NOT%20show%20because%20it%20intercepts%20the%20static%20breakpoint%20but%20contains%20a%20media%20expression%20that%20is%20not%20accepted%5Cn///%20%20$im-media-support:%20false;%5Cn///%20%20$im-no-media-breakpoint:%20'desktop';%5Cn///%20%20$im-no-media-expressions:%20('screen');%5Cn///%20%20@include%20media('%3E=tablet',%20'retina2x')%20%7B%5Cn///%20%20%20%20.foo%20%7B%5Cn///%20%20%20%20%20%20color:%20tomato;%5Cn///%20%20%20%20%7D%5Cn///%20%20%7D%5Cn///%5Cn///%20%20/*%20No%20output%20%2A/%5Cn///%5Cn$im-no-media-expressions:%20('screen',%20'portrait',%20'landscape')%20!default;%5Cn%5Cn////%5Cn///%20Cross-engine%20logging%20engine%5Cn///%20@author%20Hugo%20Giraudel%5Cn///%20@access%20private%5Cn////%5Cn%5Cn%5Cn///%5Cn///%20Log%20a%20message%20either%20with%20%60@error%60%20if%20supported%5Cn///%20else%20with%20%60@warn%60,%20using%20%60feature-exists('at-error')%60%5Cn///%20to%20detect%20support.%5Cn///%5Cn///%20@param%20%7BString%7D%20$message%20-%20Message%20to%20log%5Cn///%5Cn@function%20im-log($message)%20%7B%5Cn%20%20@if%20feature-exists('at-error')%20%7B%5Cn%20%20%20%20@error%20$message;%5Cn%20%20%7D%20@else%20%7B%5Cn%20%20%20%20@warn%20$message;%5Cn%20%20%20%20$_:%20noop();%5Cn%20%20%7D%5Cn%5Cn%20%20@return%20$message;%5Cn%7D%5Cn%5Cn%5Cn///%5Cn///%20Wrapper%20mixin%20for%20the%20log%20function%20so%20it%20can%20be%20used%20with%20a%20more%20friendly%5Cn///%20API%20than%20%60@if%20im-log('..')%20%7B%7D%60%20or%20%60$_:%20im-log('..')%60.%20Basically,%20use%20the%20function%5Cn///%20within%20functions%20because%20it%20is%20not%20possible%20to%20include%20a%20mixin%20in%20a%20function%5Cn///%20and%20use%20the%20mixin%20everywhere%20else%20because%20it's%20much%20more%20elegant.%5Cn///%5Cn///%20@param%20%7BString%7D%20$message%20-%20Message%20to%20log%5Cn///%5Cn@mixin%20log($message)%20%7B%5Cn%20%20@if%20im-log($message)%20%7B%5Cn%20%20%7D%5Cn%7D%5Cn%5Cn%5Cn///%5Cn///%20Function%20with%20no%20%60@return%60%20called%20next%20to%20%60@warn%60%20in%20Sass%203.3%5Cn///%20to%20trigger%20a%20compiling%20error%20and%20stop%20the%20process.%5Cn///%5Cn@function%20noop()%20%7B%5Cn%7D%5Cn%5Cn///%5Cn///%20Determines%20whether%20a%20list%20of%20conditions%20is%20intercepted%20by%20the%20static%20breakpoint.%5Cn///%5Cn///%20@param%20%7BArglist%7D%20%20%20$conditions%20%20-%20Media%20query%20conditions%5Cn///%5Cn///%20@return%20%7BBoolean%7D%20-%20Returns%20true%20if%20the%20conditions%20are%20intercepted%20by%20the%20static%20breakpoint%5Cn///%5Cn@function%20im-intercepts-static-breakpoint($conditions...)%20%7B%5Cn%20%20$no-media-breakpoint-value:%20map-get($breakpoints,%20$im-no-media-breakpoint);%5Cn%5Cn%20%20@if%20not%20$no-media-breakpoint-value%20%7B%5Cn%20%20%20%20@if%20im-log('%60%23%7B$im-no-media-breakpoint%7D%60%20is%20not%20a%20valid%20breakpoint.')%20%7B%5Cn%20%20%20%20%7D%5Cn%20%20%7D%5Cn%5Cn%20%20@each%20$condition%20in%20$conditions%20%7B%5Cn%20%20%20%20@if%20not%20map-has-key($media-expressions,%20$condition)%20%7B%5Cn%20%20%20%20%20%20$operator:%20get-expression-operator($condition);%5Cn%20%20%20%20%20%20$prefix:%20get-expression-prefix($operator);%5Cn%20%20%20%20%20%20$value:%20get-expression-value($condition,%20$operator);%5Cn%5Cn%20%20%20%20%20%20@if%20($prefix%20==%20'max'%20and%20$value%20%3C=%20$no-media-breakpoint-value)%20or%5Cn%20%20%20%20%20%20%20%20%20%20($prefix%20==%20'min'%20and%20$value%20%3E%20$no-media-breakpoint-value)%20%7B%5Cn%20%20%20%20%20%20%20%20@return%20false;%5Cn%20%20%20%20%20%20%7D%5Cn%20%20%20%20%7D%20@else%20if%20not%20index($im-no-media-expressions,%20$condition)%20%7B%5Cn%20%20%20%20%20%20@return%20false;%5Cn%20%20%20%20%7D%5Cn%20%20%7D%5Cn%5Cn%20%20@return%20true;%5Cn%7D%5Cn%5Cn////%5Cn///%20Parsing%20engine%5Cn///%20@author%20Hugo%20Giraudel%5Cn///%20@access%20private%5Cn////%5Cn%5Cn%5Cn///%5Cn///%20Get%20operator%20of%20an%20expression%5Cn///%5Cn///%20@param%20%7BString%7D%20$expression%20-%20Expression%20to%20extract%20operator%20from%5Cn///%5Cn///%20@return%20%7BString%7D%20-%20Any%20of%20%60%3E=%60,%20%60%3E%60,%20%60%3C=%60,%20%60%3C%60,%20%60%E2%89%A5%60,%20%60%E2%89%A4%60%5Cn///%5Cn@function%20get-expression-operator($expression)%20%7B%5Cn%20%20@each%20$operator%20in%20('%3E=',%20'%3E',%20'%3C=',%20'%3C',%20'%E2%89%A5',%20'%E2%89%A4')%20%7B%5Cn%20%20%20%20@if%20str-index($expression,%20$operator)%20%7B%5Cn%20%20%20%20%20%20@return%20$operator;%5Cn%20%20%20%20%7D%5Cn%20%20%7D%5Cn%5Cn%20%20//%20It%20is%20not%20possible%20to%20include%20a%20mixin%20inside%20a%20function,%20so%20we%20have%20to%5Cn%20%20//%20rely%20on%20the%20%60im-log(..)%60%20function%20rather%20than%20the%20%60log(..)%60%20mixin.%20Because%5Cn%20%20//%20functions%20cannot%20be%20called%20anywhere%20in%20Sass,%20we%20need%20to%20hack%20the%20call%20in%5Cn%20%20//%20a%20dummy%20variable,%20such%20as%20%60$_%60.%20If%20anybody%20ever%20raise%20a%20scoping%20issue%20with%5Cn%20%20//%20Sass%203.3,%20change%20this%20line%20in%20%60@if%20im-log(..)%20%7B%7D%60%20instead.%5Cn%20%20$_:%20im-log('No%20operator%20found%20in%20%60%23%7B$expression%7D%60.');%5Cn%7D%5Cn%5Cn%5Cn///%5Cn///%20Get%20dimension%20of%20an%20expression,%20based%20on%20a%20found%20operator%5Cn///%5Cn///%20@param%20%7BString%7D%20$expression%20-%20Expression%20to%20extract%20dimension%20from%5Cn///%20@param%20%7BString%7D%20$operator%20-%20Operator%20from%20%60$expression%60%5Cn///%5Cn///%20@return%20%7BString%7D%20-%20%60width%60%20or%20%60height%60%20(or%20potentially%20anything%20else)%5Cn///%5Cn@function%20get-expression-dimension($expression,%20$operator)%20%7B%5Cn%20%20$operator-index:%20str-index($expression,%20$operator);%5Cn%20%20$parsed-dimension:%20str-slice($expression,%200,%20$operator-index%20-%201);%5Cn%20%20$dimension:%20'width';%5Cn%5Cn%20%20@if%20str-length($parsed-dimension)%20%3E%200%20%7B%5Cn%20%20%20%20$dimension:%20$parsed-dimension;%5Cn%20%20%7D%5Cn%5Cn%20%20@return%20$dimension;%5Cn%7D%5Cn%5Cn%5Cn///%5Cn///%20Get%20dimension%20prefix%20based%20on%20an%20operator%5Cn///%5Cn///%20@param%20%7BString%7D%20$operator%20-%20Operator%5Cn///%5Cn///%20@return%20%7BString%7D%20-%20%60min%60%20or%20%60max%60%5Cn///%5Cn@function%20get-expression-prefix($operator)%20%7B%5Cn%20%20@return%20if(index(('%3C',%20'%3C=',%20'%E2%89%A4'),%20$operator),%20'max',%20'min');%5Cn%7D%5Cn%5Cn%5Cn///%5Cn///%20Get%20value%20of%20an%20expression,%20based%20on%20a%20found%20operator%5Cn///%5Cn///%20@param%20%7BString%7D%20$expression%20-%20Expression%20to%20extract%20value%20from%5Cn///%20@param%20%7BString%7D%20$operator%20-%20Operator%20from%20%60$expression%60%5Cn///%5Cn///%20@return%20%7BNumber%7D%20-%20A%20numeric%20value%5Cn///%5Cn@function%20get-expression-value($expression,%20$operator)%20%7B%5Cn%20%20$operator-index:%20str-index($expression,%20$operator);%5Cn%20%20$value:%20str-slice($expression,%20$operator-index%20+%20str-length($operator));%5Cn%5Cn%20%20@if%20map-has-key($breakpoints,%20$value)%20%7B%5Cn%20%20%20%20$value:%20map-get($breakpoints,%20$value);%5Cn%20%20%7D%20@else%20%7B%5Cn%20%20%20%20$value:%20to-number($value);%5Cn%20%20%7D%5Cn%5Cn%20%20$interval:%20map-get($unit-intervals,%20unit($value));%5Cn%5Cn%20%20@if%20not%20$interval%20%7B%5Cn%20%20%20%20//%20It%20is%20not%20possible%20to%20include%20a%20mixin%20inside%20a%20function,%20so%20we%20have%20to%5Cn%20%20%20%20//%20rely%20on%20the%20%60im-log(..)%60%20function%20rather%20than%20the%20%60log(..)%60%20mixin.%20Because%5Cn%20%20%20%20//%20functions%20cannot%20be%20called%20anywhere%20in%20Sass,%20we%20need%20to%20hack%20the%20call%20in%5Cn%20%20%20%20//%20a%20dummy%20variable,%20such%20as%20%60$_%60.%20If%20anybody%20ever%20raise%20a%20scoping%20issue%20with%5Cn%20%20%20%20//%20Sass%203.3,%20change%20this%20line%20in%20%60@if%20im-log(..)%20%7B%7D%60%20instead.%5Cn%20%20%20%20$_:%20im-log('Unknown%20unit%20%60%23%7Bunit($value)%7D%60.');%5Cn%20%20%7D%5Cn%5Cn%20%20@if%20$operator%20==%20'%3E'%20%7B%5Cn%20%20%20%20$value:%20$value%20+%20$interval;%5Cn%20%20%7D%20@else%20if%20$operator%20==%20'%3C'%20%7B%5Cn%20%20%20%20$value:%20$value%20-%20$interval;%5Cn%20%20%7D%5Cn%5Cn%20%20@return%20$value;%5Cn%7D%5Cn%5Cn%5Cn///%5Cn///%20Parse%20an%20expression%20to%20return%20a%20valid%20media-query%20expression%5Cn///%5Cn///%20@param%20%7BString%7D%20$expression%20-%20Expression%20to%20parse%5Cn///%5Cn///%20@return%20%7BString%7D%20-%20Valid%20media%20query%5Cn///%5Cn@function%20parse-expression($expression)%20%7B%5Cn%20%20//%20If%20it%20is%20part%20of%20$media-expressions,%20it%20has%20no%20operator%5Cn%20%20//%20then%20there%20is%20no%20need%20to%20go%20any%20further,%20just%20return%20the%20value%5Cn%20%20@if%20map-has-key($media-expressions,%20$expression)%20%7B%5Cn%20%20%20%20@return%20map-get($media-expressions,%20$expression);%5Cn%20%20%7D%5Cn%5Cn%20%20$operator:%20get-expression-operator($expression);%5Cn%20%20$dimension:%20get-expression-dimension($expression,%20$operator);%5Cn%20%20$prefix:%20get-expression-prefix($operator);%5Cn%20%20$value:%20get-expression-value($expression,%20$operator);%5Cn%5Cn%20%20@return%20'(%23%7B$prefix%7D-%23%7B$dimension%7D:%20%23%7B$value%7D)';%5Cn%7D%5Cn%5Cn///%5Cn///%20Slice%20%60$list%60%20between%20%60$start%60%20and%20%60$end%60%20indexes%5Cn///%5Cn///%20@access%20private%5Cn///%5Cn///%20@param%20%7BList%7D%20$list%20-%20List%20to%20slice%5Cn///%20@param%20%7BNumber%7D%20$start%20%5B1%5D%20-%20Start%20index%5Cn///%20@param%20%7BNumber%7D%20$end%20%5Blength($list)%5D%20-%20End%20index%5Cn///%5Cn///%20@return%20%7BList%7D%20Sliced%20list%5Cn///%5Cn@function%20slice($list,%20$start:%201,%20$end:%20length($list))%20%7B%5Cn%20%20@if%20length($list)%20%3C%201%20or%20$start%20%3E%20$end%20%7B%5Cn%20%20%20%20@return%20();%5Cn%20%20%7D%5Cn%5Cn%20%20$result:%20();%5Cn%5Cn%20%20@for%20$i%20from%20$start%20through%20$end%20%7B%5Cn%20%20%20%20$result:%20append($result,%20nth($list,%20$i));%5Cn%20%20%7D%5Cn%5Cn%20%20@return%20$result;%5Cn%7D%5Cn%5Cn////%5Cn///%20String%20to%20number%20converter%5Cn///%20@author%20Hugo%20Giraudel%5Cn///%20@access%20private%5Cn////%5Cn%5Cn%5Cn///%5Cn///%20Casts%20a%20string%20into%20a%20number%5Cn///%5Cn///%20@param%20%7BString%20%7C%20Number%7D%20$value%20-%20Value%20to%20be%20parsed%5Cn///%5Cn///%20@return%20%7BNumber%7D%5Cn///%5Cn@function%20to-number($value)%20%7B%5Cn%20%20@if%20type-of($value)%20==%20'number'%20%7B%5Cn%20%20%20%20@return%20$value;%5Cn%20%20%7D%20@else%20if%20type-of($value)%20!=%20'string'%20%7B%5Cn%20%20%20%20$_:%20im-log('Value%20for%20%60to-number%60%20should%20be%20a%20number%20or%20a%20string.');%5Cn%20%20%7D%5Cn%5Cn%20%20$first-character:%20str-slice($value,%201,%201);%5Cn%20%20$result:%200;%5Cn%20%20$digits:%200;%5Cn%20%20$minus:%20($first-character%20==%20'-');%5Cn%20%20$numbers:%20('0':%200,%20'1':%201,%20'2':%202,%20'3':%203,%20'4':%204,%20'5':%205,%20'6':%206,%20'7':%207,%20'8':%208,%20'9':%209);%5Cn%5Cn%20%20//%20Remove%20+/-%20sign%20if%20present%20at%20first%20character%5Cn%20%20@if%20($first-character%20==%20'+'%20or%20$first-character%20==%20'-')%20%7B%5Cn%20%20%20%20$value:%20str-slice($value,%202);%5Cn%20%20%7D%5Cn%5Cn%20%20@for%20$i%20from%201%20through%20str-length($value)%20%7B%5Cn%20%20%20%20$character:%20str-slice($value,%20$i,%20$i);%5Cn%5Cn%20%20%20%20@if%20not%20(index(map-keys($numbers),%20$character)%20or%20$character%20==%20'.')%20%7B%5Cn%20%20%20%20%20%20@return%20to-length(if($minus,%20-$result,%20$result),%20str-slice($value,%20$i))%5Cn%20%20%20%20%7D%5Cn%5Cn%20%20%20%20@if%20$character%20==%20'.'%20%7B%5Cn%20%20%20%20%20%20$digits:%201;%5Cn%20%20%20%20%7D%20@else%20if%20$digits%20==%200%20%7B%5Cn%20%20%20%20%20%20$result:%20$result%20*%2010%20+%20map-get($numbers,%20$character);%5Cn%20%20%20%20%7D%20@else%20%7B%5Cn%20%20%20%20%20%20$digits:%20$digits%20*%2010;%5Cn%20%20%20%20%20%20$result:%20$result%20+%20map-get($numbers,%20$character)%20/%20$digits;%5Cn%20%20%20%20%7D%5Cn%20%20%7D%5Cn%5Cn%20%20@return%20if($minus,%20-$result,%20$result);%5Cn%7D%5Cn%5Cn%5Cn///%5Cn///%20Add%20%60$unit%60%20to%20%60$value%60%5Cn///%5Cn///%20@param%20%7BNumber%7D%20$value%20-%20Value%20to%20add%20unit%20to%5Cn///%20@param%20%7BString%7D%20$unit%20-%20String%20representation%20of%20the%20unit%5Cn///%5Cn///%20@return%20%7BNumber%7D%20-%20%60$value%60%20expressed%20in%20%60$unit%60%5Cn///%5Cn@function%20to-length($value,%20$unit)%20%7B%5Cn%20%20$units:%20('px':%201px,%20'cm':%201cm,%20'mm':%201mm,%20'%25':%201%25,%20'ch':%201ch,%20'pc':%201pc,%20'in':%201in,%20'em':%201em,%20'rem':%201rem,%20'pt':%201pt,%20'ex':%201ex,%20'vw':%201vw,%20'vh':%201vh,%20'vmin':%201vmin,%20'vmax':%201vmax);%5Cn%5Cn%20%20@if%20not%20index(map-keys($units),%20$unit)%20%7B%5Cn%20%20%20%20$_:%20im-log('Invalid%20unit%20%60%23%7B$unit%7D%60.');%5Cn%20%20%7D%5Cn%5Cn%20%20@return%20$value%20*%20map-get($units,%20$unit);%5Cn%7D%5Cn%5Cn///%5Cn///%20This%20mixin%20aims%20at%20redefining%20the%20configuration%20just%20for%20the%20scope%20of%5Cn///%20the%20call.%20It%20is%20helpful%20when%20having%20a%20component%20needing%20an%20extended%5Cn///%20configuration%20such%20as%20custom%20breakpoints%20(referred%20to%20as%20tweakpoints)%5Cn///%20for%20instance.%5Cn///%5Cn///%20@author%20Hugo%20Giraudel%5Cn///%5Cn///%20@param%20%7BMap%7D%20$tweakpoints%20%5B()%5D%20-%20Map%20of%20tweakpoints%20to%20be%20merged%20with%20%60$breakpoints%60%5Cn///%20@param%20%7BMap%7D%20$tweak-media-expressions%20%5B()%5D%20-%20Map%20of%20tweaked%20media%20expressions%20to%20be%20merged%20with%20%60$media-expression%60%5Cn///%5Cn///%20@example%20scss%20-%20Extend%20the%20global%20breakpoints%20with%20a%20tweakpoint%5Cn///%20%20@include%20media-context(('custom':%20678px))%20%7B%5Cn///%20%20%20%20.foo%20%7B%5Cn///%20%20%20%20%20%20@include%20media('%3Ephone',%20'%3C=custom')%20%7B%5Cn///%20%20%20%20%20%20%20//%20...%5Cn///%20%20%20%20%20%20%7D%5Cn///%20%20%20%20%7D%5Cn///%20%20%7D%5Cn///%5Cn///%20@example%20scss%20-%20Extend%20the%20global%20media%20expressions%20with%20a%20custom%20one%5Cn///%20%20@include%20media-context($tweak-media-expressions:%20('all':%20'all'))%20%7B%5Cn///%20%20%20%20.foo%20%7B%5Cn///%20%20%20%20%20%20@include%20media('all',%20'%3Ephone')%20%7B%5Cn///%20%20%20%20%20%20%20//%20...%5Cn///%20%20%20%20%20%20%7D%5Cn///%20%20%20%20%7D%5Cn///%20%20%7D%5Cn///%5Cn///%20@example%20scss%20-%20Extend%20both%20configuration%20maps%5Cn///%20%20@include%20media-context(('custom':%20678px),%20('all':%20'all'))%20%7B%5Cn///%20%20%20%20.foo%20%7B%5Cn///%20%20%20%20%20%20@include%20media('all',%20'%3Ephone',%20'%3C=custom')%20%7B%5Cn///%20%20%20%20%20%20%20//%20...%5Cn///%20%20%20%20%20%20%7D%5Cn///%20%20%20%20%7D%5Cn///%20%20%7D%5Cn///%5Cn@mixin%20media-context($tweakpoints:%20(),%20$tweak-media-expressions:%20())%20%7B%5Cn%20%20//%20Save%20global%20configuration%5Cn%20%20$global-breakpoints:%20$breakpoints;%5Cn%20%20$global-media-expressions:%20$media-expressions;%5Cn%5Cn%20%20//%20Update%20global%20configuration%5Cn%20%20$breakpoints:%20map-merge($breakpoints,%20$tweakpoints)%20!global;%5Cn%20%20$media-expressions:%20map-merge($media-expressions,%20$tweak-media-expressions)%20!global;%5Cn%5Cn%20%20@content;%5Cn%5Cn%20%20//%20Restore%20global%20configuration%5Cn%20%20$breakpoints:%20$global-breakpoints%20!global;%5Cn%20%20$media-expressions:%20$global-media-expressions%20!global;%5Cn%7D%5Cn%5Cn////%5Cn///%20include-media%20public%20exposed%20API%5Cn///%20@author%20Eduardo%20Boucas%5Cn///%20@access%20public%5Cn////%5Cn%5Cn%5Cn///%5Cn///%20Generates%20a%20media%20query%20based%20on%20a%20list%20of%20conditions%5Cn///%5Cn///%20@param%20%7BArglist%7D%20%20%20$conditions%20%20-%20Media%20query%20conditions%5Cn///%5Cn///%20@example%20scss%20-%20With%20a%20single%20set%20breakpoint%5Cn///%20%20@include%20media('%3Ephone')%20%7B%20%7D%5Cn///%5Cn///%20@example%20scss%20-%20With%20two%20set%20breakpoints%5Cn///%20%20@include%20media('%3Ephone',%20'%3C=tablet')%20%7B%20%7D%5Cn///%5Cn///%20@example%20scss%20-%20With%20custom%20values%5Cn///%20%20@include%20media('%3E=358px',%20'%3C850px')%20%7B%20%7D%5Cn///%5Cn///%20@example%20scss%20-%20With%20set%20breakpoints%20with%20custom%20values%5Cn///%20%20@include%20media('%3Edesktop',%20'%3C=1350px')%20%7B%20%7D%5Cn///%5Cn///%20@example%20scss%20-%20With%20a%20static%20expression%5Cn///%20%20@include%20media('retina2x')%20%7B%20%7D%5Cn///%5Cn///%20@example%20scss%20-%20Mixing%20everything%5Cn///%20%20@include%20media('%3E=350px',%20'%3Ctablet',%20'retina3x')%20%7B%20%7D%5Cn///%5Cn@mixin%20media($conditions...)%20%7B%5Cn%20%20@if%20($im-media-support%20and%20length($conditions)%20==%200)%20or%5Cn%20%20%20%20%20%20(not%20$im-media-support%20and%20im-intercepts-static-breakpoint($conditions...))%20%7B%5Cn%20%20%20%20@content;%5Cn%20%20%7D%20@else%20if%20($im-media-support%20and%20length($conditions)%20%3E%200)%20%7B%5Cn%20%20%20%20@media%20%23%7Bunquote(parse-expression(nth($conditions,%201)))%7D%20%7B%5Cn%20%20%20%20%20%20//%20Recursive%20call%5Cn%20%20%20%20%20%20@include%20media(slice($conditions,%202)%5Cn%20%20%20%20%20%20...)%20%7B%5Cn%20%20%20%20%20%20%20%20@content;%5Cn%20%20%20%20%20%20%7D%5Cn%20%20%20%20%7D%5Cn%20%20%7D%5Cn%7D%22%5D%7D */