:root { 
  font-size: 20px;
  --fs-xs: .75rem;
  --fs-sm: .875rem;
  --fs-base: 1rem;
  --fs-lg: 1.125rem;
  --fs-xl: 1.25rem;
  --fs-2xl: 1.5rem;
  --fs-3xl: 1.875rem;
  --fs-4xl: 2.25rem;
  --fs-5xl: 3rem;
  --fs-6xl: 3.75rem;
  --fs-7xl: 4.5rem;
  --fs-8xl: 6rem;
}
*, *:before, *:after {
  background-repeat: no-repeat;
  background-size: cover;
  box-sizing: border-box;
}
html, body {
  font-size: 20px;
  margin: 0;
  padding: 0;
}
article,
aside,
div,
iframe,
footer,
header,
main,
section { max-width: 100%; }
a, [class*='hvr-'] { transition: all 0.3s ease; }
img, [class*='ar-'] { 
  height: auto; 
  max-width: 100%; 
}
img.setheight {
  height: revert-layer;
  max-width: none;
  width: auto;
}
img.setwidth {
  max-width: none ;
}
svg { max-width: 100%; max-height: 100%; }
nav a { text-decoration: none; }
.nav--child a.current { background-color:var(--offwhite); }
.link--top.current { border-bottom-color: var(--primary-500); }

.ac-str { align-content: stretch; }
.ai-fs { align-items: flex-start; }
.ai-fe { align-items: flex-end; }
.ai-c { align-items: center; }
.ai-s { align-items: stretch; }
.as-c { align-self: center; }
.as-fe { align-self: flex-end; }
.as-fs { align-self: flex-start; }

.cg-xs { column-gap: 30px; }
.cg16 { column-gap: 16px; }

.d-b { display: block; }
.d-c { display: contents; } /* parent el ignored */
.d-f { display: flex; }
.d-g { display: grid; }
.d-ib { display: inline-block; }
.d-i { display: inline; }
.d-n { display: none; }

.wrap {
	flex-wrap: wrap;
	flex-flow: row wrap;
}

.f-1 { flex:1; }
.fd-c { flex-direction: column; }
.fd-rr { flex-direction: row-reverse; }
.fw-w { flex-wrap: wrap; flex-flow: row wrap; }

.g36 { gap: 36px; }

.gtc-2 { grid-template-columns: 1fr 1fr; }
.gtc-3 { grid-template-columns: 1fr 1fr 1fr; }
.gtc-4 { grid-template-columns: 1fr 1fr 1fr 1fr; }
.gtc-5 { grid-template-columns: 1fr 1fr 1fr 1fr 1fr; }

.h-a { height: auto; }

.jc-fs { justify-content: flex-start; }
.jc-fe { justify-content: flex-end; }
.jc-c { justify-content: center; }
.jc-sa { justify-content: space-around; }
.jc-sb { justify-content: space-between; }
.jc-se { justify-content: space-evenly; }

.m0 { margin: 0; }
.m-a { margin: auto; }
.mlr-a { margin-left: auto; margin-right: auto; }
.mb0 { margin-bottom: 0; }
.mt0 { margin-top: 0; }
.mtb0 { margin-top: 0; margin-bottom: 0; }
.mb1 { margin-bottom: 1rem; }
.mb2 { margin-bottom: 2rem; }
.mb3 { margin-bottom: 3rem; }
.mt1 { margin-top: 1rem; }
.mt2 { margin-top: 2rem; }
.mt3 { margin-top: 3rem; }
.mtb1 { margin-top: 1rem; margin-bottom: 1rem; }
.mtb2 { margin-top: 2rem; margin-bottom: 2rem; }
.mtb3 { margin-top: 3rem; margin-bottom: 3rem; }
.mtb4 { margin-top: 4rem; margin-bottom: 4rem; }
.mtb2vh { margin-top: 2vh; margin-bottom: 2vh; }
.mh100 { max-height: 100%; }
.mh-100vh { min-height: 100vh; }
.mw100 { max-width: 100%; }
.mw-100vw { max-width: 100vw; }

.ov-h { overflow: hidden; }
.ox-c { overflow-x: clip; }
.oy-s { overflow-y: scroll; }

.p0 { padding: 0; }
.p1 { padding: 1rem; }
.p1p5 { padding:1.5rem; }
.p2 { padding: 2rem; }
.p3 { padding: 3rem; }
.pb1 { padding-bottom: 1rem; }
.pb2 { padding-bottom: 2rem; }
.pb3 { padding-bottom: 3rem; }
.pb4 { padding-bottom: 4rem; }
.pt1 { padding-top: 1rem; }
.pt2 { padding-top: 2rem; }
.pt3 { padding-top: 3rem; }
.pt4 { padding-top: 4rem; }
.pb1vh { padding-bottom: 1vh; }
.pb2vh { padding-bottom: 2vh; }
.pb3vh { padding-bottom: 3vh; }
.pb4vh { padding-bottom: 4vh; }
.pb5vh { padding-bottom: 5vh; }
.pb6vh { padding-bottom: 6vh; }
.pb7vh { padding-bottom: 7vh; }
.pb8vh { padding-bottom: 8vh; }
.pb9vh { padding-bottom: 9vh; }
.pb10vh { padding-bottom: 10vh; }
.pl1 { padding-left: 1rem; }
.pr1 { padding-right: 1rem; }
.plr1 { padding-left: 1rem; padding-right: 1rem; }
.plr2 { padding-left: 2rem; padding-right: 2rem; }
.plr5vw { padding-left: 5vw; padding-right: 5vw; }
.plr10vw { padding-left: 10vw; padding-right: 10vw; }
.plr15vw { padding-left: 15vw; padding-right: 15vw; }
.plr20vw { padding-left: 20vw; padding-right: 20vw; }
.pt1vh { padding-top: 1vh; }
.pt2vh { padding-top: 2vh; }
.pt3vh { padding-top: 3vh; }
.pt4vh { padding-top: 4vh; }
.pt5vh { padding-top: 5vh; }
.pt6vh { padding-top: 6vh; }
.pt7vh { padding-top: 7vh; }
.pt8vh { padding-top: 8vh; }
.pt9vh { padding-top: 9vh; }
.pt10vh { padding-top: 10vh; }
.ptb1 { padding-top: 1rem; padding-bottom: 1rem; }
.ptb2 { padding-top: 2rem; padding-bottom: 2rem; }
.ptb3 { padding-top: 3rem; padding-bottom: 3rem; }
.ps-a { position: absolute; }
.ps-r { position: relative; }
.ps-fill {
  position: absolute; 
  top: 0;
  bottom: 0; 
}
.ps-sticky { position: sticky; }
.ps-bottom, .ps-b { bottom: 0; }
.ps-l { left: 0; }
.ps-ri { right: 0; }
.ps-t { top: 0; }
.ps-fill, .ps-bottom, .ps-top {
  right: 0; 
  left: 0;
}

.rg-xs { row-gap: 15px; }

.w30 { width: 30%; }
.w100 { width: 100%; }
.w-fc { width: fit-content; }
.w-mc { width: max-content; }
.ws-nw { white-space: nowrap; }

.z1 { z-index:1; }
.z2 { z-index:2; }
.z3 { z-index:3; }
.z4 { z-index:4; }
.z5 { z-index:5; }
.z6 { z-index:6; }
.z7 { z-index:7; }
.z8 { z-index:8; }
.z9 { z-index:9; }
.z10 { z-index:10; }

.margin, .margin-wide, .margin-narrow { max-width: 100%; }
@media (min-width: 1024px) {
  .margin {
    margin-left:10%;
    margin-right:10%;
  }
  .margin-narrow {
    margin-left:15%;
    margin-right:15%;
  }
  .margin-wide {
    margin-left:5%;
    margin-right:5%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) {
  .margin {
    margin-left:7%;
    margin-right:7%;
  }
  .margin-narrow {
    margin-left:12%;
    margin-right:12%;
  }
  .margin-wide {
    margin-left:4%;
    margin-right:4%;
  }
}
@media (max-width: 767px) {
  .margin, .margin-wide {
    margin-left:30px;
    margin-right:30px;
  }
  .margin-narrow {
    margin-left:48px;
    margin-right:48px;
  }
}

hr { border:none; height: 1px; }