/* ==========================================================================
 * Settings
   ========================================================================== */
@font-face {
  font-family: 'Common Sans';
  font-weight: 400;
  font-style: normal;
  src: url('CommonSans-Regular.otf') format('otf');
}
/*! minireset.css v0.0.2 | MIT License | github.com/jgthms/minireset.css */
html,
body,
p,
ol,
ul,
li,
dl,
dt,
dd,
blockquote,
figure,
fieldset,
legend,
textarea,
pre,
iframe,
hr,
h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0;
  padding: 0;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: 100%;
  font-weight: normal;
}
button,
input,
select,
textarea {
  margin: 0;
}
html {
  box-sizing: border-box;
}
* {
  box-sizing: inherit;
}
*:before,
*:after {
  box-sizing: inherit;
}
img,
embed,
object,
audio,
video {
  height: auto;
  max-width: 100%;
}
iframe {
  border: 0;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
td,
th {
  padding: 0;
  text-align: left;
}
/* ==========================================================================
 * Content Basic
   ========================================================================== */
* {
  box-sizing: border-box;
}
*::selection {
  background: #000;
  color: #FFF;
  text-shadow: none;
}
body {
  color: #000000;
  font-size: 100%;
  font-family: "Common Sans", Helvetica, Arial, sans-serif;
  line-height: 1.5;
}
body.is-outlined * {
  outline: 1px solid red!important;
}
.container {
  position: relative;
  width: 100%;
  padding: 0 7%;
}
@media only screen and (max-width: 64em) {
  .container {
    padding: 0 5%;
  }
}
@media only screen and (max-width: 37.5em) {
  .container {
    padding: 0 1.5em;
  }
}
.main {
  min-height: 75vh;
}
/* ==========================================================================
 * Content Elements
   ========================================================================== */
.content {
  width: 100%;
  max-width: 1080px;
  margin: 0 auto;
}
.content--text {
  max-width: 680px;
}
.content--wide {
  max-width: 1440px;
}
.content__image--l {
  padding-right: 4.5em;
}
@media only screen and (max-width: 48em) {
  .content__image--l {
    padding-right: 0;
    padding-bottom: 4.5em;
  }
}
@media only screen and (max-width: 30em) {
  .content__image--l {
    padding-bottom: 3em;
  }
}
@media only screen and (max-width: 48em) {
  .content__image--l img {
    width: 100%;
    max-width: 380px;
  }
}
/* ==========================================================================
 * Content Image
   ========================================================================== */
figure {
  margin: 3em 0;
  text-align: center;
}
@media only screen and (max-width: 30em) {
  figure {
    margin: 1.5em 0;
  }
}
figcaption {
  padding-top: 0.25em;
  color: #999999;
  font-size: 14px;
  font-size: 0.875rem;
  font-style: italic;
  text-align: left;
}
img {
  max-width: 100%;
  height: auto;
  vertical-align: middle;
}
.lazy-load {
  position: relative;
  padding-bottom: calc(100% / (var(--aspect-ratio)));
  background-color: #f2f2f2;
}
.img-cover {
  margin: 0;
}
.img-cover img {
  border: 1px solid #000000;
}
.img-cover-large {
  max-width: 420px;
}
.icon {
  display: inline-block;
  width: 16px;
  height: 16px;
  vertical-align: middle;
}
.icon--reverse {
  transform: rotate(180deg);
}
.icon--12 {
  width: 12px;
  height: 12px;
  margin-bottom: 4px;
}
.icon--24 {
  width: 24px;
  height: 24px;
}
.icon--32 {
  width: 32px;
  height: 32px;
}
.icon--40 {
  width: 40px;
  height: 40px;
}
.icon--48 {
  width: 48px;
  height: 48px;
}
.icon--64 {
  width: 64px;
  height: 64px;
}
/* ==========================================================================
 * Content Links
   ========================================================================== */
a {
  color: #000000;
  text-decoration: underline;
  text-decoration-color: var(--link-color);
}
a:hover,
a:focus {
  text-decoration: none;
}
a:focus {
  outline: 2px dotted var(--link-color);
}
.link-site {
  color: var(--font-color);
  font-size: 16px;
  font-size: clamp(18px, 1.5vw, 20px);
  font-weight: 500;
  letter-spacing: 0.025em;
  text-decoration: none;
}
.link-site span {
  display: block;
  width: 20px;
  height: 20px;
  border: 3px solid var(--font-color);
}
.link-site__circle {
  border-radius: 50%;
}
.link-site__diamond {
  transform: rotate(45deg);
}
/* ==========================================================================
 * Content Colors
   ========================================================================== */
.color-primary {
  color: #000000;
}
.color-secondary {
  color: #000000;
}
.color-copy {
  color: #000000;
}
.color-black {
  color: #000000;
}
.color-gray-1 {
  color: #333333;
}
.color-gray-2 {
  color: #666666;
}
.color-gray-3 {
  color: #999999;
}
.color-gray-4 {
  color: #cccccc;
}
.color-gray-5 {
  color: #f2f2f2;
}
.bg-color-primary {
  background-color: #000000;
}
.bg-color-secondary {
  background-color: #000000;
}
.bg-color-copy {
  background-color: #000000;
}
.bg-color-black {
  background-color: #000000;
}
.bg-color-gray-1 {
  background-color: #333333;
}
.bg-color-gray-2 {
  background-color: #666666;
}
.bg-color-gray-3 {
  background-color: #999999;
}
.bg-color-gray-4 {
  background-color: #cccccc;
}
.bg-color-gray-5 {
  background-color: #f2f2f2;
}
/* ==========================================================================
 * Content Typography
   ========================================================================== */
h1,
.h1,
h2,
.h2,
h3,
.h3,
h4,
.h4,
h5,
.h5,
h6,
.h6 {
  display: block;
  color: #000000;
  word-wrap: break-word;
  text-rendering: optimizeLegibility;
  line-height: 1.25em;
}
h1,
.h1 {
  margin-bottom: 0.5em;
  font-size: 48.828px;
  font-size: clamp(3.052rem, 6vw, 5.96rem);
}
h2,
.h2 {
  margin-bottom: 0.75em;
  font-size: 39.063px;
  font-size: clamp(1.953rem, 3.5vw, 2.441rem);
}
h2 a,
.h2 a {
  text-decoration: none;
}
h3,
.h3 {
  margin-bottom: 0.75em;
  font-size: 31.25px;
  font-size: clamp(1.563rem, 3vw, 1.953rem);
}
h4,
.h4 {
  margin-bottom: 1em;
  font-size: 25px;
  font-size: clamp(1.367rem, 2.5vw, 1.563rem);
}
h5,
.h5 {
  margin-bottom: 1em;
  font-size: 20px;
  font-size: 1.25rem;
}
p {
  margin-bottom: 1em;
  font-size: 16px;
  font-size: clamp(18px, 1.5vw, 20px);
  line-height: 1.5em;
}
p:last-child {
  margin-bottom: 0;
}
strong,
b {
  font-weight: 700;
}
em {
  font-style: italic;
}
.fontsize-default {
  font-size: 16px;
  font-size: clamp(18px, 1.5vw, 20px);
}
.fontlight {
  font-weight: 300;
}
.fontregular {
  font-weight: 400;
}
.fontmedium {
  font-weight: 500;
}
.fontsemibold {
  font-weight: 600;
}
.fontbold {
  font-weight: 700;
}
.fontitalic {
  font-style: italic;
}
/* ==========================================================================
 * Content Lists
   ========================================================================== */
ul {
  margin-bottom: 1.5em;
  padding-left: 1.5em;
}
ul li {
  margin-bottom: 0.5em;
  line-height: 1.4em;
  font-size: 16px;
  font-size: clamp(18px, 1.5vw, 20px);
}
ul.list-unstyled {
  padding: 0;
  list-style: none;
}
ul.list-unstyled li {
  margin-bottom: 0.25em;
}
ul.list-filter {
  margin-bottom: 6em;
  padding: 0 0 1.5em 0;
  border-bottom: 1px solid #000000;
  list-style: none;
}
@media only screen and (max-width: 48em) {
  ul.list-filter {
    margin-bottom: 4.5em;
  }
}
ul.list-filter li {
  display: inline-block;
  margin: 0 0.5em 0.25em 0;
}
@media only screen and (max-width: 37.5em) {
  ul.list-filter li {
    margin: 0 0.5em 0.25em 0;
  }
}
ul.list-filter li.is-active a {
  color: var(--link-color);
  text-decoration: none;
  font-style: italic;
}
ul.list-filter a {
  text-decoration-color: #000000;
}
ul.list {
  margin: 0;
  padding: 0;
  list-style: none;
}
ul.list li {
  margin-bottom: 1em;
  padding-bottom: 1em;
  border-bottom: 1px solid #000000;
}
ul.list li:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
  border: 0;
}
ul.list li.has-authors .dot:last-of-type {
  display: none;
}
ul.list .list__content {
  width: 88%;
}
@media only screen and (max-width: 37.5em) {
  ul.list .list__content {
    width: 100%;
  }
}
ul.list .list__aside {
  width: 10%;
  text-align: right;
}
@media only screen and (max-width: 37.5em) {
  ul.list .list__aside {
    width: 100%;
    margin-top: 0.25em;
    text-align: left;
  }
}
ul.list--disabled li,
ul.list--disabled a {
  color: #999999;
}
ul.list--disabled li {
  border-color: #cccccc;
}
/* ==========================================================================
 * Layout Flex-Grid
   ========================================================================== */
.row {
  position: relative;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
}
.row--start {
  justify-content: flex-start;
}
.row--around {
  justify-content: space-around;
}
.row--centered {
  justify-content: center;
  align-items: center;
}
.c-1 {
  width: 8.3333%;
}
.c-2 {
  width: 16.6667%;
}
.c-3 {
  width: 25%;
}
.c-4 {
  width: 33.3333%;
}
.c-5 {
  width: 41.6667%;
}
.c-6 {
  width: 50%;
}
.c-7 {
  width: 58.3333%;
}
.c-8 {
  width: 66.6667%;
}
.c-9 {
  width: 75%;
}
.c-10 {
  width: 83.3334%;
}
.c-11 {
  width: 91.6667%;
}
.c-12 {
  width: 100%;
}
@media only screen and (max-width: 48em) {
  .c-1,
  .c-2,
  .c-3,
  .c-4,
  .c-5,
  .c-6,
  .c-7,
  .c-8,
  .c-9,
  .c-10,
  .c-11,
  .c-12 {
    width: 100%;
  }
  .c-1.c-half,
  .c-2.c-half,
  .c-3.c-half,
  .c-4.c-half,
  .c-5.c-half,
  .c-6.c-half,
  .c-7.c-half,
  .c-8.c-half,
  .c-9.c-half,
  .c-10.c-half,
  .c-11.c-half,
  .c-12.c-half {
    width: 50%;
  }
  .c-1.c-quarter,
  .c-2.c-quarter,
  .c-3.c-quarter,
  .c-4.c-quarter,
  .c-5.c-quarter,
  .c-6.c-quarter,
  .c-7.c-quarter,
  .c-8.c-quarter,
  .c-9.c-quarter,
  .c-10.c-quarter,
  .c-11.c-quarter,
  .c-12.c-quarter {
    width: 20%;
  }
}
@media only screen and (max-width: 30em) {
  .c-1.c-half,
  .c-2.c-half,
  .c-3.c-half,
  .c-4.c-half,
  .c-5.c-half,
  .c-6.c-half,
  .c-7.c-half,
  .c-8.c-half,
  .c-9.c-half,
  .c-10.c-half,
  .c-11.c-half,
  .c-12.c-half {
    width: 100%;
  }
  .c-1.c-quarter,
  .c-2.c-quarter,
  .c-3.c-quarter,
  .c-4.c-quarter,
  .c-5.c-quarter,
  .c-6.c-quarter,
  .c-7.c-quarter,
  .c-8.c-quarter,
  .c-9.c-quarter,
  .c-10.c-quarter,
  .c-11.c-quarter,
  .c-12.c-quarter {
    width: 50%;
  }
}
/* ==========================================================================
 * Layout Header
 * ========================================================================== */
.header {
  position: relative;
}
.header--home .nav-primary ul a,
.header--home .link-site {
  color: var(--home-font-color);
}
@media only screen and (max-width: 48em) {
  .header--home .nav-primary ul a,
  .header--home .link-site {
    color: var(--font-color);
  }
}
.header--home .nav-primary ul a:hover,
.header--home .link-site span {
  border-color: var(--home-font-color);
}
.header--home .btn-menu--open {
  color: var(--home-font-color);
}
@media only screen and (max-width: 48em) {
  .header--home .btn-menu--open {
    color: var(--font-color);
  }
}
/* ==========================================================================
 * Layout Hero
 * ========================================================================== */
.hero {
  position: relative;
  background-color: var(--bg-color);
}
.hero__title {
  width: 75%;
}
@media only screen and (max-width: 48em) {
  .hero__title {
    width: 100%;
  }
}
.hero__headline,
.hero__subline {
  margin: 0;
  color: var(--font-color);
  letter-spacing: -1px;
  line-height: 0.95em;
}
@media only screen and (max-width: 37.5em) {
  .hero__headline,
  .hero__subline {
    letter-spacing: 0;
  }
}
@media only screen and (max-width: 30em) {
  .hero__headline,
  .hero__subline {
    line-height: 1.1em;
  }
}
.hero__headline--hidden {
  display: block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 2px;
}
.hero--large {
  padding: 7.5em 0 15em;
}
@media only screen and (max-width: 48em) {
  .hero--large {
    padding: 12em 0 15em;
  }
}
@media only screen and (max-width: 30em) {
  .hero--large {
    padding: 9em 0;
  }
}
.hero .hero-bgimage__caption {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  max-width: 320px;
  padding: 6px;
  background-color: black;
  color: white;
  font-size: 12px;
  font-size: 0.75rem;
  line-height: 1.25em;
}
.hero--bgimage {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.hero--fullscreen {
  height: 100vh;
  min-height: 480px;
  padding: 0;
}
@media only screen and (max-width: 48em) {
  .hero--fullscreen {
    height: 90vh;
  }
}
.hero--fullscreen .hero__title {
  position: absolute;
  left: 7%;
  top: 50%;
  width: 90%;
  transform: translateY(-50%);
}
@media only screen and (max-width: 48em) {
  .hero--fullscreen .hero__title {
    left: 5%;
  }
}
@media only screen and (max-width: 37.5em) {
  .hero--fullscreen .hero__title {
    left: 1.5em;
  }
}
.hero--small {
  padding-top: 3em;
}
@media only screen and (max-width: 48em) {
  .hero--small {
    padding-top: 7.5em;
  }
}
.hero--home .hero__headline,
.hero--home .hero__subline {
  color: var(--home-font-color);
  font-size: 53.406px;
  font-size: clamp(3.338rem, 6vw, 7.451rem);
}
/* ==========================================================================
 * Layout Article
 * ========================================================================== */
.article {
  position: relative;
}
/* ==========================================================================
 * Layout Section
 * ========================================================================== */
.section {
  position: relative;
}
.section__headline {
  display: block;
  margin-bottom: 1.5em;
  color: #999999;
  font-size: 16px;
  font-size: clamp(18px, 1.5vw, 20px);
  text-transform: uppercase;
}
@media only screen and (max-width: 30em) {
  .section__headline {
    margin-bottom: 0.75em;
  }
}
/* ==========================================================================
 * Layout Footer
 * ========================================================================== */
.footer {
  position: relative;
  padding: 1.5em 0 1.5em;
  text-align: right;
}
@media only screen and (max-width: 64em) {
  .footer {
    padding-top: 3em;
  }
}
@media only screen and (max-width: 30em) {
  .footer {
    padding-top: 1.5em;
    text-align: center;
  }
}
.footer a {
  display: inline-block;
  margin-left: 6px;
}
@media only screen and (max-width: 30em) {
  .footer__copyright {
    display: block;
  }
}
/* ==========================================================================
 * Component Button
   ========================================================================== */
.btn {
  position: relative;
  display: inline-block;
  margin: 0.5em 0;
  padding: 0.75em 1.25em;
  background: #000000;
  border: none;
  color: #FFF;
  font-family: "Common Sans", Helvetica, Arial, sans-serif;
  font-size: 14px;
  font-size: 0.875rem;
  text-align: center;
  text-transform: uppercase;
  text-decoration: none;
  vertical-align: middle;
  cursor: pointer;
  transition: 300ms ease-in-out;
  appearance: none;
}
.btn:hover,
.btn:focus {
  background: #000000;
  color: #FFF;
}
.btn--outline {
  background: none;
  border: 2px solid #000000;
  color: #000000;
}
.btn--outline:hover,
.btn--outline:focus {
  background: #000000;
  color: #FFF;
}
.btn--rounded {
  border-radius: 32px;
}
.btn--large {
  padding: 1em 2em;
  font-size: 16px;
  font-size: 1rem;
}
.btn--small {
  padding: 0.75em 1.25em 0.6em;
  font-size: 12px;
  font-size: 0.75rem;
}
.btn-menu {
  display: none;
  width: 32px;
  height: 32px;
  padding: 0;
  border: 0;
  background-color: transparent;
  cursor: pointer;
}
@media only screen and (max-width: 48em) {
  .btn-menu {
    display: block;
  }
}
.btn-menu--open {
  color: var(--font-color);
}
@media only screen and (max-width: 30em) {
  .btn-menu--open {
    margin-top: -2px;
  }
}
.btn-menu--close {
  margin: 1.5em auto 0;
  color: white;
}
/* ==========================================================================
 * Component Navigation
 * ========================================================================== */
.nav-container {
  padding-top: 3em;
  padding-bottom: 3em;
  background-color: var(--bg-color);
}
@media only screen and (max-width: 48em) {
  .nav-container {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    padding-top: 1.5em;
    padding-bottom: 1.5em;
    border-bottom: 1px solid black;
    z-index: 10;
  }
}
@media only screen and (max-width: 30em) {
  .nav-container {
    padding-top: 0.75em;
    padding-bottom: 0.75em;
  }
}
.nav-container .row {
  align-items: center;
}
.nav-container--floating {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  background-color: transparent;
  z-index: 10;
}
@media only screen and (max-width: 48em) {
  .nav-container--floating {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    padding-top: 1.5em;
    padding-bottom: 1.5em;
    background-color: var(--bg-color);
  }
}
@media only screen and (max-width: 30em) {
  .nav-container--floating {
    padding-top: 0.75em;
    padding-bottom: 0.75em;
  }
}
.nav-primary {
  position: relative;
}
@media only screen and (max-width: 48em) {
  .nav-primary {
    display: none;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 20;
    background-color: #000000;
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
  }
}
.nav-primary ul {
  display: inline-block;
  margin: 0;
  padding: 0;
  list-style: none;
  text-align: right;
}
@media only screen and (max-width: 48em) {
  .nav-primary ul {
    display: block;
    padding-top: 6em;
    text-align: center;
  }
}
@media only screen and (max-width: 30em) {
  .nav-primary ul {
    padding-top: 3em;
  }
}
.nav-primary ul li.nav__item {
  display: inline-block;
  margin: 0 0 0 1.5em;
}
@media only screen and (max-width: 64em) {
  .nav-primary ul li.nav__item {
    margin: 0 0 0 0.75em;
  }
}
@media only screen and (max-width: 48em) {
  .nav-primary ul li.nav__item {
    display: block;
    margin: 0 0 1.5em 0;
  }
}
.nav-primary ul li.nav__item.is-active a {
  border-color: var(--font-color);
}
.nav-primary ul a {
  display: inline-block;
  color: var(--font-color);
  letter-spacing: 0.025em;
  border-bottom: 2px solid transparent;
  line-height: 1em;
  text-decoration: none;
  letter-spacing: 1px;
}
@media only screen and (max-width: 48em) {
  .nav-primary ul a {
    color: white!important;
  }
}
.nav-primary ul a:hover,
.nav-primary ul a:focus {
  border-color: var(--font-color);
}
@media only screen and (max-width: 48em) {
  .nav-primary ul a {
    font-size: 31.25px;
    font-size: clamp(1.953rem, 3.5vw, 2.441rem);
  }
}
.nav-primary ul.languages {
  display: inline-block;
  margin: 0 0 0 1.5em;
  padding: 0.2em 0.5em 0.25em;
  background-color: #000000;
}
@media only screen and (max-width: 48em) {
  .nav-primary ul.languages {
    display: block;
    margin: 0.75em 0 0 0;
    background-color: transparent;
  }
}
.nav-primary ul.languages li {
  display: inline-block;
  margin: 0 0.25em;
  line-height: 1em;
}
.nav-primary ul.languages li.is-active a {
  color: white!important;
}
@media only screen and (max-width: 48em) {
  .nav-primary ul.languages li.is-active a {
    color: #000000 !important;
  }
}
.nav-primary ul.languages a {
  color: #999999 !important;
  font-size: 16px;
  font-size: 1rem;
  text-transform: uppercase;
}
@media only screen and (max-width: 48em) {
  .nav-primary ul.languages a {
    font-size: 4vw;
  }
}
@media only screen and (max-width: 30em) {
  .nav-primary ul.languages a {
    font-size: 6vw;
  }
}
.nav-footer ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
@media only screen and (max-width: 48em) {
  .nav-footer ul {
    text-align: center;
  }
}
.nav-footer ul li {
  display: inline-block;
  margin: 0;
}
.nav-footer ul a {
  text-decoration-color: var(--link-color);
}
/* ==========================================================================
 * Component Work
 * ========================================================================== */
.works .work:last-of-type {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: 0;
}
.works--list .work {
  margin-bottom: 7.5em;
}
@media only screen and (max-width: 37.5em) {
  .works--list .work {
    margin-bottom: 4.5em;
    padding-bottom: 3em;
    border-bottom: 1px solid black;
  }
}
.works--list .img-cover {
  max-width: 340px;
}
@media only screen and (max-width: 48em) {
  .works--list .img-cover {
    margin: 0 auto;
  }
}
.works--cards .work {
  width: 33.3333%;
}
@media only screen and (max-width: 37.5em) {
  .works--cards .work {
    width: 50%;
  }
}
.works--cards .img-cover {
  max-width: 100%;
  padding: 0 1.5em 3em;
}
@media only screen and (max-width: 30em) {
  .works--cards .img-cover {
    padding: 0 0.75em 1.5em;
  }
}
/* ==========================================================================
 * Helpers Spacing
   ========================================================================== */
.mt-1 {
  margin-top: 1.5em;
}
@media only screen and (max-width: 48em) {
  .mt-1 {
    margin-top: 1.125em;
  }
}
@media only screen and (max-width: 30em) {
  .mt-1 {
    margin-top: 0.75em;
  }
}
.mt-2 {
  margin-top: 3em;
}
@media only screen and (max-width: 48em) {
  .mt-2 {
    margin-top: 2.25em;
  }
}
@media only screen and (max-width: 30em) {
  .mt-2 {
    margin-top: 1.5em;
  }
}
.mt-3 {
  margin-top: 4.5em;
}
@media only screen and (max-width: 48em) {
  .mt-3 {
    margin-top: 3.375em;
  }
}
@media only screen and (max-width: 30em) {
  .mt-3 {
    margin-top: 2.25em;
  }
}
.mt-4 {
  margin-top: 6em;
}
@media only screen and (max-width: 48em) {
  .mt-4 {
    margin-top: 4.5em;
  }
}
@media only screen and (max-width: 30em) {
  .mt-4 {
    margin-top: 3em;
  }
}
.mt-5 {
  margin-top: 7.5em;
}
@media only screen and (max-width: 48em) {
  .mt-5 {
    margin-top: 5.625em;
  }
}
@media only screen and (max-width: 30em) {
  .mt-5 {
    margin-top: 3.75em;
  }
}
.mt-6 {
  margin-top: 9em;
}
@media only screen and (max-width: 48em) {
  .mt-6 {
    margin-top: 6.75em;
  }
}
@media only screen and (max-width: 30em) {
  .mt-6 {
    margin-top: 4.5em;
  }
}
.mt-7 {
  margin-top: 10.5em;
}
@media only screen and (max-width: 48em) {
  .mt-7 {
    margin-top: 7.875em;
  }
}
@media only screen and (max-width: 30em) {
  .mt-7 {
    margin-top: 5.25em;
  }
}
.mt-8 {
  margin-top: 12em;
}
@media only screen and (max-width: 48em) {
  .mt-8 {
    margin-top: 9em;
  }
}
@media only screen and (max-width: 30em) {
  .mt-8 {
    margin-top: 6em;
  }
}
.mt-9 {
  margin-top: 13.5em;
}
@media only screen and (max-width: 48em) {
  .mt-9 {
    margin-top: 10.125em;
  }
}
@media only screen and (max-width: 30em) {
  .mt-9 {
    margin-top: 6.75em;
  }
}
.mt-10 {
  margin-top: 15em;
}
@media only screen and (max-width: 48em) {
  .mt-10 {
    margin-top: 11.25em;
  }
}
@media only screen and (max-width: 30em) {
  .mt-10 {
    margin-top: 7.5em;
  }
}
.mb-1 {
  margin-bottom: 1.5em;
}
@media only screen and (max-width: 48em) {
  .mb-1 {
    margin-bottom: 1.125em;
  }
}
@media only screen and (max-width: 30em) {
  .mb-1 {
    margin-bottom: 0.75em;
  }
}
.mb-2 {
  margin-bottom: 3em;
}
@media only screen and (max-width: 48em) {
  .mb-2 {
    margin-bottom: 2.25em;
  }
}
@media only screen and (max-width: 30em) {
  .mb-2 {
    margin-bottom: 1.5em;
  }
}
.mb-3 {
  margin-bottom: 4.5em;
}
@media only screen and (max-width: 48em) {
  .mb-3 {
    margin-bottom: 3.375em;
  }
}
@media only screen and (max-width: 30em) {
  .mb-3 {
    margin-bottom: 2.25em;
  }
}
.mb-4 {
  margin-bottom: 6em;
}
@media only screen and (max-width: 48em) {
  .mb-4 {
    margin-bottom: 4.5em;
  }
}
@media only screen and (max-width: 30em) {
  .mb-4 {
    margin-bottom: 3em;
  }
}
.mb-5 {
  margin-bottom: 7.5em;
}
@media only screen and (max-width: 48em) {
  .mb-5 {
    margin-bottom: 5.625em;
  }
}
@media only screen and (max-width: 30em) {
  .mb-5 {
    margin-bottom: 3.75em;
  }
}
.mb-6 {
  margin-bottom: 9em;
}
@media only screen and (max-width: 48em) {
  .mb-6 {
    margin-bottom: 6.75em;
  }
}
@media only screen and (max-width: 30em) {
  .mb-6 {
    margin-bottom: 4.5em;
  }
}
.mb-7 {
  margin-bottom: 10.5em;
}
@media only screen and (max-width: 48em) {
  .mb-7 {
    margin-bottom: 7.875em;
  }
}
@media only screen and (max-width: 30em) {
  .mb-7 {
    margin-bottom: 5.25em;
  }
}
.mb-8 {
  margin-bottom: 12em;
}
@media only screen and (max-width: 48em) {
  .mb-8 {
    margin-bottom: 9em;
  }
}
@media only screen and (max-width: 30em) {
  .mb-8 {
    margin-bottom: 6em;
  }
}
.mb-9 {
  margin-bottom: 13.5em;
}
@media only screen and (max-width: 48em) {
  .mb-9 {
    margin-bottom: 10.125em;
  }
}
@media only screen and (max-width: 30em) {
  .mb-9 {
    margin-bottom: 6.75em;
  }
}
.mb-10 {
  margin-bottom: 15em;
}
@media only screen and (max-width: 48em) {
  .mb-10 {
    margin-bottom: 11.25em;
  }
}
@media only screen and (max-width: 30em) {
  .mb-10 {
    margin-bottom: 7.5em;
  }
}
.mr-1 {
  margin-right: 1.5em;
}
@media only screen and (max-width: 48em) {
  .mr-1 {
    margin-right: 1.125em;
  }
}
@media only screen and (max-width: 30em) {
  .mr-1 {
    margin-right: 0.75em;
  }
}
.mr-2 {
  margin-right: 3em;
}
@media only screen and (max-width: 48em) {
  .mr-2 {
    margin-right: 2.25em;
  }
}
@media only screen and (max-width: 30em) {
  .mr-2 {
    margin-right: 1.5em;
  }
}
.mr-3 {
  margin-right: 4.5em;
}
@media only screen and (max-width: 48em) {
  .mr-3 {
    margin-right: 3.375em;
  }
}
@media only screen and (max-width: 30em) {
  .mr-3 {
    margin-right: 2.25em;
  }
}
.mr-4 {
  margin-right: 6em;
}
@media only screen and (max-width: 48em) {
  .mr-4 {
    margin-right: 4.5em;
  }
}
@media only screen and (max-width: 30em) {
  .mr-4 {
    margin-right: 3em;
  }
}
.mr-5 {
  margin-right: 7.5em;
}
@media only screen and (max-width: 48em) {
  .mr-5 {
    margin-right: 5.625em;
  }
}
@media only screen and (max-width: 30em) {
  .mr-5 {
    margin-right: 3.75em;
  }
}
.mr-6 {
  margin-right: 9em;
}
@media only screen and (max-width: 48em) {
  .mr-6 {
    margin-right: 6.75em;
  }
}
@media only screen and (max-width: 30em) {
  .mr-6 {
    margin-right: 4.5em;
  }
}
.mr-7 {
  margin-right: 10.5em;
}
@media only screen and (max-width: 48em) {
  .mr-7 {
    margin-right: 7.875em;
  }
}
@media only screen and (max-width: 30em) {
  .mr-7 {
    margin-right: 5.25em;
  }
}
.mr-8 {
  margin-right: 12em;
}
@media only screen and (max-width: 48em) {
  .mr-8 {
    margin-right: 9em;
  }
}
@media only screen and (max-width: 30em) {
  .mr-8 {
    margin-right: 6em;
  }
}
.mr-9 {
  margin-right: 13.5em;
}
@media only screen and (max-width: 48em) {
  .mr-9 {
    margin-right: 10.125em;
  }
}
@media only screen and (max-width: 30em) {
  .mr-9 {
    margin-right: 6.75em;
  }
}
.mr-10 {
  margin-right: 15em;
}
@media only screen and (max-width: 48em) {
  .mr-10 {
    margin-right: 11.25em;
  }
}
@media only screen and (max-width: 30em) {
  .mr-10 {
    margin-right: 7.5em;
  }
}
.ml-1 {
  margin-left: 1.5em;
}
@media only screen and (max-width: 48em) {
  .ml-1 {
    margin-left: 1.125em;
  }
}
@media only screen and (max-width: 30em) {
  .ml-1 {
    margin-left: 0.75em;
  }
}
.ml-2 {
  margin-left: 3em;
}
@media only screen and (max-width: 48em) {
  .ml-2 {
    margin-left: 2.25em;
  }
}
@media only screen and (max-width: 30em) {
  .ml-2 {
    margin-left: 1.5em;
  }
}
.ml-3 {
  margin-left: 4.5em;
}
@media only screen and (max-width: 48em) {
  .ml-3 {
    margin-left: 3.375em;
  }
}
@media only screen and (max-width: 30em) {
  .ml-3 {
    margin-left: 2.25em;
  }
}
.ml-4 {
  margin-left: 6em;
}
@media only screen and (max-width: 48em) {
  .ml-4 {
    margin-left: 4.5em;
  }
}
@media only screen and (max-width: 30em) {
  .ml-4 {
    margin-left: 3em;
  }
}
.ml-5 {
  margin-left: 7.5em;
}
@media only screen and (max-width: 48em) {
  .ml-5 {
    margin-left: 5.625em;
  }
}
@media only screen and (max-width: 30em) {
  .ml-5 {
    margin-left: 3.75em;
  }
}
.ml-6 {
  margin-top: 9em;
}
@media only screen and (max-width: 48em) {
  .ml-6 {
    margin-top: 6.75em;
  }
}
@media only screen and (max-width: 30em) {
  .ml-6 {
    margin-top: 4.5em;
  }
}
.ml-7 {
  margin-left: 10.5em;
}
@media only screen and (max-width: 48em) {
  .ml-7 {
    margin-left: 7.875em;
  }
}
@media only screen and (max-width: 30em) {
  .ml-7 {
    margin-left: 5.25em;
  }
}
.ml-8 {
  margin-left: 12em;
}
@media only screen and (max-width: 48em) {
  .ml-8 {
    margin-left: 9em;
  }
}
@media only screen and (max-width: 30em) {
  .ml-8 {
    margin-left: 6em;
  }
}
.ml-9 {
  margin-left: 13.5em;
}
@media only screen and (max-width: 48em) {
  .ml-9 {
    margin-left: 10.125em;
  }
}
@media only screen and (max-width: 30em) {
  .ml-9 {
    margin-left: 6.75em;
  }
}
.ml-10 {
  margin-left: 15em;
}
@media only screen and (max-width: 48em) {
  .ml-10 {
    margin-left: 11.25em;
  }
}
@media only screen and (max-width: 30em) {
  .ml-10 {
    margin-left: 7.5em;
  }
}
.mx-1 {
  margin-left: 1.5em;
  margin-right: 1.5em;
}
@media only screen and (max-width: 48em) {
  .mx-1 {
    margin-left: 1.125em;
  }
}
@media only screen and (max-width: 30em) {
  .mx-1 {
    margin-left: 0.75em;
  }
}
@media only screen and (max-width: 48em) {
  .mx-1 {
    margin-right: 1.125em;
  }
}
@media only screen and (max-width: 30em) {
  .mx-1 {
    margin-right: 0.75em;
  }
}
.mx-2 {
  margin-left: 3em;
  margin-right: 3em;
}
@media only screen and (max-width: 48em) {
  .mx-2 {
    margin-left: 2.25em;
  }
}
@media only screen and (max-width: 30em) {
  .mx-2 {
    margin-left: 1.5em;
  }
}
@media only screen and (max-width: 48em) {
  .mx-2 {
    margin-right: 2.25em;
  }
}
@media only screen and (max-width: 30em) {
  .mx-2 {
    margin-right: 1.5em;
  }
}
.mx-3 {
  margin-left: 4.5em;
  margin-right: 4.5em;
}
@media only screen and (max-width: 48em) {
  .mx-3 {
    margin-left: 3.375em;
  }
}
@media only screen and (max-width: 30em) {
  .mx-3 {
    margin-left: 2.25em;
  }
}
@media only screen and (max-width: 48em) {
  .mx-3 {
    margin-right: 3.375em;
  }
}
@media only screen and (max-width: 30em) {
  .mx-3 {
    margin-right: 2.25em;
  }
}
.mx-4 {
  margin-left: 6em;
  margin-right: 6em;
}
@media only screen and (max-width: 48em) {
  .mx-4 {
    margin-left: 4.5em;
  }
}
@media only screen and (max-width: 30em) {
  .mx-4 {
    margin-left: 3em;
  }
}
@media only screen and (max-width: 48em) {
  .mx-4 {
    margin-right: 4.5em;
  }
}
@media only screen and (max-width: 30em) {
  .mx-4 {
    margin-right: 3em;
  }
}
.mx-5 {
  margin-left: 7.5em;
  margin-right: 7.5em;
}
@media only screen and (max-width: 48em) {
  .mx-5 {
    margin-left: 5.625em;
  }
}
@media only screen and (max-width: 30em) {
  .mx-5 {
    margin-left: 3.75em;
  }
}
@media only screen and (max-width: 48em) {
  .mx-5 {
    margin-right: 5.625em;
  }
}
@media only screen and (max-width: 30em) {
  .mx-5 {
    margin-right: 3.75em;
  }
}
.mx-6 {
  margin-left: 9em;
  margin-right: 9em;
}
@media only screen and (max-width: 48em) {
  .mx-6 {
    margin-left: 6.75em;
  }
}
@media only screen and (max-width: 30em) {
  .mx-6 {
    margin-left: 4.5em;
  }
}
@media only screen and (max-width: 48em) {
  .mx-6 {
    margin-right: 6.75em;
  }
}
@media only screen and (max-width: 30em) {
  .mx-6 {
    margin-right: 4.5em;
  }
}
.mx-7 {
  margin-left: 10.5em;
  margin-right: 10.5em;
}
@media only screen and (max-width: 48em) {
  .mx-7 {
    margin-left: 7.875em;
  }
}
@media only screen and (max-width: 30em) {
  .mx-7 {
    margin-left: 5.25em;
  }
}
@media only screen and (max-width: 48em) {
  .mx-7 {
    margin-right: 7.875em;
  }
}
@media only screen and (max-width: 30em) {
  .mx-7 {
    margin-right: 5.25em;
  }
}
.mx-8 {
  margin-left: 12em;
  margin-right: 12em;
}
@media only screen and (max-width: 48em) {
  .mx-8 {
    margin-left: 9em;
  }
}
@media only screen and (max-width: 30em) {
  .mx-8 {
    margin-left: 6em;
  }
}
@media only screen and (max-width: 48em) {
  .mx-8 {
    margin-right: 9em;
  }
}
@media only screen and (max-width: 30em) {
  .mx-8 {
    margin-right: 6em;
  }
}
.mx-9 {
  margin-left: 13.5em;
  margin-right: 13.5em;
}
@media only screen and (max-width: 48em) {
  .mx-9 {
    margin-left: 10.125em;
  }
}
@media only screen and (max-width: 30em) {
  .mx-9 {
    margin-left: 6.75em;
  }
}
@media only screen and (max-width: 48em) {
  .mx-9 {
    margin-right: 10.125em;
  }
}
@media only screen and (max-width: 30em) {
  .mx-9 {
    margin-right: 6.75em;
  }
}
.mx-10 {
  margin-left: 15em;
  margin-right: 15em;
}
@media only screen and (max-width: 48em) {
  .mx-10 {
    margin-left: 11.25em;
  }
}
@media only screen and (max-width: 30em) {
  .mx-10 {
    margin-left: 7.5em;
  }
}
@media only screen and (max-width: 48em) {
  .mx-10 {
    margin-right: 11.25em;
  }
}
@media only screen and (max-width: 30em) {
  .mx-10 {
    margin-right: 7.5em;
  }
}
.my-1 {
  margin-top: 1.5em;
  margin-bottom: 1.5em;
}
@media only screen and (max-width: 48em) {
  .my-1 {
    margin-top: 1.125em;
  }
}
@media only screen and (max-width: 30em) {
  .my-1 {
    margin-top: 0.75em;
  }
}
@media only screen and (max-width: 48em) {
  .my-1 {
    margin-bottom: 1.125em;
  }
}
@media only screen and (max-width: 30em) {
  .my-1 {
    margin-bottom: 0.75em;
  }
}
.my-2 {
  margin-top: 3em;
  margin-bottom: 3em;
}
@media only screen and (max-width: 48em) {
  .my-2 {
    margin-top: 2.25em;
  }
}
@media only screen and (max-width: 30em) {
  .my-2 {
    margin-top: 1.5em;
  }
}
@media only screen and (max-width: 48em) {
  .my-2 {
    margin-bottom: 2.25em;
  }
}
@media only screen and (max-width: 30em) {
  .my-2 {
    margin-bottom: 1.5em;
  }
}
.my-3 {
  margin-top: 4.5em;
  margin-bottom: 4.5em;
}
@media only screen and (max-width: 48em) {
  .my-3 {
    margin-top: 3.375em;
  }
}
@media only screen and (max-width: 30em) {
  .my-3 {
    margin-top: 2.25em;
  }
}
@media only screen and (max-width: 48em) {
  .my-3 {
    margin-bottom: 3.375em;
  }
}
@media only screen and (max-width: 30em) {
  .my-3 {
    margin-bottom: 2.25em;
  }
}
.my-4 {
  margin-top: 6em;
  margin-bottom: 6em;
}
@media only screen and (max-width: 48em) {
  .my-4 {
    margin-top: 4.5em;
  }
}
@media only screen and (max-width: 30em) {
  .my-4 {
    margin-top: 3em;
  }
}
@media only screen and (max-width: 48em) {
  .my-4 {
    margin-bottom: 4.5em;
  }
}
@media only screen and (max-width: 30em) {
  .my-4 {
    margin-bottom: 3em;
  }
}
.my-5 {
  margin-top: 7.5em;
  margin-bottom: 7.5em;
}
@media only screen and (max-width: 48em) {
  .my-5 {
    margin-top: 5.625em;
  }
}
@media only screen and (max-width: 30em) {
  .my-5 {
    margin-top: 3.75em;
  }
}
@media only screen and (max-width: 48em) {
  .my-5 {
    margin-bottom: 5.625em;
  }
}
@media only screen and (max-width: 30em) {
  .my-5 {
    margin-bottom: 3.75em;
  }
}
.my-6 {
  margin-top: 9em;
  margin-bottom: 9em;
}
@media only screen and (max-width: 48em) {
  .my-6 {
    margin-top: 6.75em;
  }
}
@media only screen and (max-width: 30em) {
  .my-6 {
    margin-top: 4.5em;
  }
}
@media only screen and (max-width: 48em) {
  .my-6 {
    margin-bottom: 6.75em;
  }
}
@media only screen and (max-width: 30em) {
  .my-6 {
    margin-bottom: 4.5em;
  }
}
.my-7 {
  margin-top: 10.5em;
  margin-bottom: 10.5em;
}
@media only screen and (max-width: 48em) {
  .my-7 {
    margin-top: 7.875em;
  }
}
@media only screen and (max-width: 30em) {
  .my-7 {
    margin-top: 5.25em;
  }
}
@media only screen and (max-width: 48em) {
  .my-7 {
    margin-bottom: 7.875em;
  }
}
@media only screen and (max-width: 30em) {
  .my-7 {
    margin-bottom: 5.25em;
  }
}
.my-8 {
  margin-top: 12em;
  margin-bottom: 12em;
}
@media only screen and (max-width: 48em) {
  .my-8 {
    margin-top: 9em;
  }
}
@media only screen and (max-width: 30em) {
  .my-8 {
    margin-top: 6em;
  }
}
@media only screen and (max-width: 48em) {
  .my-8 {
    margin-bottom: 9em;
  }
}
@media only screen and (max-width: 30em) {
  .my-8 {
    margin-bottom: 6em;
  }
}
.my-9 {
  margin-top: 13.5em;
  margin-bottom: 13.5em;
}
@media only screen and (max-width: 48em) {
  .my-9 {
    margin-top: 10.125em;
  }
}
@media only screen and (max-width: 30em) {
  .my-9 {
    margin-top: 6.75em;
  }
}
@media only screen and (max-width: 48em) {
  .my-9 {
    margin-bottom: 10.125em;
  }
}
@media only screen and (max-width: 30em) {
  .my-9 {
    margin-bottom: 6.75em;
  }
}
.my-10 {
  margin-top: 15em;
  margin-bottom: 15em;
}
@media only screen and (max-width: 48em) {
  .my-10 {
    margin-top: 11.25em;
  }
}
@media only screen and (max-width: 30em) {
  .my-10 {
    margin-top: 7.5em;
  }
}
@media only screen and (max-width: 48em) {
  .my-10 {
    margin-bottom: 11.25em;
  }
}
@media only screen and (max-width: 30em) {
  .my-10 {
    margin-bottom: 7.5em;
  }
}
.pt-1 {
  padding-top: 1.5em;
}
@media only screen and (max-width: 48em) {
  .pt-1 {
    padding-top: 1.125em;
  }
}
@media only screen and (max-width: 30em) {
  .pt-1 {
    padding-top: 0.75em;
  }
}
.pt-2 {
  padding-top: 3em;
}
@media only screen and (max-width: 48em) {
  .pt-2 {
    padding-top: 2.25em;
  }
}
@media only screen and (max-width: 30em) {
  .pt-2 {
    padding-top: 1.5em;
  }
}
.pt-3 {
  padding-top: 4.5em;
}
@media only screen and (max-width: 48em) {
  .pt-3 {
    padding-top: 3.375em;
  }
}
@media only screen and (max-width: 30em) {
  .pt-3 {
    padding-top: 2.25em;
  }
}
.pt-4 {
  padding-top: 6em;
}
@media only screen and (max-width: 48em) {
  .pt-4 {
    padding-top: 4.5em;
  }
}
@media only screen and (max-width: 30em) {
  .pt-4 {
    padding-top: 3em;
  }
}
.pt-5 {
  padding-top: 7.5em;
}
@media only screen and (max-width: 48em) {
  .pt-5 {
    padding-top: 5.625em;
  }
}
@media only screen and (max-width: 30em) {
  .pt-5 {
    padding-top: 3.75em;
  }
}
.pt-6 {
  padding-top: 9em;
}
@media only screen and (max-width: 48em) {
  .pt-6 {
    padding-top: 6.75em;
  }
}
@media only screen and (max-width: 30em) {
  .pt-6 {
    padding-top: 4.5em;
  }
}
.pt-7 {
  padding-top: 10.5em;
}
@media only screen and (max-width: 48em) {
  .pt-7 {
    padding-top: 7.875em;
  }
}
@media only screen and (max-width: 30em) {
  .pt-7 {
    padding-top: 5.25em;
  }
}
.pt-8 {
  padding-top: 12em;
}
@media only screen and (max-width: 48em) {
  .pt-8 {
    padding-top: 9em;
  }
}
@media only screen and (max-width: 30em) {
  .pt-8 {
    padding-top: 6em;
  }
}
.pt-9 {
  padding-top: 13.5em;
}
@media only screen and (max-width: 48em) {
  .pt-9 {
    padding-top: 10.125em;
  }
}
@media only screen and (max-width: 30em) {
  .pt-9 {
    padding-top: 6.75em;
  }
}
.pt-10 {
  padding-top: 15em;
}
@media only screen and (max-width: 48em) {
  .pt-10 {
    padding-top: 11.25em;
  }
}
@media only screen and (max-width: 30em) {
  .pt-10 {
    padding-top: 7.5em;
  }
}
.pb-1 {
  padding-bottom: 1.5em;
}
@media only screen and (max-width: 48em) {
  .pb-1 {
    padding-bottom: 1.125em;
  }
}
@media only screen and (max-width: 30em) {
  .pb-1 {
    padding-bottom: 0.75em;
  }
}
.pb-2 {
  padding-bottom: 3em;
}
@media only screen and (max-width: 48em) {
  .pb-2 {
    padding-bottom: 2.25em;
  }
}
@media only screen and (max-width: 30em) {
  .pb-2 {
    padding-bottom: 1.5em;
  }
}
.pb-3 {
  padding-bottom: 4.5em;
}
@media only screen and (max-width: 48em) {
  .pb-3 {
    padding-bottom: 3.375em;
  }
}
@media only screen and (max-width: 30em) {
  .pb-3 {
    padding-bottom: 2.25em;
  }
}
.pb-4 {
  padding-bottom: 6em;
}
@media only screen and (max-width: 48em) {
  .pb-4 {
    padding-bottom: 4.5em;
  }
}
@media only screen and (max-width: 30em) {
  .pb-4 {
    padding-bottom: 3em;
  }
}
.pb-5 {
  padding-bottom: 7.5em;
}
@media only screen and (max-width: 48em) {
  .pb-5 {
    padding-bottom: 5.625em;
  }
}
@media only screen and (max-width: 30em) {
  .pb-5 {
    padding-bottom: 3.75em;
  }
}
.pb-6 {
  padding-bottom: 9em;
}
@media only screen and (max-width: 48em) {
  .pb-6 {
    padding-bottom: 6.75em;
  }
}
@media only screen and (max-width: 30em) {
  .pb-6 {
    padding-bottom: 4.5em;
  }
}
.pb-7 {
  padding-bottom: 10.5em;
}
@media only screen and (max-width: 48em) {
  .pb-7 {
    padding-bottom: 7.875em;
  }
}
@media only screen and (max-width: 30em) {
  .pb-7 {
    padding-bottom: 5.25em;
  }
}
.pb-8 {
  padding-bottom: 12em;
}
@media only screen and (max-width: 48em) {
  .pb-8 {
    padding-bottom: 9em;
  }
}
@media only screen and (max-width: 30em) {
  .pb-8 {
    padding-bottom: 6em;
  }
}
.pb-9 {
  padding-bottom: 13.5em;
}
@media only screen and (max-width: 48em) {
  .pb-9 {
    padding-bottom: 10.125em;
  }
}
@media only screen and (max-width: 30em) {
  .pb-9 {
    padding-bottom: 6.75em;
  }
}
.pb-10 {
  padding-bottom: 15em;
}
@media only screen and (max-width: 48em) {
  .pb-10 {
    padding-bottom: 11.25em;
  }
}
@media only screen and (max-width: 30em) {
  .pb-10 {
    padding-bottom: 7.5em;
  }
}
.pr-1 {
  padding-right: 1.5em;
}
@media only screen and (max-width: 48em) {
  .pr-1 {
    padding-right: 1.125em;
  }
}
@media only screen and (max-width: 30em) {
  .pr-1 {
    padding-right: 0.75em;
  }
}
.pr-2 {
  padding-right: 3em;
}
@media only screen and (max-width: 48em) {
  .pr-2 {
    padding-right: 2.25em;
  }
}
@media only screen and (max-width: 30em) {
  .pr-2 {
    padding-right: 1.5em;
  }
}
.pr-3 {
  padding-right: 4.5em;
}
@media only screen and (max-width: 48em) {
  .pr-3 {
    padding-right: 3.375em;
  }
}
@media only screen and (max-width: 30em) {
  .pr-3 {
    padding-right: 2.25em;
  }
}
.pr-4 {
  padding-right: 6em;
}
@media only screen and (max-width: 48em) {
  .pr-4 {
    padding-right: 4.5em;
  }
}
@media only screen and (max-width: 30em) {
  .pr-4 {
    padding-right: 3em;
  }
}
.pr-5 {
  padding-right: 7.5em;
}
@media only screen and (max-width: 48em) {
  .pr-5 {
    padding-right: 5.625em;
  }
}
@media only screen and (max-width: 30em) {
  .pr-5 {
    padding-right: 3.75em;
  }
}
.pr-6 {
  padding-right: 9em;
}
@media only screen and (max-width: 48em) {
  .pr-6 {
    padding-right: 6.75em;
  }
}
@media only screen and (max-width: 30em) {
  .pr-6 {
    padding-right: 4.5em;
  }
}
.pr-7 {
  padding-right: 10.5em;
}
@media only screen and (max-width: 48em) {
  .pr-7 {
    padding-right: 7.875em;
  }
}
@media only screen and (max-width: 30em) {
  .pr-7 {
    padding-right: 5.25em;
  }
}
.pr-8 {
  padding-right: 12em;
}
@media only screen and (max-width: 48em) {
  .pr-8 {
    padding-right: 9em;
  }
}
@media only screen and (max-width: 30em) {
  .pr-8 {
    padding-right: 6em;
  }
}
.pr-9 {
  padding-right: 13.5em;
}
@media only screen and (max-width: 48em) {
  .pr-9 {
    padding-right: 10.125em;
  }
}
@media only screen and (max-width: 30em) {
  .pr-9 {
    padding-right: 6.75em;
  }
}
.pr-10 {
  padding-right: 15em;
}
@media only screen and (max-width: 48em) {
  .pr-10 {
    padding-right: 11.25em;
  }
}
@media only screen and (max-width: 30em) {
  .pr-10 {
    padding-right: 7.5em;
  }
}
.pl-1 {
  padding-left: 1.5em;
}
@media only screen and (max-width: 48em) {
  .pl-1 {
    padding-left: 1.125em;
  }
}
@media only screen and (max-width: 30em) {
  .pl-1 {
    padding-left: 0.75em;
  }
}
.pl-2 {
  padding-left: 3em;
}
@media only screen and (max-width: 48em) {
  .pl-2 {
    padding-left: 2.25em;
  }
}
@media only screen and (max-width: 30em) {
  .pl-2 {
    padding-left: 1.5em;
  }
}
.pl-3 {
  padding-left: 4.5em;
}
@media only screen and (max-width: 48em) {
  .pl-3 {
    padding-left: 3.375em;
  }
}
@media only screen and (max-width: 30em) {
  .pl-3 {
    padding-left: 2.25em;
  }
}
.pl-4 {
  padding-left: 6em;
}
@media only screen and (max-width: 48em) {
  .pl-4 {
    padding-left: 4.5em;
  }
}
@media only screen and (max-width: 30em) {
  .pl-4 {
    padding-left: 3em;
  }
}
.pl-5 {
  padding-left: 7.5em;
}
@media only screen and (max-width: 48em) {
  .pl-5 {
    padding-left: 5.625em;
  }
}
@media only screen and (max-width: 30em) {
  .pl-5 {
    padding-left: 3.75em;
  }
}
.pl-6 {
  padding-left: 9em;
}
@media only screen and (max-width: 48em) {
  .pl-6 {
    padding-left: 6.75em;
  }
}
@media only screen and (max-width: 30em) {
  .pl-6 {
    padding-left: 4.5em;
  }
}
.pl-7 {
  padding-left: 10.5em;
}
@media only screen and (max-width: 48em) {
  .pl-7 {
    padding-left: 7.875em;
  }
}
@media only screen and (max-width: 30em) {
  .pl-7 {
    padding-left: 5.25em;
  }
}
.pl-8 {
  padding-left: 12em;
}
@media only screen and (max-width: 48em) {
  .pl-8 {
    padding-left: 9em;
  }
}
@media only screen and (max-width: 30em) {
  .pl-8 {
    padding-left: 6em;
  }
}
.pl-9 {
  padding-left: 13.5em;
}
@media only screen and (max-width: 48em) {
  .pl-9 {
    padding-left: 10.125em;
  }
}
@media only screen and (max-width: 30em) {
  .pl-9 {
    padding-left: 6.75em;
  }
}
.pl-10 {
  padding-left: 15em;
}
@media only screen and (max-width: 48em) {
  .pl-10 {
    padding-left: 11.25em;
  }
}
@media only screen and (max-width: 30em) {
  .pl-10 {
    padding-left: 7.5em;
  }
}
.py-1 {
  padding-top: 1.5em;
  padding-bottom: 1.5em;
}
@media only screen and (max-width: 48em) {
  .py-1 {
    padding-top: 1.125em;
  }
}
@media only screen and (max-width: 30em) {
  .py-1 {
    padding-top: 0.75em;
  }
}
@media only screen and (max-width: 48em) {
  .py-1 {
    padding-bottom: 1.125em;
  }
}
@media only screen and (max-width: 30em) {
  .py-1 {
    padding-bottom: 0.75em;
  }
}
.py-2 {
  padding-top: 3em;
  padding-bottom: 3em;
}
@media only screen and (max-width: 48em) {
  .py-2 {
    padding-top: 2.25em;
  }
}
@media only screen and (max-width: 30em) {
  .py-2 {
    padding-top: 1.5em;
  }
}
@media only screen and (max-width: 48em) {
  .py-2 {
    padding-bottom: 2.25em;
  }
}
@media only screen and (max-width: 30em) {
  .py-2 {
    padding-bottom: 1.5em;
  }
}
.py-3 {
  padding-top: 4.5em;
  padding-bottom: 4.5em;
}
@media only screen and (max-width: 48em) {
  .py-3 {
    padding-top: 3.375em;
  }
}
@media only screen and (max-width: 30em) {
  .py-3 {
    padding-top: 2.25em;
  }
}
@media only screen and (max-width: 48em) {
  .py-3 {
    padding-bottom: 3.375em;
  }
}
@media only screen and (max-width: 30em) {
  .py-3 {
    padding-bottom: 2.25em;
  }
}
.py-4 {
  padding-top: 6em;
  padding-bottom: 6em;
}
@media only screen and (max-width: 48em) {
  .py-4 {
    padding-top: 4.5em;
  }
}
@media only screen and (max-width: 30em) {
  .py-4 {
    padding-top: 3em;
  }
}
@media only screen and (max-width: 48em) {
  .py-4 {
    padding-bottom: 4.5em;
  }
}
@media only screen and (max-width: 30em) {
  .py-4 {
    padding-bottom: 3em;
  }
}
.py-5 {
  padding-top: 7.5em;
  padding-bottom: 7.5em;
}
@media only screen and (max-width: 48em) {
  .py-5 {
    padding-top: 5.625em;
  }
}
@media only screen and (max-width: 30em) {
  .py-5 {
    padding-top: 3.75em;
  }
}
@media only screen and (max-width: 48em) {
  .py-5 {
    padding-bottom: 5.625em;
  }
}
@media only screen and (max-width: 30em) {
  .py-5 {
    padding-bottom: 3.75em;
  }
}
.py-6 {
  padding-top: 9em;
  padding-bottom: 9em;
}
@media only screen and (max-width: 48em) {
  .py-6 {
    padding-top: 6.75em;
  }
}
@media only screen and (max-width: 30em) {
  .py-6 {
    padding-top: 4.5em;
  }
}
@media only screen and (max-width: 48em) {
  .py-6 {
    padding-bottom: 6.75em;
  }
}
@media only screen and (max-width: 30em) {
  .py-6 {
    padding-bottom: 4.5em;
  }
}
.py-7 {
  padding-top: 10.5em;
  padding-bottom: 10.5em;
}
@media only screen and (max-width: 48em) {
  .py-7 {
    padding-top: 7.875em;
  }
}
@media only screen and (max-width: 30em) {
  .py-7 {
    padding-top: 5.25em;
  }
}
@media only screen and (max-width: 48em) {
  .py-7 {
    padding-bottom: 7.875em;
  }
}
@media only screen and (max-width: 30em) {
  .py-7 {
    padding-bottom: 5.25em;
  }
}
.py-8 {
  padding-top: 12em;
  padding-bottom: 12em;
}
@media only screen and (max-width: 48em) {
  .py-8 {
    padding-top: 9em;
  }
}
@media only screen and (max-width: 30em) {
  .py-8 {
    padding-top: 6em;
  }
}
@media only screen and (max-width: 48em) {
  .py-8 {
    padding-bottom: 9em;
  }
}
@media only screen and (max-width: 30em) {
  .py-8 {
    padding-bottom: 6em;
  }
}
.py-9 {
  padding-top: 13.5em;
  padding-bottom: 13.5em;
}
@media only screen and (max-width: 48em) {
  .py-9 {
    padding-top: 10.125em;
  }
}
@media only screen and (max-width: 30em) {
  .py-9 {
    padding-top: 6.75em;
  }
}
@media only screen and (max-width: 48em) {
  .py-9 {
    padding-bottom: 10.125em;
  }
}
@media only screen and (max-width: 30em) {
  .py-9 {
    padding-bottom: 6.75em;
  }
}
.py-10 {
  padding-top: 15em;
  padding-bottom: 15em;
}
@media only screen and (max-width: 48em) {
  .py-10 {
    padding-top: 11.25em;
  }
}
@media only screen and (max-width: 30em) {
  .py-10 {
    padding-top: 7.5em;
  }
}
@media only screen and (max-width: 48em) {
  .py-10 {
    padding-bottom: 11.25em;
  }
}
@media only screen and (max-width: 30em) {
  .py-10 {
    padding-bottom: 7.5em;
  }
}
.px-1 {
  padding-left: 1.5em;
  padding-right: 1.5em;
}
@media only screen and (max-width: 48em) {
  .px-1 {
    padding-left: 1.125em;
  }
}
@media only screen and (max-width: 30em) {
  .px-1 {
    padding-left: 0.75em;
  }
}
@media only screen and (max-width: 48em) {
  .px-1 {
    padding-right: 1.125em;
  }
}
@media only screen and (max-width: 30em) {
  .px-1 {
    padding-right: 0.75em;
  }
}
.px-2 {
  padding-left: 3em;
  padding-right: 3em;
}
@media only screen and (max-width: 48em) {
  .px-2 {
    padding-left: 2.25em;
  }
}
@media only screen and (max-width: 30em) {
  .px-2 {
    padding-left: 1.5em;
  }
}
@media only screen and (max-width: 48em) {
  .px-2 {
    padding-right: 2.25em;
  }
}
@media only screen and (max-width: 30em) {
  .px-2 {
    padding-right: 1.5em;
  }
}
.px-3 {
  padding-left: 4.5em;
  padding-right: 4.5em;
}
@media only screen and (max-width: 48em) {
  .px-3 {
    padding-left: 3.375em;
  }
}
@media only screen and (max-width: 30em) {
  .px-3 {
    padding-left: 2.25em;
  }
}
@media only screen and (max-width: 48em) {
  .px-3 {
    padding-right: 3.375em;
  }
}
@media only screen and (max-width: 30em) {
  .px-3 {
    padding-right: 2.25em;
  }
}
.px-4 {
  padding-left: 6em;
  padding-right: 6em;
}
@media only screen and (max-width: 48em) {
  .px-4 {
    padding-left: 4.5em;
  }
}
@media only screen and (max-width: 30em) {
  .px-4 {
    padding-left: 3em;
  }
}
@media only screen and (max-width: 48em) {
  .px-4 {
    padding-right: 4.5em;
  }
}
@media only screen and (max-width: 30em) {
  .px-4 {
    padding-right: 3em;
  }
}
.px-5 {
  padding-left: 7.5em;
  padding-right: 7.5em;
}
@media only screen and (max-width: 48em) {
  .px-5 {
    padding-left: 5.625em;
  }
}
@media only screen and (max-width: 30em) {
  .px-5 {
    padding-left: 3.75em;
  }
}
@media only screen and (max-width: 48em) {
  .px-5 {
    padding-right: 5.625em;
  }
}
@media only screen and (max-width: 30em) {
  .px-5 {
    padding-right: 3.75em;
  }
}
.px-6 {
  padding-left: 9em;
  padding-right: 9em;
}
@media only screen and (max-width: 48em) {
  .px-6 {
    padding-left: 6.75em;
  }
}
@media only screen and (max-width: 30em) {
  .px-6 {
    padding-left: 4.5em;
  }
}
@media only screen and (max-width: 48em) {
  .px-6 {
    padding-right: 6.75em;
  }
}
@media only screen and (max-width: 30em) {
  .px-6 {
    padding-right: 4.5em;
  }
}
.px-7 {
  padding-left: 10.5em;
  padding-right: 10.5em;
}
@media only screen and (max-width: 48em) {
  .px-7 {
    padding-left: 7.875em;
  }
}
@media only screen and (max-width: 30em) {
  .px-7 {
    padding-left: 5.25em;
  }
}
@media only screen and (max-width: 48em) {
  .px-7 {
    padding-right: 7.875em;
  }
}
@media only screen and (max-width: 30em) {
  .px-7 {
    padding-right: 5.25em;
  }
}
.px-8 {
  padding-left: 12em;
  padding-right: 12em;
}
@media only screen and (max-width: 48em) {
  .px-8 {
    padding-left: 9em;
  }
}
@media only screen and (max-width: 30em) {
  .px-8 {
    padding-left: 6em;
  }
}
@media only screen and (max-width: 48em) {
  .px-8 {
    padding-right: 9em;
  }
}
@media only screen and (max-width: 30em) {
  .px-8 {
    padding-right: 6em;
  }
}
.px-9 {
  padding-left: 13.5em;
  padding-right: 13.5em;
}
@media only screen and (max-width: 48em) {
  .px-9 {
    padding-left: 10.125em;
  }
}
@media only screen and (max-width: 30em) {
  .px-9 {
    padding-left: 6.75em;
  }
}
@media only screen and (max-width: 48em) {
  .px-9 {
    padding-right: 10.125em;
  }
}
@media only screen and (max-width: 30em) {
  .px-9 {
    padding-right: 6.75em;
  }
}
.px-10 {
  padding-left: 15em;
  padding-right: 15em;
}
@media only screen and (max-width: 48em) {
  .px-10 {
    padding-left: 11.25em;
  }
}
@media only screen and (max-width: 30em) {
  .px-10 {
    padding-left: 7.5em;
  }
}
@media only screen and (max-width: 48em) {
  .px-10 {
    padding-right: 11.25em;
  }
}
@media only screen and (max-width: 30em) {
  .px-10 {
    padding-right: 7.5em;
  }
}
.no-margin {
  margin: 0;
}
/* ==========================================================================
 * Helpers Helpers
   ========================================================================== */
.align-left {
  text-align: left;
}
.align-center {
  text-align: center;
}
.align-right {
  text-align: right;
}
.float-left {
  float: left;
}
.float-right {
  float: right;
}
.is-hidden {
  display: none;
}
.is-invisible {
  opacity: 0;
}
.is-disabled {
  opacity: 0.25;
}
.is-clickable {
  cursor: pointer;
}
.is-visually-hidden {
  position: absolute;
  clip: rect(1px 1px 1px 1px);
  /* syntax for IE6 & IE7 */
  clip: rect(1px, 1px, 1px, 1px);
}
@media only screen and (max-width: 30em) {
  .hide-mobile {
    display: none;
  }
}
@media only screen and (max-width: 48em) {
  .hide-medium {
    display: none;
  }
}
@media only screen and (max-width: 64em) {
  .hide-smalldesk {
    display: none;
  }
}
.is-mobile {
  display: none;
}
@media only screen and (max-width: 30em) {
  .is-mobile {
    display: block;
  }
}
/* ==========================================================================
 * Helpers Fallbacks
   ========================================================================== */