@charset "UTF-8";

.clearfix::after,
.row::after {
  content: "";
  display: table;
  clear: both;
}

@-webkit-keyframes typing {
  from, to {
    -webkit-transform: scale(1);
            transform: scale(1);
  }

  50% {
    -webkit-transform: scale(1.02);
            transform: scale(1.02);
  }
}

@keyframes typing {
  from, to {
    -webkit-transform: scale(1);
            transform: scale(1);
  }

  50% {
    -webkit-transform: scale(1.02);
            transform: scale(1.02);
  }
}

@-webkit-keyframes ball-pulsing {
  0% {
    opacity: 0.6;
  }

  33.33% {
    opacity: 0.45;
  }

  66.67% {
    opacity: 0.3;
  }

  100% {
    opacity: 1;
  }
}

@keyframes ball-pulsing {
  0% {
    opacity: 0.6;
  }

  33.33% {
    opacity: 0.45;
  }

  66.67% {
    opacity: 0.3;
  }

  100% {
    opacity: 1;
  }
}

[data-aos=fade-up-pp] {
  -webkit-transform: translate3d(0, 20px, 0);
          transform: translate3d(0, 20px, 0);
}

@-webkit-keyframes error404_wiggle_r {
  0%, 100% {
    -webkit-transform: translate3d(0, -1.5px, 0);
            transform: translate3d(0, -1.5px, 0);
  }

  25% {
    -webkit-transform: translate3d(1.5px, 1.5px, 0);
            transform: translate3d(1.5px, 1.5px, 0);
  }

  50% {
    -webkit-transform: translate3d(0, 1.5px, 0);
            transform: translate3d(0, 1.5px, 0);
  }

  75% {
    -webkit-transform: translate3d(-1.5px, -1.5px, 0);
            transform: translate3d(-1.5px, -1.5px, 0);
  }
}

@keyframes error404_wiggle_r {
  0%, 100% {
    -webkit-transform: translate3d(0, -1.5px, 0);
            transform: translate3d(0, -1.5px, 0);
  }

  25% {
    -webkit-transform: translate3d(1.5px, 1.5px, 0);
            transform: translate3d(1.5px, 1.5px, 0);
  }

  50% {
    -webkit-transform: translate3d(0, 1.5px, 0);
            transform: translate3d(0, 1.5px, 0);
  }

  75% {
    -webkit-transform: translate3d(-1.5px, -1.5px, 0);
            transform: translate3d(-1.5px, -1.5px, 0);
  }
}

@-webkit-keyframes error404_wiggle_g {
  0%, 100% {
    -webkit-transform: translate3d(0, -1.5px, 0);
            transform: translate3d(0, -1.5px, 0);
  }

  25% {
    -webkit-transform: translate3d(1.5px, 1.5px, 0);
            transform: translate3d(1.5px, 1.5px, 0);
  }

  50% {
    -webkit-transform: translate3d(0, 1.5px, 0);
            transform: translate3d(0, 1.5px, 0);
  }

  60% {
    -webkit-transform: translate3d(10px, 100px, 0);
            transform: translate3d(10px, 100px, 0);
  }

  75% {
    -webkit-transform: translate3d(-1.5px, -1.5px, 0);
            transform: translate3d(-1.5px, -1.5px, 0);
  }
}

@keyframes error404_wiggle_g {
  0%, 100% {
    -webkit-transform: translate3d(0, -1.5px, 0);
            transform: translate3d(0, -1.5px, 0);
  }

  25% {
    -webkit-transform: translate3d(1.5px, 1.5px, 0);
            transform: translate3d(1.5px, 1.5px, 0);
  }

  50% {
    -webkit-transform: translate3d(0, 1.5px, 0);
            transform: translate3d(0, 1.5px, 0);
  }

  60% {
    -webkit-transform: translate3d(10px, 100px, 0);
            transform: translate3d(10px, 100px, 0);
  }

  75% {
    -webkit-transform: translate3d(-1.5px, -1.5px, 0);
            transform: translate3d(-1.5px, -1.5px, 0);
  }
}

@-webkit-keyframes error404_wiggle_b {
  0%, 100% {
    -webkit-transform: translate3d(0, -1.5px, 0);
            transform: translate3d(0, -1.5px, 0);
  }

  25% {
    -webkit-transform: translate3d(1.5px, 1.5px, 0);
            transform: translate3d(1.5px, 1.5px, 0);
  }

  50% {
    -webkit-transform: translate3d(0, 1.5px, 0);
            transform: translate3d(0, 1.5px, 0);
  }

  60% {
    -webkit-transform: translate3d(-10px, -30px, 0);
            transform: translate3d(-10px, -30px, 0);
  }

  75% {
    -webkit-transform: translate3d(-1.5px, -1.5px, 0);
            transform: translate3d(-1.5px, -1.5px, 0);
  }
}

@keyframes error404_wiggle_b {
  0%, 100% {
    -webkit-transform: translate3d(0, -1.5px, 0);
            transform: translate3d(0, -1.5px, 0);
  }

  25% {
    -webkit-transform: translate3d(1.5px, 1.5px, 0);
            transform: translate3d(1.5px, 1.5px, 0);
  }

  50% {
    -webkit-transform: translate3d(0, 1.5px, 0);
            transform: translate3d(0, 1.5px, 0);
  }

  60% {
    -webkit-transform: translate3d(-10px, -30px, 0);
            transform: translate3d(-10px, -30px, 0);
  }

  75% {
    -webkit-transform: translate3d(-1.5px, -1.5px, 0);
            transform: translate3d(-1.5px, -1.5px, 0);
  }
}

@-webkit-keyframes error404 {
  0%, 100% {
    -webkit-transform: translate3d(0, -1px, 0);
            transform: translate3d(0, -1px, 0);
  }

  25% {
    -webkit-transform: translate3d(1px, 1px, 0);
            transform: translate3d(1px, 1px, 0);
  }

  50% {
    -webkit-transform: translate3d(0, 1px, 0);
            transform: translate3d(0, 1px, 0);
  }

  75% {
    -webkit-transform: translate3d(-1px, -1px, 0);
            transform: translate3d(-1px, -1px, 0);
  }
}

@keyframes error404 {
  0%, 100% {
    -webkit-transform: translate3d(0, -1px, 0);
            transform: translate3d(0, -1px, 0);
  }

  25% {
    -webkit-transform: translate3d(1px, 1px, 0);
            transform: translate3d(1px, 1px, 0);
  }

  50% {
    -webkit-transform: translate3d(0, 1px, 0);
            transform: translate3d(0, 1px, 0);
  }

  75% {
    -webkit-transform: translate3d(-1px, -1px, 0);
            transform: translate3d(-1px, -1px, 0);
  }
}

@-webkit-keyframes error404_zoom {
  0% {
    opacity: 1;
    -webkit-transform: scale(0.01);
            transform: scale(0.01);
  }

  50% {
    opacity: 1;
  }

  100% {
    -webkit-transform: scale(10);
            transform: scale(10);
    opacity: 0;
  }
}

@keyframes error404_zoom {
  0% {
    opacity: 1;
    -webkit-transform: scale(0.01);
            transform: scale(0.01);
  }

  50% {
    opacity: 1;
  }

  100% {
    -webkit-transform: scale(10);
            transform: scale(10);
    opacity: 0;
  }
}

@-webkit-keyframes services-bg-header {
  0% {
    background-position: 0px 0px;
  }

  100% {
    background-position: 900px -562px;
  }
}

@keyframes services-bg-header {
  0% {
    background-position: 0px 0px;
  }

  100% {
    background-position: 900px -562px;
  }
}

@-webkit-keyframes pulse {
  0% {
    box-shadow: 0 0 70px 30px rgba(250, 109, 111, 0.3);
  }

  50% {
    box-shadow: 0 0 70px 40px rgba(250, 109, 111, 0.3);
  }

  100% {
    box-shadow: 0 0 70px 30px rgba(250, 109, 111, 0.3);
  }
}

@keyframes pulse {
  0% {
    box-shadow: 0 0 70px 30px rgba(250, 109, 111, 0.3);
  }

  50% {
    box-shadow: 0 0 70px 40px rgba(250, 109, 111, 0.3);
  }

  100% {
    box-shadow: 0 0 70px 30px rgba(250, 109, 111, 0.3);
  }
}

*,
*::after,
*::before {
  margin: 0;
  padding: 0;
  box-sizing: inherit;
}

html {
  font-size: 62.5%;
  overflow-x: hidden;
}

body {
  box-sizing: border-box;
  background-color: #fafafa;
}

main {
  padding-top: 10rem;
  padding-bottom: 10rem;
}

.article {
  padding-top: 10rem;
  padding-bottom: 10rem;
}

.article figure {
  margin: 6rem 0;
}

.article figure img {
  width: 100%;
  box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.05);
  border-radius: 3px;
}

.article figure figcaption {
  font-size: 1.6rem;
  color: #555570;
}

.article figure figcaption .credits {
  color: #C0C0CC;
}

.article figure figcaption .credits a {
  color: #C0C0CC;
}

figure.inline {
  display: inline;
}

figure.inline img {
  box-shadow: none !important;
  width: auto !important;
}

.lazyload,
.lazyloading {
  opacity: 0;
  -webkit-filter: blur(20px);
          filter: blur(20px);
}

.lazyloaded {
  opacity: 1;
  -webkit-filter: blur(0);
          filter: blur(0);
  transition: opacity 300ms, -webkit-filter 600ms ease-out;
  transition: opacity 300ms, filter 600ms ease-out;
  transition: opacity 300ms, filter 600ms ease-out, -webkit-filter 600ms ease-out;
}

.is-fixed {
  overflow: hidden;
}

figure {
  width: 100%;
}

img[data-sizes=auto] {
  display: block;
  width: 100%;
}

.lazysrcset-ratio {
  position: relative;
}

.lazysrcset-ratio > img {
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.lazysrcset-ratio > img:after {
  display: block;
  width: 100%;
  height: 0;
  content: "";
}

@font-face {
  font-family: "gt-walsheim";
  font-weight: normal;
  font-style: normal;
  src: url(/assets/fonts/GT-Walsheim-Regular.woff?0373c3d84f12ae850df8ec2024722958) format("woff");
  font-display: swap;
}

@font-face {
  font-family: "gt-walsheim";
  font-weight: normal;
  font-style: italic;
  src: url(/assets/fonts/GT-Walsheim-Regular-Oblique.woff?2d31bb44f71c74c297f80bbe0cd38f14) format("woff");
  font-display: swap;
}

@font-face {
  font-family: "gt-walsheim";
  font-weight: bold;
  font-style: normal;
  src: url(/assets/fonts/GT-Walsheim-Bold.woff?3540dae7586c115dfa1f0ccd78506bdd) format("woff");
  font-display: swap;
}

@font-face {
  font-family: "gt-walsheim";
  font-weight: bold;
  font-style: italic;
  src: url(/assets/fonts/GT-Walsheim-Bold-Oblique.woff?77ce535fc99ae1e7073824e11e975a52) format("woff");
  font-display: swap;
}

@font-face {
  font-family: "vesterbro";
  font-weight: bold;
  font-style: normal;
  src: url(/assets/fonts/Vesterbro-Poster.woff2?ab08074cbb5771ec928d7574aac92d9f) format("woff2"), url(/assets/fonts/Vesterbro-Poster.woff?59d69e73209a302176d41e0f2753944f) format("woff");
  font-display: swap;
}

@font-face {
  font-family: "ibm-plex-mono";
  font-weight: normal;
  font-style: normal;
  src: url(/assets/fonts/IBM-Plex-Mono.woff2?57685f70bce71bc2281d8be62ba305c9) format("woff2");
  font-display: swap;
}

@font-face {
  font-family: "ibm-plex-mono";
  font-weight: bold;
  font-style: normal;
  src: url(/assets/fonts/IBM-Plex-Mono-Bold.woff2?e26e03e0f7579ebb23f3419510ffbfb5) format("woff2");
  font-display: swap;
}

body {
  font-family: "gt-walsheim", Helvetica, Arial, sans-serif;
  color: #00144a;
  font-size: 2rem;
  -webkit-font-smoothing: antialiased;
}

h1,
.h1,
h2,
.h2,
h3,
.h3,
h4,
.h4,
h5,
.h5,
h6,
.h6,
.heading {
  font-family: "vesterbro", serif;
  margin-bottom: 0.5rem;
}

h1,
.h1 {
  font-size: 4rem;
}

h2,
.h2 {
  font-size: 3.6rem;
}

h3,
.h3 {
  font-size: 2.4rem;
}

h4,
.h4 {
  font-family: "gt-walsheim", Helvetica, Arial, sans-serif;
  font-size: 2rem;
}

.kicker {
  text-transform: uppercase;
  font-weight: bold;
  letter-spacing: 0.23rem;
  font-size: 1.3rem;
  display: block;
  font-family: "gt-walsheim", Helvetica, Arial, sans-serif;
}

.kicker + h1,
.kicker + h2,
.kicker + h3,
.kicker + h4 {
  margin-top: 0;
}

p {
  margin-bottom: 1.6rem;
}

p + h1,
p + h2,
p + h3,
p + h4 {
  margin-top: 6rem;
}

.lead {
  font-size: 2rem;
  font-weight: bold;
  color: #555570;
}

.lead a {
  color: #555570;
  background-image: linear-gradient(#555570, #555570);
}

.text--xsmall {
  font-size: 1.3rem;
  line-height: 1.5;
}

.text--small {
  font-size: 1.6rem;
}

.text--medium {
  font-size: 1.8rem;
}

.text--large {
  font-size: 2.4rem;
}

a,
nav.main span.active {
  color: #00144a;
  text-decoration: none;
  background-image: linear-gradient(#00144a, #00144a);
  background-position: 0% 100%;
  background-repeat: no-repeat;
  background-size: 100% 1px;
  transition: background 0.2s ease-in-out;
  padding-bottom: 1px;
  word-wrap: break-word;
}

a:hover {
  background-size: 0% 1px;
}

input,
textarea,
select {
  font-family: "gt-walsheim", Helvetica, Arial, sans-serif;
  font-size: 1.6rem;
}

code,
.shortcut,
.menuitem {
  font-family: "ibm-plex-mono", Menlo, Monaco, Consolas, "Courier New", monospace;
  font-size: 80%;
  padding: 0.5rem;
  border-radius: 3px;
  word-wrap: break-word;
}

code {
  color: #00144a;
  background-color: #f4fdd0;
  border: 1px solid #defa6d;
}

.shortcut {
  color: #00144a;
  background-color: #fe7c7e;
  box-shadow: 0px 4px 12px 0px rgba(0, 20, 74, 0.15);
}

.menuitem {
  color: #00144a;
  background-color: white;
  box-shadow: 0px 4px 12px 0px rgba(0, 20, 74, 0.15);
}

blockquote {
  position: relative;
  font-family: "vesterbro", serif;
  color: #00144a;
  font-size: 3.2rem;
  line-height: normal;
  margin: 0 0 1.6rem 0;
}

blockquote:before {
  content: "„";
  position: relative;
  display: block;
  font-size: 5rem;
  color: #C0C0CC;
}

blockquote:after {
  content: "“";
  position: relative;
  display: block;
  font-size: 5rem;
  color: #C0C0CC;
}

blockquote p {
  display: inline-block;
  line-height: 1.4 !important;
}

blockquote p:after {
  content: "|";
  -webkit-animation: typedjsBlink 0.7s infinite;
          animation: typedjsBlink 0.7s infinite;
}

blockquote footer {
  font-size: 1.3rem;
  font-family: "ibm-plex-mono", Menlo, Monaco, Consolas, "Courier New", monospace;
  color: #555570;
}

blockquote footer a {
  color: #555570;
  padding-bottom: 3px;
  background-image: linear-gradient(#555570, #555570);
}

blockquote footer:before {
  content: "—";
}

.insertion {
  background-color: white;
  border-radius: 3px;
  box-shadow: 0px 4px 12px 0px rgba(0, 20, 74, 0.15);
  padding: 2rem;
  margin: 6rem 0;
}

.insertion p:last-child {
  margin-bottom: 0;
}

table {
  background-color: white;
  border-radius: 3px;
  box-shadow: 0px 4px 12px 0px rgba(0, 20, 74, 0.15);
  padding: 2rem 0;
  width: 100%;
  text-align: left;
  margin: 6rem 0;
  border-collapse: separate;
  border-spacing: 3rem 0;
}

table th {
  font-size: 1.35rem;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 0.25rem;
  border-bottom: 2px solid #00144a;
  padding: 1rem 0;
}

table th,
table td {
  padding: 0.5rem 0;
}

table td {
  font-size: 1.8rem;
}

table tr:nth-child(2) td {
  padding-top: 1.25rem;
}

.template-post .article ol {
  padding: 0;
}

ol {
  counter-reset: li;
  /* Initiate a counter */
  margin-left: 0;
  /* Remove the default left margin */
  padding-left: 0;
  /* Remove the default left padding */
}

ol > li {
  position: relative;
  /* Create a positioning context */
  margin: 0 0 0.5rem 1rem;
  /* Give each list item a left margin to make room for the numbers */
  list-style: none;
  /* Disable the normal item numbering */
}

ol > li:before {
  content: counter(li);
  /* Use the counter as content */
  counter-increment: li;
  /* Increment the counter by 1 */
  /* Position and style the number */
  position: absolute;
  top: 0rem;
  left: -4rem;
  width: 3rem;
  height: 3rem;
  /* Some space between the number and the content in browsers that support
     generated content but not positioning it (Camino 2 is one example) */
  padding: 0.5rem;
  background: #fff;
  color: #00144a;
  box-shadow: 0px 4px 12px 0px rgba(0, 20, 74, 0.15);
  border-radius: 50%;
  text-align: center;
  font-size: 1.3rem;
  font-weight: bold;
}

ul {
  list-style-type: square;
  margin-bottom: 1.6rem;
}

::-moz-selection {
  background-color: #fa6d6f;
  color: #fff;
  opacity: 1;
}

::selection {
  background-color: #fa6d6f;
  color: #fff;
  opacity: 1;
}

.tiny-label {
  color: #555570;
  font-family: "ibm-plex-mono", Menlo, Monaco, Consolas, "Courier New", monospace;
  font-size: 1.3rem;
  letter-spacing: 0.5px;
}

.u-bg-midnight {
  background-color: #00144a;
  color: white;
}

.u-bg-midnight a {
  color: white;
  background-image: linear-gradient(white, white);
}

.u-bg-midnight-dark {
  background-color: #001140;
  color: white;
}

.u-bg-midnight-dark a {
  color: white;
  background-image: linear-gradient(white, white);
}

.color-midnight {
  color: #00144a;
}

.u-bg-poison {
  background-color: #defa6d;
  color: #00144a;
}

.u-bg-poison a {
  color: #00144a;
  background-image: linear-gradient(#00144a, #00144a);
}

.color-poison {
  color: #defa6d;
}

.u-bg-flamingo {
  background-color: #fe7c7e;
  color: #00144a;
}

.u-bg-flamingo a {
  color: #00144a;
  background-image: linear-gradient(#00144a, #00144a);
}

.color-flamingo {
  color: #fa6d6f;
}

.u-bg-white {
  background-color: white;
  color: #00144a;
}

.u-bg-white a {
  color: #00144a;
}

.u-bg-gray {
  background-color: #858499;
  color: #00144a;
}

.u-bg-gray-light {
  background-color: #C0C0CC;
}

.u-bg-gray-lightest {
  background-color: #f0f0f5;
}

.u-bg-gray-dark {
  background-color: #555570;
}

.color-gray-dark {
  color: #555570;
}

.u-centered {
  text-align: center;
}

.u-mt {
  margin-top: 3rem;
}

.u-mr {
  margin-right: 3rem;
}

.u-mb {
  margin-bottom: 3rem;
}

.u-ml {
  margin-left: 3rem;
}

.u-mx {
  margin-left: 3rem;
  margin-right: 3rem;
}

.u-my {
  margin-top: 3rem;
  margin-bottom: 3rem;
}

.u-mt--xsmall {
  margin-top: 0.75rem;
}

.u-mr--xsmall {
  margin-right: 0.75rem;
}

.u-mb--xsmall {
  margin-bottom: 0.75rem;
}

.u-ml--xsmall {
  margin-left: 0.75rem;
}

.u-mx--xsmall {
  margin-left: 0.75rem;
  margin-right: 0.75rem;
}

.u-my--xsmall {
  margin-top: 0.75rem;
  margin-bottom: 0.75rem;
}

.u-mt--small {
  margin-top: 1.5rem;
}

.u-mr--small {
  margin-right: 1.5rem;
}

.u-mb--small {
  margin-bottom: 1.5rem;
}

.u-ml--small {
  margin-left: 1.5rem;
}

.u-mx--small {
  margin-left: 1.5rem;
  margin-right: 1.5rem;
}

.u-my--small {
  margin-top: 1.5rem;
  margin-bottom: 1.5rem;
}

.u-mt--large {
  margin-top: 6rem;
}

.u-mr--large {
  margin-right: 6rem;
}

.u-mb--large {
  margin-bottom: 6rem;
}

.u-ml--large {
  margin-left: 6rem;
}

.u-mx--large {
  margin-left: 6rem;
  margin-right: 6rem;
}

.u-my--large {
  margin-top: 6rem;
  margin-bottom: 6rem;
}

.u-mt--0 {
  margin-top: 0;
}

.u-mr--0 {
  margin-right: 0;
}

.u-mb--0 {
  margin-bottom: 0;
}

.u-ml--0 {
  margin-left: 0;
}

.u-mx--0 {
  margin-left: 0;
  margin-right: 0;
}

.u-my--0 {
  margin-top: 0;
  margin-bottom: 0;
}

.u-pt {
  padding-top: 3rem;
}

.u-pr {
  padding-right: 3rem;
}

.u-pb {
  padding-bottom: 3rem;
}

.u-pl {
  padding-left: 3rem;
}

.u-px {
  padding-left: 3rem;
  padding-right: 3rem;
}

.u-py {
  padding-top: 3rem;
  padding-bottom: 3rem;
}

.u-pt--small {
  padding-top: 1.5rem;
}

.u-pr--small {
  padding-right: 1.5rem;
}

.u-pb--small {
  padding-bottom: 1.5rem;
}

.u-pl--small {
  padding-left: 1.5rem;
}

.u-px--small {
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}

.u-py--small {
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}

.u-pt--large {
  padding-top: 6rem;
}

.u-pr--large {
  padding-right: 6rem;
}

.u-pb--large {
  padding-bottom: 6rem;
}

.u-pl--large {
  padding-left: 6rem;
}

.u-px--large {
  padding-left: 6rem;
  padding-right: 6rem;
}

.u-py--large {
  padding-top: 6rem;
  padding-bottom: 6rem;
}

.u-pt--0 {
  padding-top: 0;
}

.u-pr--0 {
  padding-right: 0;
}

.u-pb--0 {
  padding-bottom: 0;
}

.u-pl--0 {
  padding-left: 0;
}

.u-px--0 {
  padding-left: 0;
  padding-right: 0;
}

.u-py--0 {
  padding-top: 0;
  padding-bottom: 0;
}

.u-position-relative {
  position: relative;
}

.u-position-sticky {
  position: sticky;
  top: 75px;
}

.u-drop-shadow {
  box-shadow: 0px 4px 12px 0px rgba(0, 20, 74, 0.15);
}

.text-center {
  text-align: center;
}

.text-left {
  text-align: left;
}

.text-right {
  text-align: right;
}

.font-size-small {
  font-size: 1.6rem;
}

.color-midnight-lightest {
  color: #d4dced;
}

.color-gray-dark {
  color: #555570;
}

.p-0 {
  padding: 0 !important;
}

.avatar {
  border-radius: 100%;
}

.avatars .avatar {
  display: inline-block;
  box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.25);
  position: relative;
}

.avatars .avatar:first-child {
  z-index: 1;
}

.avatars .avatar:nth-child(2) {
  z-index: 0;
  margin-left: -1rem;
}

.card,
.card--large {
  background: none;
  display: block;
  transition: all 0.3s;
  margin-bottom: 6rem;
  overflow: hidden;
}

.card .card__image,
.card--large .card__image {
  border-radius: 3px;
}

.card .card__image.fixed-aspect img,
.card--large .card__image.fixed-aspect img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.card figure,
.card--large figure {
  transition: box-shadow 1s ease-out;
  box-shadow: 0px 4px 12px 0px rgba(0, 20, 74, 0.15);
  overflow: hidden;
}

.card figure img,
.card--large figure img {
  transition: opacity 300ms, -webkit-transform 1s ease-out, -webkit-filter 600ms ease-out;
  transition: transform 1s ease-out, opacity 300ms, filter 600ms ease-out;
  transition: transform 1s ease-out, opacity 300ms, filter 600ms ease-out, -webkit-transform 1s ease-out, -webkit-filter 600ms ease-out;
  display: block;
  width: 100%;
  height: auto;
}

.card p,
.card--large p {
  font-size: 1.6rem;
  color: #555570;
}

.card:hover figure,
.card--large:hover figure {
  box-shadow: 10px 10px 20px 0 rgba(0, 20, 74, 0.1);
  transition: box-shadow 0.3s ease-out;
}

.card:hover figure img,
.card--large:hover figure img {
  -webkit-transform: scale(1.03);
          transform: scale(1.03);
  transition: -webkit-transform 0.3s ease-out;
  transition: transform 0.3s ease-out;
  transition: transform 0.3s ease-out, -webkit-transform 0.3s ease-out;
}

.card:hover .card__content::after,
.card--large:hover .card__content::after {
  opacity: 1;
  -webkit-transform: translateX(0rem);
          transform: translateX(0rem);
  transition: all 0.3s ease-out;
}

.card .card__content::after,
.card--large .card__content::after {
  content: "→";
  display: inline-block;
  opacity: 0;
  -webkit-transform: translateX(-2rem);
          transform: translateX(-2rem);
  transition: all 0.3s 0.3s ease-out;
}

.card .card__image .lazyload,
.card .card__image .lazyloading,
.card--large .card__image .lazyload,
.card--large .card__image .lazyloading {
  -webkit-filter: blur(3px);
          filter: blur(3px);
}

.card .card__headline {
  margin: 3rem 0 1.5rem 0;
}

.card .card__content__date + .card__headline {
  margin: 0 0 1.5rem 0;
}

.card .card__content__date {
  font-size: 1.3rem;
  font-family: "ibm-plex-mono", Menlo, Monaco, Consolas, "Courier New", monospace;
  margin: 1rem 0 0.5rem 0;
}

.card--large {
  width: 100%;
  display: inline-block;
}

.card--large .card__headline {
  margin: 3rem 0;
  font-size: 2.4rem;
}

.card--large .card__content__date {
  margin: 1rem 0 0.5rem 0;
}

@media screen and (min-width: 48em) {
  .card--large {
    margin: 3rem 0 6rem 0;
  }

  .card--large .card__headline {
    margin: 0 0 3rem 0;
    font-size: 3.6rem;
  }

  .card--large .card__content__date {
    margin: 0 0 0.5rem 0;
  }
}

@media screen and (min-width: 34.375em) {
  .card--large .card__headline {
    font-size: 3rem;
  }

  .card--large p {
    font-size: 1.8rem;
  }
}

.contact-details {
  margin-bottom: 5rem;
}

.contact-details a {
  font-size: 1.6rem;
}

.contact-details .contact-details--name {
  font-family: "vesterbro", serif;
  font-size: 2.4rem;
  display: block;
}

.contact-details .contact-details--photo {
  border-radius: 0.5rem;
  width: 9rem;
  height: 9rem;
  display: block;
  margin-bottom: 1rem;
}

.fixed-aspect {
  position: relative;
}

.fixed-aspect__inner {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

.fixed-aspect--3-2 {
  padding-bottom: 66.667%;
}

.two-col-grid {
  display: grid;
  grid-template: 100%/42% 58%;
}

.two-col-grid .two-col-grid__first-col {
  grid-row: 1/2;
  grid-column: 1/2;
}

.two-col-grid .two-col-grid__second-col {
  grid-row: 1/2;
  grid-column: 2/3;
}

.two-col-grid.reverse {
  grid-template: 100%/58% 42%;
}

.two-col-grid.reverse .two-col-grid__first-col {
  grid-row: 1/2;
  grid-column: 2/3;
}

.two-col-grid.reverse .two-col-grid__second-col {
  grid-row: 1/2;
  grid-column: 1/2;
}

.start-start {
  justify-self: flex-start;
  align-self: flex-start;
}

.start-center {
  justify-self: flex-start;
  align-self: center;
}

.start-end {
  justify-self: flex-start;
  align-self: flex-end;
}

.center-start {
  justify-self: center;
  align-self: flex-start;
}

.center-center {
  justify-self: center;
  align-self: center;
}

.center-end {
  justify-self: center;
  align-self: flex-end;
}

.end-start {
  justify-self: flex-end;
  align-self: flex-start;
}

.end-center {
  justify-self: flex-end;
  align-self: center;
}

.end-end {
  justify-self: flex-end;
  align-self: flex-end;
}

.typed {
  margin: 6rem 0;
  position: relative;
  padding: 0.4rem 1.6rem;
  border: 3px solid #defa6d;
  font-size: 2.4rem;
  color: #defa6d;
}

.typed .label {
  font-size: 1.3rem;
  padding: 0 0.8rem;
  position: absolute;
  top: -1.3rem;
  left: 0.8rem;
  background-color: #00144a;
  letter-spacing: 2.3px;
  text-transform: uppercase;
}

.typed .phrases {
  font-family: "vesterbro", serif;
}

.typed .typed-cursor {
  color: #defa6d;
}

.typed .typed-cursor {
  opacity: 1;
  animation: typedjsBlink 0.7s infinite;
  -webkit-animation: typedjsBlink 0.7s infinite;
  animation: typedjsBlink 0.7s infinite;
}

@keyframes typedjsBlink {
  50% {
    opacity: 0;
  }
}

@-webkit-keyframes typedjsBlink {
  0% {
    opacity: 1;
  }

  50% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@media screen and (min-width: 58.75em) {
  .typed {
    font-size: 3.6rem;
    margin-top: 12rem;
  }
}

/* PrismJS 1.15.0
https://prismjs.com/download.html#themes=prism-dark&languages=markup+css+clike+javascript+markup-templating+json+markdown+php+processing+scss+sass */

/**
 * prism.js Dark theme for JavaScript, CSS and HTML
 * Based on the slides of the talk “/Reg(exp){2}lained/”
 * @author Lea Verou
 */

code[class*=language-],
pre[class*=language-] {
  color: white;
  background: none;
  /*text-shadow: 0 -.1em .2em black;*/
  font-family: "ibm-plex-mono", Menlo, Monaco, Consolas, "Courier New", monospace;
  text-align: left;
  white-space: pre;
  word-spacing: normal;
  word-break: normal;
  word-wrap: normal;
  line-height: 1.5;
  -moz-tab-size: 4;
  -o-tab-size: 4;
  tab-size: 4;
  -webkit-hyphens: none;
  -ms-hyphens: none;
  hyphens: none;
  border: 0;
  padding: 0;
}

@media print {
  code[class*=language-],
  pre[class*=language-] {
    text-shadow: none;
  }
}

pre[class*=language-],
:not(pre) > code[class*=language-] {
  background: #00144a;
  border-radius: 3px;
  box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.15);
  font-size: 1.6rem;
}

/* Code blocks */

pre[class*=language-] {
  padding: 1em;
  margin: 6rem 0;
  overflow: auto;
  /*
  border: .3em solid hsl(30, 20%, 40%);
  border-radius: .5em;
  box-shadow: 1px 1px .5em black inset;
  */
}

/* Inline code */

:not(pre) > code[class*=language-] {
  padding: 0.15em 0.2em 0.05em;
  border-radius: 0.3em;
  border: 0.13em solid hsl(30deg, 20%, 40%);
  white-space: normal;
}

.token.comment,
.token.prolog,
.token.doctype,
.token.cdata {
  color: rgba(255, 255, 255, 0.5);
}

.token.punctuation {
  opacity: 0.7;
}

.namespace {
  opacity: 0.7;
}

.token.property,
.token.tag,
.token.boolean,
.token.number,
.token.constant,
.token.symbol {
  color: #fa6d6f;
}

.token.selector,
.token.attr-name,
.token.string,
.token.char,
.token.builtin,
.token.inserted {
  color: #defa6d;
}

.token.operator,
.token.entity,
.token.url,
.language-css .token.string,
.style .token.string,
.token.variable {
  color: #FAA16D;
}

.token.atrule,
.token.attr-value,
.token.keyword {
  color: white;
}

.token.regex,
.token.important {
  color: #e90;
}

.token.important,
.token.bold {
  font-weight: bold;
}

.token.italic {
  font-style: italic;
}

.token.entity {
  cursor: help;
}

.token.deleted {
  color: red;
}

.messenger {
  margin-top: 6rem;
}

.messenger .message {
  border-radius: 2rem;
  display: inline-block;
  padding: 0.5rem 2rem;
  margin-bottom: 3rem;
}

.messenger div {
  max-width: 60%;
  word-wrap: break-word;
}

.messenger div:after {
  content: "";
  display: table;
  clear: both;
}

.messenger .clear {
  clear: both;
}

.messenger .message__response {
  position: relative;
  padding: 10px 20px;
  color: white;
  background: #00144a;
  border-radius: 25px;
  float: right;
}

.messenger .message__response:before {
  content: "";
  position: absolute;
  z-index: -1;
  bottom: -2px;
  right: -7px;
  height: 20px;
  border-right: 20px solid #00144a;
  border-bottom-left-radius: 16px 14px;
  -webkit-transform: translate(0, -2px);
}

.messenger .message__response:after {
  content: "";
  position: absolute;
  z-index: 1;
  bottom: -2px;
  right: -56px;
  width: 26px;
  height: 20px;
  background: #fafafa;
  border-bottom-left-radius: 10px;
  -webkit-transform: translate(-30px, -2px);
}

.messenger .message__call {
  position: relative;
  padding: 10px 20px;
  background: #ededed;
  border-radius: 25px;
  color: #00144a;
  float: left;
}

.messenger .message__call:before {
  content: "";
  position: absolute;
  z-index: 2;
  bottom: -2px;
  left: -7px;
  height: 20px;
  border-left: 20px solid #ededed;
  border-bottom-right-radius: 16px 14px;
  -webkit-transform: translate(0, -2px);
}

.messenger .message__call:after {
  content: "";
  position: absolute;
  z-index: 3;
  bottom: -2px;
  left: 4px;
  width: 26px;
  height: 20px;
  background: #fafafa;
  border-bottom-right-radius: 10px;
  -webkit-transform: translate(-30px, -2px);
}

.messenger .message__typing {
  -webkit-animation: 1.5s "typing" infinite;
          animation: 1.5s "typing" infinite;
}

.messenger .message__typing span {
  -webkit-animation: "ball-pulsing" 1.1s 0s infinite;
          animation: "ball-pulsing" 1.1s 0s infinite;
  font-weight: bold;
}

.messenger .message__typing span:nth-child(2) {
  -webkit-animation-delay: 0.3s;
          animation-delay: 0.3s;
}

.messenger .message__typing span:nth-child(3) {
  -webkit-animation-delay: 0.6s;
          animation-delay: 0.6s;
}

.media {
  display: block;
  padding: 2rem;
  text-decoration: none;
  transition: -webkit-transform 0.33s ease;
  transition: transform 0.33s ease;
  transition: transform 0.33s ease, -webkit-transform 0.33s ease;
}

.media .media__body {
  overflow: hidden;
}

a.media {
  background: none;
}

@media (hover: hover) {
  a.media:hover {
    -webkit-transform: translateY(-0.5rem);
            transform: translateY(-0.5rem);
  }
}

.media.left .media__image {
  float: left;
  margin-right: 2rem;
}

.media.right .media__image {
  float: right;
  margin-left: 2rem;
}

ul.list--check {
  margin-top: 4rem;
}

ul.list--check li {
  position: relative;
  list-style-type: none;
  padding: 1rem 0;
  margin-left: 4rem;
  font-size: 1.6rem;
  font-family: "ibm-plex-mono", Menlo, Monaco, Consolas, "Courier New", monospace;
}

ul.list--check li:before {
  content: "✔︎";
  position: absolute;
  top: 0.5rem;
  left: -4rem;
  width: 2.5rem;
  height: 2.5rem;
  padding: 0rem;
  background: #defa6d;
  color: #00144a;
  box-shadow: 0px 4px 12px 0px rgba(0, 20, 74, 0.15);
  border-radius: 50%;
  text-align: center;
  font-size: 2rem;
  font-weight: bold;
}

.icon {
  fill: currentColor;
}

.cta {
  position: relative;
  display: flex;
  background-color: #00144a;
  justify-content: center;
  align-content: flex-start;
  color: white;
  margin: 0 0 6rem 0;
  padding: 6rem 0;
}

.cta .cta-text {
  color: #b0c2e8;
  font-weight: normal;
  text-transform: uppercase;
  letter-spacing: 0.23rem;
  font-size: 1.3rem;
  display: block;
}

.cta .cta-text strong {
  color: white;
}

.cta h2 {
  font-size: 3rem;
}

.cta .container {
  text-align: center;
}

.cta .btn {
  border-radius: 24px;
  background-color: #143c8d;
  color: white;
  padding: 0.5rem 2rem;
  margin-top: 1.5rem;
}

.cta .btn:hover {
  color: #00144a;
  background-color: #b0c2e8;
}

.cta figure {
  position: absolute;
  margin: 0;
  width: 100%;
  height: 25rem;
  overflow: hidden;
  background: #00144a;
}

.cta figure img {
  border-radius: 0px;
  opacity: 0.25;
  width: 100%;
}

@media screen and (min-width: 48em) {
  .cta .container {
    width: 66.6666666667%;
    max-width: 710.656px;
  }
}

header.hero {
  position: relative;
  display: flex;
  background-color: #00144a;
  justify-content: center;
  align-content: flex-end;
  height: 25rem;
  overflow: hidden;
}

header.hero figure {
  position: absolute;
  margin: 0 !important;
  width: 100%;
  height: 25rem;
  overflow: hidden;
  background: #00144a;
}

header.hero figure img {
  border-radius: 0px;
  opacity: 0.6;
  width: 100vw;
}

header.hero figure figcaption .credits {
  color: white;
  text-shadow: 0 0 5px black;
}

header.hero figure figcaption .credits a {
  color: white;
  background-image: linear-gradient(white, white);
}

header.hero .article-meta {
  justify-content: flex-end;
  display: flex;
  flex-direction: column;
  width: 100%;
  padding: 0 1.5rem;
}

header.hero .article-meta .kicker,
header.hero .article-meta h1,
header.hero .article-meta a,
header.hero .article-meta p {
  color: white;
  text-shadow: 0 0 15px #00144a;
}

header.hero .article-meta a {
  background-image: linear-gradient(white, white);
  padding-bottom: 3px;
}

header.hero .article-meta .avatars {
  float: left;
  margin-right: 2rem;
}

header.hero .article-meta .authors {
  display: block;
  margin-top: 4px;
  margin-bottom: -4px;
}

header.hero .article-meta .authors,
header.hero .article-meta .article-published {
  color: white;
  font-size: 1.3rem;
  font-family: "ibm-plex-mono", Menlo, Monaco, Consolas, "Courier New", monospace;
}

header.hero--centered .article-meta {
  text-align: center;
}

header.hero--faded figure img {
  opacity: 0.3;
}

header.hero--light {
  background-color: white;
  color: #00144a;
}

header.hero--light figure {
  background-color: white;
}

@media screen and (min-width: 0) {
  header.hero {
    height: 30rem;
  }

  header.hero h1 {
    font-size: 3rem;
  }

  header.hero figure {
    height: 30rem;
  }

  header.hero figure figcaption {
    position: absolute;
    font-size: 1.2rem;
    right: 1.5rem;
    top: 1.5rem;
  }

  header.hero figure img {
    -o-object-fit: cover;
       object-fit: cover;
    height: 30rem;
  }
}

@media screen and (min-width: 34.375em) {
  header.hero {
    height: 33rem;
  }

  header.hero h1 {
    font-size: 4rem;
  }

  header.hero figure {
    height: 33rem;
  }

  header.hero figure img {
    height: auto;
  }
}

@media screen and (min-width: 48em) {
  header.hero .article-meta {
    width: 66.6666666667%;
    max-width: 710.656px;
  }

  header.hero {
    height: 40rem;
  }

  header.hero h1 {
    font-size: 4.8rem;
  }

  header.hero figure {
    height: 40rem;
  }

  header.hero figure figcaption {
    top: auto;
    bottom: 1.5rem;
  }

  header.hero figure img {
    margin-top: -15%;
  }
}

@media screen and (min-width: 58.75em) {
  header.hero figure img {
    margin-top: -20%;
  }
}

@media screen and (min-width: 68.75em) {
  header.hero figure img {
    margin-top: -25%;
  }
}

header.hero + .container {
  margin-top: 3rem;
}

.feature-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  grid-gap: 3rem;
}

.container {
  max-width: 106.6rem;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}

.container--narrow {
  max-width: 60rem;
}

.row {
  margin-left: -1.5rem;
  margin-right: -1.5rem;
}

.col-2xl-12,
.col-2xl-11,
.col-2xl-10,
.col-2xl-9,
.col-2xl-8,
.col-2xl-7,
.col-2xl-6,
.col-2xl-5,
.col-2xl-4,
.col-2xl-3,
.col-2xl-2,
.col-2xl-1,
.col-xl-12,
.col-xl-11,
.col-xl-10,
.col-xl-9,
.col-xl-8,
.col-xl-7,
.col-xl-6,
.col-xl-5,
.col-xl-4,
.col-xl-3,
.col-xl-2,
.col-xl-1,
.col-lg-12,
.col-lg-11,
.col-lg-10,
.col-lg-9,
.col-lg-8,
.col-lg-7,
.col-lg-6,
.col-lg-5,
.col-lg-4,
.col-lg-3,
.col-lg-2,
.col-lg-1,
.col-md-12,
.col-md-11,
.col-md-10,
.col-md-9,
.col-md-8,
.col-md-7,
.col-md-6,
.col-md-5,
.col-md-4,
.col-md-3,
.col-md-2,
.col-md-1,
.col-sm-12,
.col-sm-11,
.col-sm-10,
.col-sm-9,
.col-sm-8,
.col-sm-7,
.col-sm-6,
.col-sm-5,
.col-sm-4,
.col-sm-3,
.col-sm-2,
.col-sm-1,
.col-xs-12,
.col-xs-11,
.col-xs-10,
.col-xs-9,
.col-xs-8,
.col-xs-7,
.col-xs-6,
.col-xs-5,
.col-xs-4,
.col-xs-3,
.col-xs-2,
.col-xs-1 {
  float: left;
  padding-left: 1.5rem;
  padding-right: 1.5rem;
  width: 100%;
}

@media screen and (min-width: 0) {
  .col-xs-1 {
    width: 8.3333333333%;
  }

  .col-xs-2 {
    width: 16.6666666667%;
  }

  .col-xs-3 {
    width: 25%;
  }

  .col-xs-4 {
    width: 33.3333333333%;
  }

  .col-xs-5 {
    width: 41.6666666667%;
  }

  .col-xs-6 {
    width: 50%;
  }

  .col-xs-7 {
    width: 58.3333333333%;
  }

  .col-xs-8 {
    width: 66.6666666667%;
  }

  .col-xs-9 {
    width: 75%;
  }

  .col-xs-10 {
    width: 83.3333333333%;
  }

  .col-xs-11 {
    width: 91.6666666667%;
  }

  .col-xs-12 {
    width: 100%;
  }
}

@media screen and (min-width: 0) {
  .offset-xs-0 {
    margin-left: 0%;
  }

  .offset-xs-1 {
    margin-left: 8.3333333333%;
  }

  .offset-xs-2 {
    margin-left: 16.6666666667%;
  }

  .offset-xs-3 {
    margin-left: 25%;
  }

  .offset-xs-4 {
    margin-left: 33.3333333333%;
  }

  .offset-xs-5 {
    margin-left: 41.6666666667%;
  }

  .offset-xs-6 {
    margin-left: 50%;
  }

  .offset-xs-7 {
    margin-left: 58.3333333333%;
  }

  .offset-xs-8 {
    margin-left: 66.6666666667%;
  }

  .offset-xs-9 {
    margin-left: 75%;
  }

  .offset-xs-10 {
    margin-left: 83.3333333333%;
  }

  .offset-xs-11 {
    margin-left: 91.6666666667%;
  }
}

@media screen and (min-width: 0) {
  .pull-right-xs {
    float: right;
  }

  .pull-left-xs {
    float: left;
  }
}

@media screen and (min-width: 0) {
  .clear-xs {
    clear: both;
  }
}

@media screen and (min-width: 34.375em) {
  .clear-xs {
    clear: none;
  }
}

@media screen and (min-width: 34.375em) {
  .col-sm-1 {
    width: 8.3333333333%;
  }

  .col-sm-2 {
    width: 16.6666666667%;
  }

  .col-sm-3 {
    width: 25%;
  }

  .col-sm-4 {
    width: 33.3333333333%;
  }

  .col-sm-5 {
    width: 41.6666666667%;
  }

  .col-sm-6 {
    width: 50%;
  }

  .col-sm-7 {
    width: 58.3333333333%;
  }

  .col-sm-8 {
    width: 66.6666666667%;
  }

  .col-sm-9 {
    width: 75%;
  }

  .col-sm-10 {
    width: 83.3333333333%;
  }

  .col-sm-11 {
    width: 91.6666666667%;
  }

  .col-sm-12 {
    width: 100%;
  }
}

@media screen and (min-width: 34.375em) {
  .offset-sm-0 {
    margin-left: 0%;
  }

  .offset-sm-1 {
    margin-left: 8.3333333333%;
  }

  .offset-sm-2 {
    margin-left: 16.6666666667%;
  }

  .offset-sm-3 {
    margin-left: 25%;
  }

  .offset-sm-4 {
    margin-left: 33.3333333333%;
  }

  .offset-sm-5 {
    margin-left: 41.6666666667%;
  }

  .offset-sm-6 {
    margin-left: 50%;
  }

  .offset-sm-7 {
    margin-left: 58.3333333333%;
  }

  .offset-sm-8 {
    margin-left: 66.6666666667%;
  }

  .offset-sm-9 {
    margin-left: 75%;
  }

  .offset-sm-10 {
    margin-left: 83.3333333333%;
  }

  .offset-sm-11 {
    margin-left: 91.6666666667%;
  }
}

@media screen and (min-width: 34.375em) {
  .pull-right-sm {
    float: right;
  }

  .pull-left-sm {
    float: left;
  }
}

@media screen and (min-width: 34.375em) {
  .clear-sm {
    clear: both;
  }
}

@media screen and (min-width: 48em) {
  .clear-sm {
    clear: none;
  }
}

@media screen and (min-width: 48em) {
  .col-md-1 {
    width: 8.3333333333%;
  }

  .col-md-2 {
    width: 16.6666666667%;
  }

  .col-md-3 {
    width: 25%;
  }

  .col-md-4 {
    width: 33.3333333333%;
  }

  .col-md-5 {
    width: 41.6666666667%;
  }

  .col-md-6 {
    width: 50%;
  }

  .col-md-7 {
    width: 58.3333333333%;
  }

  .col-md-8 {
    width: 66.6666666667%;
  }

  .col-md-9 {
    width: 75%;
  }

  .col-md-10 {
    width: 83.3333333333%;
  }

  .col-md-11 {
    width: 91.6666666667%;
  }

  .col-md-12 {
    width: 100%;
  }
}

@media screen and (min-width: 48em) {
  .offset-md-0 {
    margin-left: 0%;
  }

  .offset-md-1 {
    margin-left: 8.3333333333%;
  }

  .offset-md-2 {
    margin-left: 16.6666666667%;
  }

  .offset-md-3 {
    margin-left: 25%;
  }

  .offset-md-4 {
    margin-left: 33.3333333333%;
  }

  .offset-md-5 {
    margin-left: 41.6666666667%;
  }

  .offset-md-6 {
    margin-left: 50%;
  }

  .offset-md-7 {
    margin-left: 58.3333333333%;
  }

  .offset-md-8 {
    margin-left: 66.6666666667%;
  }

  .offset-md-9 {
    margin-left: 75%;
  }

  .offset-md-10 {
    margin-left: 83.3333333333%;
  }

  .offset-md-11 {
    margin-left: 91.6666666667%;
  }
}

@media screen and (min-width: 48em) {
  .pull-right-md {
    float: right;
  }

  .pull-left-md {
    float: left;
  }
}

@media screen and (min-width: 48em) {
  .clear-md {
    clear: both;
  }
}

@media screen and (min-width: 58.75em) {
  .clear-md {
    clear: none;
  }
}

@media screen and (min-width: 58.75em) {
  .col-lg-1 {
    width: 8.3333333333%;
  }

  .col-lg-2 {
    width: 16.6666666667%;
  }

  .col-lg-3 {
    width: 25%;
  }

  .col-lg-4 {
    width: 33.3333333333%;
  }

  .col-lg-5 {
    width: 41.6666666667%;
  }

  .col-lg-6 {
    width: 50%;
  }

  .col-lg-7 {
    width: 58.3333333333%;
  }

  .col-lg-8 {
    width: 66.6666666667%;
  }

  .col-lg-9 {
    width: 75%;
  }

  .col-lg-10 {
    width: 83.3333333333%;
  }

  .col-lg-11 {
    width: 91.6666666667%;
  }

  .col-lg-12 {
    width: 100%;
  }
}

@media screen and (min-width: 58.75em) {
  .offset-lg-0 {
    margin-left: 0%;
  }

  .offset-lg-1 {
    margin-left: 8.3333333333%;
  }

  .offset-lg-2 {
    margin-left: 16.6666666667%;
  }

  .offset-lg-3 {
    margin-left: 25%;
  }

  .offset-lg-4 {
    margin-left: 33.3333333333%;
  }

  .offset-lg-5 {
    margin-left: 41.6666666667%;
  }

  .offset-lg-6 {
    margin-left: 50%;
  }

  .offset-lg-7 {
    margin-left: 58.3333333333%;
  }

  .offset-lg-8 {
    margin-left: 66.6666666667%;
  }

  .offset-lg-9 {
    margin-left: 75%;
  }

  .offset-lg-10 {
    margin-left: 83.3333333333%;
  }

  .offset-lg-11 {
    margin-left: 91.6666666667%;
  }
}

@media screen and (min-width: 58.75em) {
  .pull-right-lg {
    float: right;
  }

  .pull-left-lg {
    float: left;
  }
}

@media screen and (min-width: 58.75em) {
  .clear-lg {
    clear: both;
  }
}

@media screen and (min-width: 68.75em) {
  .clear-lg {
    clear: none;
  }
}

@media screen and (min-width: 68.75em) {
  .col-xl-1 {
    width: 8.3333333333%;
  }

  .col-xl-2 {
    width: 16.6666666667%;
  }

  .col-xl-3 {
    width: 25%;
  }

  .col-xl-4 {
    width: 33.3333333333%;
  }

  .col-xl-5 {
    width: 41.6666666667%;
  }

  .col-xl-6 {
    width: 50%;
  }

  .col-xl-7 {
    width: 58.3333333333%;
  }

  .col-xl-8 {
    width: 66.6666666667%;
  }

  .col-xl-9 {
    width: 75%;
  }

  .col-xl-10 {
    width: 83.3333333333%;
  }

  .col-xl-11 {
    width: 91.6666666667%;
  }

  .col-xl-12 {
    width: 100%;
  }
}

@media screen and (min-width: 68.75em) {
  .offset-xl-0 {
    margin-left: 0%;
  }

  .offset-xl-1 {
    margin-left: 8.3333333333%;
  }

  .offset-xl-2 {
    margin-left: 16.6666666667%;
  }

  .offset-xl-3 {
    margin-left: 25%;
  }

  .offset-xl-4 {
    margin-left: 33.3333333333%;
  }

  .offset-xl-5 {
    margin-left: 41.6666666667%;
  }

  .offset-xl-6 {
    margin-left: 50%;
  }

  .offset-xl-7 {
    margin-left: 58.3333333333%;
  }

  .offset-xl-8 {
    margin-left: 66.6666666667%;
  }

  .offset-xl-9 {
    margin-left: 75%;
  }

  .offset-xl-10 {
    margin-left: 83.3333333333%;
  }

  .offset-xl-11 {
    margin-left: 91.6666666667%;
  }
}

@media screen and (min-width: 68.75em) {
  .pull-right-xl {
    float: right;
  }

  .pull-left-xl {
    float: left;
  }
}

@media screen and (min-width: 68.75em) {
  .clear-xl {
    clear: both;
  }
}

@media screen and (min-width: 97.5em) {
  .clear-xl {
    clear: none;
  }
}

@media screen and (min-width: 97.5em) {
  .col-2xl-1 {
    width: 8.3333333333%;
  }

  .col-2xl-2 {
    width: 16.6666666667%;
  }

  .col-2xl-3 {
    width: 25%;
  }

  .col-2xl-4 {
    width: 33.3333333333%;
  }

  .col-2xl-5 {
    width: 41.6666666667%;
  }

  .col-2xl-6 {
    width: 50%;
  }

  .col-2xl-7 {
    width: 58.3333333333%;
  }

  .col-2xl-8 {
    width: 66.6666666667%;
  }

  .col-2xl-9 {
    width: 75%;
  }

  .col-2xl-10 {
    width: 83.3333333333%;
  }

  .col-2xl-11 {
    width: 91.6666666667%;
  }

  .col-2xl-12 {
    width: 100%;
  }
}

@media screen and (min-width: 97.5em) {
  .offset-2xl-0 {
    margin-left: 0%;
  }

  .offset-2xl-1 {
    margin-left: 8.3333333333%;
  }

  .offset-2xl-2 {
    margin-left: 16.6666666667%;
  }

  .offset-2xl-3 {
    margin-left: 25%;
  }

  .offset-2xl-4 {
    margin-left: 33.3333333333%;
  }

  .offset-2xl-5 {
    margin-left: 41.6666666667%;
  }

  .offset-2xl-6 {
    margin-left: 50%;
  }

  .offset-2xl-7 {
    margin-left: 58.3333333333%;
  }

  .offset-2xl-8 {
    margin-left: 66.6666666667%;
  }

  .offset-2xl-9 {
    margin-left: 75%;
  }

  .offset-2xl-10 {
    margin-left: 83.3333333333%;
  }

  .offset-2xl-11 {
    margin-left: 91.6666666667%;
  }
}

@media screen and (min-width: 97.5em) {
  .pull-right-2xl {
    float: right;
  }

  .pull-left-2xl {
    float: left;
  }
}

@media screen and (min-width: 97.5em) {
  .clear-2xl {
    clear: both;
  }
}

.page-header {
  top: 0;
  left: 0;
  width: 100%;
  position: absolute;
  background: transparent;
  z-index: 10;
}

.page-header .site-logo {
  margin-top: 4.8rem;
  display: inline-block;
}

@media screen and (min-width: 68.75em) {
  .site-logo {
    margin-left: -1.8rem;
  }

  .site-logo--small {
    margin-left: 0;
  }
}

@media screen and (min-width: 48em) {
  .page-header .site-logo--small {
    display: none;
  }
}

@media screen and (max-width: 47.9375em) {
  .page-header .site-logo--large {
    display: none;
  }

  .page-header .site-logo--small {
    margin-left: 0;
    margin-top: 2rem;
  }

  .page-header .site-logo--small img {
    width: 8rem;
    height: auto;
  }
}

.feature-section {
  display: flex;
  flex-wrap: wrap;
}

.feature-section .feature-grid__item {
  color: white;
  background-color: #00144a;
  padding: 1.5rem;
  border-radius: 4px;
  box-shadow: 0 0 30px 10px rgba(20, 60, 141, 0.2);
}

.feature-section .feature-grid__item strong {
  margin-bottom: 0.5rem;
}

.feature-section .feature-grid__item p {
  font-size: 1.6rem;
  color: #d4dced;
}

.feature-section .feature-grid__item p a {
  color: #d4dced;
  background-image: linear-gradient(#d4dced, #d4dced);
}

.feature-section .feature-grid__item svg {
  display: block;
  width: 6rem;
  margin: 1rem 1rem 2rem 1rem;
}

.feature-section .feature-section__aside p {
  color: #d4dced;
}

.feature-section .feature-section__aside p a {
  color: #d4dced;
  background-image: linear-gradient(#d4dced, #d4dced);
}

@media screen and (min-width: 58.75em) {
  .feature-section__aside {
    width: 25%;
    margin-right: 5%;
  }

  .feature-section__item-grid {
    width: 70%;
  }
}

#footer {
  padding: 6rem 0;
  font-size: 1.6rem;
}

#footer .heading {
  font-size: 2.4rem;
}

#footer .nav ul {
  line-height: 1.9;
  margin-top: 1rem;
}

#footer .nav ul a {
  padding-bottom: 0;
}

#footer p {
  margin-bottom: 2.2rem;
}

@media screen and (min-width: 34.375em) {
  #footer .heading {
    font-size: 3.6rem;
  }
}

@media screen and (min-width: 48em) {
  #footer .nav ul {
    line-height: normal;
    margin-top: 0;
  }
}

nav.main {
  position: fixed;
  display: block;
  background: #fafafa;
  width: 100%;
  height: 5rem;
  top: 0;
  box-shadow: 0px 4px 12px 0px rgba(0, 20, 74, 0.15);
  z-index: 1000;
  transition: top 0.3s ease-out;
}

nav.main.main--hidden {
  top: -6.5rem;
}

nav.main a.site-logo-link {
  background-image: none;
  display: inline-block;
}

@media screen and (min-width: 34.375em) {
  nav.main .site-logo::after {
    content: "Present Progressive";
    font-family: "vesterbro", serif;
    display: inline-block;
    z-index: 1001;
    -webkit-transform: translate(-0.6rem, -1.3rem);
            transform: translate(-0.6rem, -1.3rem);
    opacity: 0;
    transition: all 0.3s ease-out;
  }

  nav.main .site-logo:hover::after {
    opacity: 1;
    -webkit-transform: translate(0.2rem, -1.3rem);
            transform: translate(0.2rem, -1.3rem);
    transition: all 0.5s ease-out;
  }
}

nav.main .site-logo img {
  width: 5rem;
  margin-left: -1.3rem;
  margin-top: 0.8rem;
}

nav.main ul {
  float: right;
  margin-top: 0.8rem;
  margin-bottom: 0;
}

nav.main ul li {
  list-style: none;
  display: inline-block;
  font-size: 1.6rem;
  margin-right: 1.5rem;
}

nav.main ul li a {
  color: #555570;
  background-size: 0% 1px;
  background-image: linear-gradient(#555570, #555570);
}

nav.main ul li a.active,
nav.main ul li a:hover {
  color: #555570;
  background-size: 100% 1px;
}

nav.main ul li span.active {
  color: #555570;
  background-size: 100% 1px;
  background-image: linear-gradient(#555570, #555570);
}

nav.main ul li:last-child {
  margin-right: 0;
}

.page-header nav.main {
  position: static;
  display: inline-block;
  background: none;
  width: auto;
  box-shadow: none;
  margin-top: 2rem;
  float: right;
}

@media screen and (min-width: 48em) {
  .page-header nav.main {
    margin-top: 5.9rem;
  }
}

nav button.btn-menu {
  display: none;
}

nav .nav--responsive {
  float: right;
}

nav .nav--responsive a.btn,
nav .nav--responsive .site-logo--nav {
  display: none;
}

@media screen and (max-width: 34.3125em) {
  .page-header nav.main {
    display: none;
  }

  nav .site-logo--nav {
    display: block;
    position: fixed;
    left: 1.5rem;
    top: 0;
  }

  nav.main--hidden button.btn-menu {
    position: fixed;
    top: 2.5rem;
    right: 0.6rem;
    z-index: 3000;
  }

  nav.main--hidden button.btn-menu:active {
    background-color: white;
    border-radius: 3px;
    box-shadow: 0px 4px 12px 0px rgba(0, 20, 74, 0.15);
  }

  nav button.btn-menu {
    display: block;
    position: absolute;
    height: 40px;
    right: 0.6rem;
    top: 0.6rem;
    z-index: 3000;
    font-family: "ibm-plex-mono", Menlo, Monaco, Consolas, "Courier New", monospace;
    font-size: 1.3rem;
    display: inline-block;
    padding: 0.8rem 0.8rem 0.8rem 1rem;
    flex-direction: column;
    justify-content: space-between;
  }

  nav button.btn-menu span {
    display: inline-block;
    -webkit-transform: translateY(-5px);
            transform: translateY(-5px);
  }

  nav button.btn-menu .btn-menu--bars {
    display: inline-block;
    height: 21px;
    margin-left: 6px;
  }

  nav button.btn-menu .btn-menu--bars .btn-menu--bar {
    transition: opacity 0.2s ease-out, -webkit-transform 0.2s ease-out;
    transition: transform 0.2s ease-out, opacity 0.2s ease-out;
    transition: transform 0.2s ease-out, opacity 0.2s ease-out, -webkit-transform 0.2s ease-out;
    width: 36px;
    height: 3px;
    display: block;
    background-color: #00144a;
  }

  nav button.btn-menu .btn-menu--bars .btn-menu--bar:nth-child(2) {
    -webkit-transform: translateY(6px);
            transform: translateY(6px);
  }

  nav button.btn-menu .btn-menu--bars .btn-menu--bar:nth-child(3) {
    -webkit-transform: translateY(12px);
            transform: translateY(12px);
  }

  nav button.btn-menu.is-open {
    background-color: #00144a;
    color: #858499;
  }

  nav button.btn-menu.is-open .btn-menu--bar {
    transition: opacity 0.2s ease-out, -webkit-transform 0.2s ease-out;
    transition: transform 0.2s ease-out, opacity 0.2s ease-out;
    transition: transform 0.2s ease-out, opacity 0.2s ease-out, -webkit-transform 0.2s ease-out;
    background-color: white;
  }

  nav button.btn-menu.is-open .btn-menu--bar:nth-child(1) {
    -webkit-transform: translateY(9px) rotate(45deg);
            transform: translateY(9px) rotate(45deg);
  }

  nav button.btn-menu.is-open .btn-menu--bar:nth-child(2) {
    -webkit-transform: translateY(6px);
            transform: translateY(6px);
    opacity: 0;
  }

  nav button.btn-menu.is-open .btn-menu--bar:nth-child(3) {
    -webkit-transform: translateY(3px) rotate(-45deg);
            transform: translateY(3px) rotate(-45deg);
  }

  nav.has-offset .site-logo--nav img {
    margin-top: 2.8rem;
  }

  nav.has-offset.main.is-open .nav--responsive {
    padding-top: 9rem;
  }

  /* nav layer for small screens */

  nav.main a.btn,
  nav.main .site-logo--nav {
    display: block;
  }

  nav.main .nav--responsive {
    z-index: 2000;
    position: fixed;
    pointer-events: none;
    margin-top: 0;
    top: 0;
    right: 0;
    bottom: -3%;
    left: 0;
    background-color: rgba(0, 20, 74, 0.97);
    -webkit-transform: translateY(-3%);
            transform: translateY(-3%);
    transition: opacity 0.2s ease-out, -webkit-transform 0.2s ease-out;
    transition: transform 0.2s ease-out, opacity 0.2s ease-out;
    transition: transform 0.2s ease-out, opacity 0.2s ease-out, -webkit-transform 0.2s ease-out;
    padding: 7rem 1rem;
    opacity: 0;
  }

  nav.main .nav--responsive ul {
    float: none;
    margin-bottom: 3rem;
  }

  nav.main .nav--responsive li {
    display: block;
    font-family: "vesterbro", serif;
    font-size: 3.6rem;
    margin-bottom: 1rem;
  }

  nav.main .nav--responsive li a,
  nav.main .nav--responsive li a.active,
  nav.main .nav--responsive li span.active {
    color: white;
    background-image: linear-gradient(white, white);
  }

  nav.main .nav--responsive li a {
    background-size: 0% 2px;
  }

  nav.main .nav--responsive li a:hover,
  nav.main .nav--responsive li a:active {
    background-size: 100% 2px;
    color: white;
  }

  nav.main .nav--responsive li span.active,
  nav.main .nav--responsive li a.active {
    background-size: 100% 2px;
  }

  nav.main .nav--responsive a.btn {
    display: inline;
    padding: 1rem 1.2rem;
  }

  nav.main.is-open .nav--responsive {
    pointer-events: auto;
    -webkit-transform: translateY(0);
            transform: translateY(0);
    transition: opacity 0.3s ease-out, -webkit-transform 0.3s ease-out;
    transition: transform 0.3s ease-out, opacity 0.3s ease-out;
    transition: transform 0.3s ease-out, opacity 0.3s ease-out, -webkit-transform 0.3s ease-out;
    opacity: 1;
  }

  .template-home nav.main .nav--responsive a.btn--home {
    display: none;
  }
}

a.btn,
span.btn,
button.btn {
  border-radius: 3px;
  padding: 1rem 1.6rem;
  display: inline-block;
  border: 1px solid transparent;
  font-family: "gt-walsheim", Helvetica, Arial, sans-serif;
  font-size: 1.6rem;
  font-weight: 400;
  line-height: 1.5;
  text-align: center;
  background: transparent;
  background-image: none;
  cursor: pointer;
}

a.btn,
span.btn,
button.btn {
  font-family: "gt-walsheim", Helvetica, Arial, sans-serif;
  text-transform: uppercase;
  font-weight: bold;
  letter-spacing: 0.23rem;
  font-size: 1.3rem;
  border-radius: 6px;
  padding: 1rem 2.4rem;
}

a.btn-menu,
span.btn-menu,
button.btn-menu {
  text-transform: none;
  letter-spacing: normal;
  font-weight: normal;
}

a.btn--primary,
span.btn--primary,
button.btn--primary {
  background-color: #00144a;
  color: white;
  border: 2px solid #00144a;
  box-shadow: 0px 4px 12px 0px rgba(0, 20, 74, 0.15);
}

a.btn--primary:not([disabled]):hover,
span.btn--primary:not([disabled]):hover,
button.btn--primary:not([disabled]):hover {
  background: white;
  color: #00144a;
}

a.btn--primary[disabled],
span.btn--primary[disabled],
button.btn--primary[disabled] {
  background-color: #C0C0CC;
  cursor: default;
}

.u-bg-midnight a.btn--primary,
.u-bg-midnight span.btn--primary,
.u-bg-midnight button.btn--primary,
.u-bg-midnight-dark a.btn--primary,
.u-bg-midnight-dark span.btn--primary,
.u-bg-midnight-dark button.btn--primary {
  background-color: white;
  color: #00144a;
  border: 2px solid white;
  box-shadow: 0px 4px 12px 0px rgba(0, 20, 74, 0.15);
}

.u-bg-midnight a.btn--primary:not([disabled]):hover,
.u-bg-midnight span.btn--primary:not([disabled]):hover,
.u-bg-midnight button.btn--primary:not([disabled]):hover,
.u-bg-midnight-dark a.btn--primary:not([disabled]):hover,
.u-bg-midnight-dark span.btn--primary:not([disabled]):hover,
.u-bg-midnight-dark button.btn--primary:not([disabled]):hover {
  background: #00144a;
  color: white;
  border: 2px solid white;
}

a.btn--secondary,
span.btn--secondary,
button.btn--secondary {
  font-weight: bold;
  background-color: white;
  border: 2px solid #00144a;
  color: #00144a;
  box-shadow: 0px 4px 12px 0px rgba(0, 20, 74, 0.15);
}

a.btn--secondary:not([disabled]):hover,
span.btn--secondary:not([disabled]):hover,
button.btn--secondary:not([disabled]):hover {
  background: #00144a;
  color: white;
}

a.btn--secondary[disabled],
span.btn--secondary[disabled],
button.btn--secondary[disabled] {
  background-color: #C0C0CC;
  color: #555570;
  cursor: default;
}

a.btn--tertiary,
span.btn--tertiary,
button.btn--tertiary {
  font-weight: normal;
  font-size: 1.4rem;
  color: #555570;
  border: 1px #555570 solid;
  border-radius: 3px;
  position: relative;
}

a.btn--tertiary:not([disabled]):hover,
span.btn--tertiary:not([disabled]):hover,
button.btn--tertiary:not([disabled]):hover {
  color: #00144a;
  border-color: #00144a;
  background-color: #f0f0f5;
}

a.btn--tertiary[disabled],
span.btn--tertiary[disabled],
button.btn--tertiary[disabled] {
  background-color: #C0C0CC;
  color: #555570;
  cursor: default;
}

a.btn--url,
span.btn--url,
button.btn--url {
  font-family: "ibm-plex-mono", Menlo, Monaco, Consolas, "Courier New", monospace;
  text-transform: none;
  letter-spacing: normal;
  font-weight: normal;
  font-size: 1.4rem;
  color: #555570;
  border: 1px #555570 solid;
  border-radius: 3px;
  position: relative;
  padding-right: 4.2rem;
}

a.btn--url:not([disabled]):hover,
span.btn--url:not([disabled]):hover,
button.btn--url:not([disabled]):hover {
  color: #00144a;
  border-color: #00144a;
  background-color: #f0f0f5;
}

a.btn--url[disabled],
span.btn--url[disabled],
button.btn--url[disabled] {
  background-color: #C0C0CC;
  color: #555570;
  cursor: default;
}

a.btn--url:after,
span.btn--url:after,
button.btn--url:after {
  content: "";
  display: block;
  position: absolute;
  top: 16px;
  right: 16px;
  width: 18px;
  height: 7px;
  background-image: url("data:image/svg+xml,%3Csvg width='18' height='7' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cpath fill='%2300144a' d ='M18 3.5 11 7V0z'/%3E%3Cpath stroke='%2300144a' stroke-linecap='square' d='M10.5 3.5H.5'/%3E%3C/g%3E%3C/svg%3E");
  transition: -webkit-transform 0.2s ease-out;
  transition: transform 0.2s ease-out;
  transition: transform 0.2s ease-out, -webkit-transform 0.2s ease-out;
}

a.btn--url:hover:after,
span.btn--url:hover:after,
button.btn--url:hover:after {
  -webkit-transform: translateX(6px);
          transform: translateX(6px);
  transition: -webkit-transform 0.1s ease-out;
  transition: transform 0.1s ease-out;
  transition: transform 0.1s ease-out, -webkit-transform 0.1s ease-out;
}

@media screen and (max-width: 34.3125em) {
  a.btn:not(.btn--url),
  span.btn:not(.btn--url),
  button.btn:not(.btn--url) {
    font-size: 1.3rem;
    padding: 1rem 2.4rem;
    border-radius: 3px;
  }
}

.btn-group {
  display: flex;
  gap: 1.6rem;
  flex-direction: column;
}

@media screen and (min-width: 34.375em) {
  .btn-group {
    flex-direction: row;
    gap: 2rem;
  }
}

.nav ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}

.nav a {
  text-decoration: none;
}

.form input {
  display: block;
  width: 100%;
  padding: 0.8rem 1.6rem;
  border-radius: 3px;
  border: 1px solid rgba(0, 0, 0, 0.25);
  background-clip: padding-box;
  background-image: none;
}

.form--contact label {
  margin-bottom: 0.4rem;
  font-size: 1.4rem;
  font-weight: bold;
  letter-spacing: 0.23rem;
  text-transform: uppercase;
  white-space: nowrap;
}

.form--contact input,
.form--contact textarea {
  background-color: #fff;
  border: 0;
  box-shadow: 0 0 20px 0 rgba(0, 20, 74, 0.05);
  transition: box-shadow 0.3s ease-out;
}

.form--contact input:placeholder,
.form--contact textarea:placeholder {
  color: #C0C0CC;
}

.form--contact input:hover,
.form--contact input:focus,
.form--contact textarea:hover,
.form--contact textarea:focus {
  box-shadow: 0 0 20px 0 rgba(0, 20, 74, 0.3);
  outline: 0;
}

.form--contact span.mandatory {
  display: none;
}

.form--contact .btn--primary {
  display: block;
  width: 100%;
}

.form--contact .widget {
  margin-bottom: 1.5rem;
}

#intro {
  background: url(/assets/images/noise.png?cc6c06c39a8964d244b947a950911039);
  padding-top: 21.6rem;
  min-height: 77rem;
}

#intro .thumbnails {
  position: relative;
  height: 320px;
  margin-top: 40px;
  overflow: hidden;
}

#intro .thumbnail {
  position: absolute;
  width: 152px;
  height: 95px;
  border-radius: 4px;
  box-shadow: 0px 4px 12px 0px rgba(0, 20, 74, 0.15);
  background: #555570;
}

#intro .thumbnail img,
#intro .thumbnail video {
  width: 100%;
  border-radius: 4px;
}

#intro .thumbnail-0 {
  top: 0px;
  right: 30px;
}

#intro .thumbnail-1 {
  top: 73px;
  right: 265px;
}

#intro .thumbnail-2 {
  top: 138px;
  right: 222px;
}

#intro .thumbnail-3 {
  top: 75px;
  right: -40px;
}

#intro .thumbnail-4 {
  top: 200px;
  right: 350px;
}

#intro .thumbnail-5 {
  top: 280px;
  right: -5px;
}

#intro .thumbnail-6 {
  display: none;
}

@media screen and (min-width: 48em) {
  #intro .thumbnails {
    position: absolute;
    height: auto;
    right: 0;
    top: 0;
    margin-top: 0;
    overflow: visible;
  }

  #intro .thumbnail-0 {
    top: 140px;
    right: -40px;
  }

  #intro .thumbnail-1 {
    top: 193px;
    right: 185px;
  }

  #intro .thumbnail-2 {
    top: 258px;
    right: 142px;
  }

  #intro .thumbnail-3 {
    top: 445px;
    right: 30px;
  }

  #intro .thumbnail-4 {
    top: 500px;
    right: 170px;
  }

  #intro .thumbnail-5 {
    top: 581px;
    right: 77px;
  }
}

@media screen and (min-width: 68.75em) {
  #intro .thumbnail-0 {
    top: 123px;
    right: -40px;
  }

  #intro .thumbnail-1 {
    top: 193px;
    right: 385px;
  }

  #intro .thumbnail-2 {
    top: 258px;
    right: 142px;
  }

  #intro .thumbnail-3 {
    top: 425px;
    right: 218px;
  }

  #intro .thumbnail-4 {
    top: 613px;
    right: 429px;
  }

  #intro .thumbnail-6 {
    display: block;
    top: 370px;
    right: 335px;
  }
}

@media screen and (min-width: 97.5em) {
  #intro .thumbnail-6 {
    display: block;
    top: 270px;
    right: 500px;
  }
}

@media screen and (max-width: 47.9375em) {
  #intro {
    padding-top: 12rem;
    min-height: auto;
  }
}

#intro h1 {
  font-size: 10vw;
  font-family: "vesterbro", serif;
  margin-top: 8px;
  margin-bottom: 8px;
  line-height: 1.125;
}

@media screen and (min-width: 34.375em) {
  #intro h1 {
    font-size: 5.6rem;
  }
}

#intro .image-container {
  position: absolute;
}

#intro .tilde {
  top: 264px;
  left: 364px;
  width: auto;
}

#intro .office-mood {
  top: 29px;
  right: 1.5rem;
  -o-object-fit: cover;
     object-fit: cover;
  width: 370px;
  height: 370px;
  box-shadow: 10px 10px 20px 0 rgba(0, 20, 74, 0.1);
}

@media screen and (max-width: 47.9375em) {
  #intro .tilde {
    display: none;
  }

  #intro .office-mood {
    opacity: 0.75;
    width: 370px;
    height: 370px;
    top: -30px;
  }
}

@media screen and (max-width: 34.3125em) {
  #intro .flag-canvas {
    display: none;
  }

  #intro .office-mood {
    opacity: 0.75;
    top: 110px;
    width: 260px;
    height: 260px;
  }

  #intro .office-mood img {
    width: 260px;
    height: 260px;
  }

  #intro .tilde {
    display: none;
  }
}

#about-us,
#portfolio {
  padding: 6rem 0;
}

#about-us .team img {
  border-radius: 0.5rem;
  width: 100%;
  max-width: 540px;
  height: auto;
  margin-top: 4rem;
}

@media screen and (max-width: 767px) {
  #about-us .team img {
    margin-bottom: 4rem;
  }
}

.memberships .memberships--logo {
  margin-right: 2rem;
}

#contact {
  padding: 3rem 0 6rem;
  font-size: 1.6rem;
}

[id=portfolio] .project {
  width: 100%;
  margin-bottom: 1.25rem;
}

[id=portfolio] .project img,
[id=portfolio] .project video {
  width: 100%;
  height: 100%;
}

[id=portfolio] .project img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
}

@media screen and (min-width: 600px) {
  [id=portfolio] .project-row {
    display: flex;
    justify-content: flex-start;
    flex-flow: row wrap;
  }

  [id=portfolio] .project-1,
  [id=portfolio] .project-2,
  [id=portfolio] .project-3,
  [id=portfolio] .project-4,
  [id=portfolio] .project-5 {
    width: 45.8rem;
    height: 31.6rem;
  }

  [id=portfolio] .project-1,
  [id=portfolio] .project-3 {
    margin-right: 1.6rem;
  }

  [id=portfolio] .project-4 .inset {
    height: 100%;
    padding: 4.8rem 5.6rem;
    background-color: #00144a;
  }
}

@media screen and (min-width: 1200px) {
  [id=portfolio] .project {
    overflow: visible !important;
    margin-bottom: 2rem;
  }

  [id=portfolio] .project-1 {
    width: 30rem;
    height: 20.8rem;
    margin-right: 2rem;
  }

  [id=portfolio] .project-2 {
    width: 46rem;
    height: 31.6rem;
  }

  [id=portfolio] .project-3 {
    width: 62rem;
    height: 42.8rem;
    margin-right: 2rem;
    margin-bottom: 2rem;
  }

  [id=portfolio] .project-4 {
    width: 45.8rem;
    height: 31.6rem;
  }

  [id=portfolio] .project-5 {
    width: 38rem;
    height: 26.2rem;
  }

  [id=portfolio] .project-5 {
    position: relative;
    top: -10.5rem;
    left: 28rem;
  }

  [id=portfolio] .project-row {
    justify-content: center;
    align-items: flex-end;
  }

  [id=portfolio] .project-row-2 {
    align-items: flex-start;
    flex-flow: row wrap;
  }
}

.green-dot {
  display: inline-block;
  border-radius: 100%;
  width: 12px;
  height: 12px;
  border: 2px solid #555570;
  background: #defa6d;
  -webkit-transform: translateY(1px);
          transform: translateY(1px);
  margin-right: 6px;
}

#client-logos {
  padding: 2rem 0;
  background: #00144a;
}

#client-logos .label {
  text-transform: uppercase;
  font-weight: bold;
  letter-spacing: 0.23rem;
  line-height: normal;
  font-size: 1.3rem;
  font-family: "gt-walsheim", Helvetica, Arial, sans-serif;
  color: white;
  margin-top: 2rem;
}

#client-logos .scrolling-logos-container {
  overflow: hidden;
}

#client-logos .scrolling-logos-inner {
  display: flex;
}

#client-logos .scrolling-logos-inner > div {
  -webkit-animation: scroll-left 30s linear infinite;
          animation: scroll-left 30s linear infinite;
}

#client-logos .scrolling-logos {
  display: flex;
  align-items: center;
  padding-bottom: 12rem;
  background: #00144a;
  padding: 2rem 0;
}

#client-logos .scrolling-logos .logo {
  flex: 1;
  max-width: 160px;
  max-height: 45px;
  margin-right: 10rem;
}

#client-logos .scrolling-logos img {
  max-width: 160px;
  height: auto;
  -o-object-fit: contain;
     object-fit: contain;
}

@-webkit-keyframes scroll-left {
  0% {
    -webkit-transform: translateX(0%);
            transform: translateX(0%);
  }

  100% {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
  }
}

@keyframes scroll-left {
  0% {
    -webkit-transform: translateX(0%);
            transform: translateX(0%);
  }

  100% {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
  }
}

.template-blog .hero {
  height: 25rem;
  font-size: 1.6rem;
}

@media screen and (min-width: 34.375em) {
  .template-blog .hero {
    font-size: 2rem;
  }
}

.template-post .article {
  padding-top: 5rem;
  padding-bottom: 5rem;
}

.template-post .article h1,
.template-post .article h2 {
  font-size: 3.2rem;
}

.template-post .article p {
  line-height: 1.7;
}

.template-post .article ul,
.template-post .article ol {
  padding: 1.5rem 0 3rem 3rem;
}

.template-post .article ul li,
.template-post .article ol li {
  margin: 0.5rem 0;
}

.template-post .article ul li {
  list-style-type: square;
  margin: 0.5rem 0 0 -0.5rem;
  padding-left: 0.5rem;
}

.template-post .article blockquote p {
  line-height: 1.4;
}

.template-post .article figure {
  margin: 6rem 0;
}

.template-post .article figure img {
  width: 100%;
  height: auto;
  box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.05);
  border-radius: 3px;
}

.template-post .article figure .credits {
  color: #C0C0CC;
}

.template-post .article figure .credits a {
  color: #C0C0CC;
  background-image: linear-gradient(#C0C0CC, #C0C0CC);
}

.template-post .article .responsive-video {
  margin: 6rem 0;
  box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.05);
  border-radius: 3px;
}

.template-post .article h2 + figure,
.template-post .article h3 + figure,
.template-post .article h4 + figure,
.template-post .article h2 + .responsive-video,
.template-post .article h3 + .responsive-video,
.template-post .article h4 + .responsive-video {
  margin: 3rem 0 6rem 0;
}

.template-post .article header figure .credits {
  color: white;
}

.template-post .article header figure .credits a {
  color: white;
  background-image: linear-gradient(white, white);
}

.template-post .article .insertion figure {
  margin: 3rem 0;
}

.template-post .article .insertion figure:last-child {
  margin: 3rem 0 0 0;
}

.template-post .article .inline-author {
  font-size: 1.3rem;
  font-family: "ibm-plex-mono", Menlo, Monaco, Consolas, "Courier New", monospace;
  color: #555570;
}

.template-post .checklist .list {
  display: flex;
  flex-direction: column;
  margin: 0;
  padding: 0;
  background-color: #fff;
  list-style: none;
  overflow: hidden;
}

.template-post .checklist .list .list-item {
  margin: 0 0 10px 0;
  padding: 0;
  position: relative;
}

.template-post .checklist .list .list-item:last-child {
  border: 0;
}

.template-post .checklist .hidden-box {
  position: absolute;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  opacity: 0;
}

.template-post .checklist .check--label {
  font-size: 2rem;
  border-radius: 3px;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: center;
}

.template-post .checklist .check--label-box {
  display: flex;
  flex-shrink: 0;
  align-self: start;
  position: relative;
  height: 24px;
  width: 24px;
  margin: 20px 15px 0 15px;
  border: 2px solid #00144a;
  border-radius: 50%;
  cursor: pointer;
}

.template-post .checklist .check--label-box:after {
  content: "";
  display: block;
  position: absolute;
  top: 3px;
  left: 7px;
  width: 6px;
  height: 12px;
  border: solid #5a7000;
  border-width: 0 2px 2px 0;
  -webkit-transform: rotate(25deg) scale(0.5);
          transform: rotate(25deg) scale(0.5);
  opacity: 0;
  transition: opacity 0.1s ease-out, -webkit-transform 0.2s ease-out;
  transition: transform 0.2s ease-out, opacity 0.1s ease-out;
  transition: transform 0.2s ease-out, opacity 0.1s ease-out, -webkit-transform 0.2s ease-out;
}

.template-post .checklist .check--label-container {
  padding: 20px 0;
}

.template-post .checklist .check--label-title {
  font-weight: bold;
  line-height: 1.2;
  margin: 0 0 5px 0;
}

.template-post .checklist .check--label-text {
  font-size: 1.3rem;
  font-family: "ibm-plex-mono", Menlo, Monaco, Consolas, "Courier New", monospace;
  line-height: 1.5;
  color: #555570;
}

.template-post .checklist .check--label-title,
.template-post .checklist .check--label-text {
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  display: flex;
  cursor: pointer;
  transition: color 0.1s ease-in-out;
}

.template-post .checklist .hidden-box:checked + .check--label {
  background-color: #F7F7FA;
}

.template-post .checklist .hidden-box:checked + .check--label .check--label-box {
  background-color: #defa6d;
  border: 2px solid #5a7000;
}

.template-post .checklist .hidden-box:checked + .check--label .check--label-box:after {
  opacity: 1;
  -webkit-transform: rotate(45deg) scale(1);
          transform: rotate(45deg) scale(1);
}

.template-post .checklist .hidden-box:checked + .check--label .check--label-text {
  color: #C0C0CC;
}

.template-post .checklist .hidden-box:checked + .check--label .check--label-title {
  color: #858499;
  text-decoration: line-through;
}

.template-post .checklist .hidden-box:checked + .check--label .check--label-title,
.template-post .checklist .hidden-box:checked + .check--label .check--label-text {
  transition: color 0.7s ease-out;
}

.template-post .responsive-video {
  position: relative;
  padding-bottom: 56.25%;
  padding-top: 0px;
  height: 0;
  overflow: hidden;
}

.template-post .responsive-video video,
.template-post .responsive-video iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.post-teasers {
  padding: 3rem 0 3rem 0;
}

@media screen and (min-width: 0) {
  .template-post .article header.hero h1 {
    font-size: 3rem;
  }
}

@media screen and (min-width: 34.375em) {
  .template-post .article header.hero h1 {
    font-size: 4rem;
  }

  .card--small {
    min-height: 490px;
  }
}

@media screen and (min-width: 48em) {
  .template-post .article header.hero h1 {
    font-size: 4.8rem;
  }
}

.template-home .post-teasers {
  padding: 6rem 0 0 0;
}

.template-home .post-teasers .card--small {
  min-height: auto;
}

.template-default main p,
.template-default main li {
  font-size: 1.6rem;
}

.error404 {
  padding: 15rem 0 5rem 0;
}

.error404 .error404__letters {
  font-size: 50vw;
  display: block;
  -webkit-text-stroke-width: 3px;
  color: transparent;
  line-height: 0;
  text-align: center;
  -webkit-font-feature-settings: "zero";
          font-feature-settings: "zero";
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.error404 .error404__letters--r {
  -webkit-text-stroke-color: #f00;
}

.error404 .error404__letters--g {
  -webkit-text-stroke-color: #0f0;
}

.error404 .error404__letters--b {
  -webkit-text-stroke-color: #00f;
}

@media screen and (min-width: 58.75em) {
  .error404 {
    padding: 10rem 0 5rem 0;
  }

  .error404 .error404__letters {
    font-size: 50rem;
  }
}

.template-error {
  overflow-x: hidden;
  overflow-y: scroll;
}

.template-error.error404--no1 .error404__letters {
  mix-blend-mode: difference;
}

.template-error.error404--no1 footer .container,
.template-error.error404--no1 h1 {
  -webkit-animation: error404 0.5s step-end infinite;
          animation: error404 0.5s step-end infinite;
}

.template-error.error404--no1 h1 {
  -webkit-animation-delay: 0.33s;
          animation-delay: 0.33s;
}

.template-error.error404--no1 .error404__letters--r {
  -webkit-transform: translateX(-1.5px);
          transform: translateX(-1.5px);
  -webkit-animation: error404_wiggle_r 0.5s step-end infinite;
          animation: error404_wiggle_r 0.5s step-end infinite;
}

.template-error.error404--no1 .error404__letters--g {
  -webkit-animation: error404_wiggle_g 0.5s step-end infinite;
          animation: error404_wiggle_g 0.5s step-end infinite;
  -webkit-animation-delay: -0.33s;
          animation-delay: -0.33s;
}

.template-error.error404--no1 .error404__letters--b {
  -webkit-transform: translateX(1.5px);
          transform: translateX(1.5px);
  -webkit-animation: error404_wiggle_b 0.5s step-end infinite;
          animation: error404_wiggle_b 0.5s step-end infinite;
  -webkit-animation-delay: -0.16s;
          animation-delay: -0.16s;
}

.template-error.error404--no2 .error404__letters {
  font-family: "vesterbro", serif;
  -webkit-text-stroke-width: 1px;
  z-index: 0;
}

.template-error.error404--no2 .error404__letters--r,
.template-error.error404--no2 .error404__letters--g,
.template-error.error404--no2 .error404__letters--b {
  opacity: 0;
  -webkit-animation: error404_zoom 5s cubic-bezier(0.53, 0, 0.99, 0.59) 0s infinite;
          animation: error404_zoom 5s cubic-bezier(0.53, 0, 0.99, 0.59) 0s infinite;
  -webkit-text-stroke-color: #fa6d6f;
  will-change: transform;
}

.template-error.error404--no2 .error404__letters--g {
  -webkit-animation-delay: 0.5s;
          animation-delay: 0.5s;
}

.template-error.error404--no2 .error404__letters--b {
  -webkit-animation-delay: 1s;
          animation-delay: 1s;
}

.template-jobs .icon {
  width: 5rem;
  height: 5rem;
}

.template-job .job-icon {
  width: 8rem;
}

.template-job main ul {
  margin-left: 2rem;
}

.project main {
  padding-top: 0;
}

.project main figure {
  margin: 3rem 0;
}

.project main figure img {
  display: block;
  max-width: 100%;
  height: auto;
  box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.05);
  border-radius: 3px;
}

.project main figure.phone {
  display: flex;
  justify-content: center;
  background: #555570;
  box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.05);
  border-radius: 3px;
}

.project main figure.phone img {
  width: 30%;
  height: 30%;
  min-width: 16rem;
  margin: 3rem 0;
  border-radius: 8px;
}

.project main video {
  margin: 3rem 0;
  width: 100%;
  box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.05);
  border-radius: 3px;
}

.project main figure + video,
.project main video + figure {
  margin-top: 0;
}

.project main p {
  line-height: 1.7;
}

.project main article {
  margin-top: -25rem;
}

.project main article header {
  color: white;
  text-shadow: 0 0 15px #00144a;
}

.project main article header + figure,
.project main article header + video {
  margin-top: 3rem;
}

.project aside {
  position: sticky;
  top: 75px;
}

.project aside dl {
  color: #555570;
  margin-bottom: 3rem;
}

.project aside dl dt {
  text-transform: uppercase;
  font-weight: bold;
  letter-spacing: 0.23rem;
  font-size: 1.3rem;
  display: block;
}

.project aside dl dd {
  font-size: 1.6rem;
}

.project aside dl a {
  color: #555570;
  background-image: linear-gradient(#555570, #555570);
}

.project aside dl:last-of-type {
  margin-bottom: 0;
}

.project aside dl + .btn--url {
  margin-top: 3rem;
}

@media screen and (min-width: 0) {
  .project h1 {
    font-size: 3rem;
  }
}

@media screen and (min-width: 34.375em) {
  .project h1 {
    font-size: 4rem;
  }

  .project main figure,
  .project main video {
    margin: 6rem 0;
  }

  .project article {
    margin-top: -30rem;
  }

  .project article header {
    height: 10rem;
  }
}

@media screen and (min-width: 48em) {
  .project h1 {
    font-size: 4.8rem;
  }

  .project main figure:last-of-type {
    margin-bottom: 0;
  }

  .project article {
    margin-top: -35.5rem;
  }

  .project article header {
    height: 13rem;
  }
}

.card--project {
  display: flex;
  overflow: hidden;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 33rem;
  background-color: #555570;
  border-radius: 3px;
  box-shadow: 0px 4px 12px 0px rgba(0, 20, 74, 0.15);
  margin-bottom: 3rem;
  padding: 3rem;
}

.card--project video,
.card--project figure {
  max-width: 75%;
  box-shadow: 0px 4px 12px 0px rgba(0, 20, 74, 0.15);
  position: absolute;
  transition: box-shadow 0.7s ease-out, -webkit-transform 0.7s ease-out, -webkit-filter 0.7s ease-out;
  transition: transform 0.7s ease-out, box-shadow 0.7s ease-out, filter 0.7s ease-out;
  transition: transform 0.7s ease-out, box-shadow 0.7s ease-out, filter 0.7s ease-out, -webkit-transform 0.7s ease-out, -webkit-filter 0.7s ease-out;
  border-radius: 3px;
}

.card--project.card--smartphone figure {
  width: 30%;
}

.card--project.card--highlight.card--smartphone figure {
  width: 50%;
  max-width: 375px;
}

.card--project.card--highlight {
  height: 50vw;
}

.card--project.card--highlight figure {
  width: 90%;
  max-width: 90%;
}

@media screen and (min-width: 34.375em) {
  .card--project.card--highlight {
    height: 40vw;
    min-height: 320px;
    max-height: 450px;
  }
}

.card--project.multiple figure:nth-of-type(1) {
  -webkit-transform: translate(-20px, 20px);
          transform: translate(-20px, 20px);
  z-index: 100;
}

.card--project.multiple figure:nth-of-type(2) {
  -webkit-transform: translate(20px, -20px);
          transform: translate(20px, -20px);
  z-index: 99;
}

.card--project.card--highlight figure {
  -webkit-transform: translate(0, 10vw) scale(1);
          transform: translate(0, 10vw) scale(1);
}

.card--project.card--highlight.card--smartphone figure {
  -webkit-transform: translate(0, 25vw) scale(1);
          transform: translate(0, 25vw) scale(1);
}

@media screen and (min-width: 48em) {
  .card--project.card--highlight.card--smartphone figure {
    -webkit-transform: translate(0, 20rem) scale(1);
            transform: translate(0, 20rem) scale(1);
  }
}

.card--project:hover video,
.card--project:hover figure,
.card--project:focus video,
.card--project:focus figure {
  transition: box-shadow 0.7s ease-out, -webkit-transform 0.3s ease-out, -webkit-filter 0.3s ease-out;
  transition: transform 0.3s ease-out, box-shadow 0.7s ease-out, filter 0.3s ease-out;
  transition: transform 0.3s ease-out, box-shadow 0.7s ease-out, filter 0.3s ease-out, -webkit-transform 0.3s ease-out, -webkit-filter 0.3s ease-out;
  -webkit-transform: translate(0px, -5px);
          transform: translate(0px, -5px);
  box-shadow: 0px 10px 40px 0 rgba(0, 20, 74, 0.3);
}

.card--project:hover.multiple figure:nth-of-type(1),
.card--project:focus.multiple figure:nth-of-type(1) {
  -webkit-transform: translate(-20px, 20px) scale(1.05);
          transform: translate(-20px, 20px) scale(1.05);
}

.card--project:hover.multiple figure:nth-of-type(2),
.card--project:focus.multiple figure:nth-of-type(2) {
  -webkit-transform: translate(30px, -25px) scale(0.95);
          transform: translate(30px, -25px) scale(0.95);
  -webkit-filter: blur(6px);
          filter: blur(6px);
  transition: box-shadow 0.3s ease-out, -webkit-transform 0.3s ease-out, -webkit-filter 0.3s ease-out;
  transition: transform 0.3s ease-out, box-shadow 0.3s ease-out, filter 0.3s ease-out;
  transition: transform 0.3s ease-out, box-shadow 0.3s ease-out, filter 0.3s ease-out, -webkit-transform 0.3s ease-out, -webkit-filter 0.3s ease-out;
}

.card--project:hover.card--highlight figure,
.card--project:focus.card--highlight figure {
  transition: box-shadow 0.3s ease-out, -webkit-transform 3s ease-out, -webkit-filter 0.3s ease-out;
  transition: transform 3s ease-out, box-shadow 0.3s ease-out, filter 0.3s ease-out;
  transition: transform 3s ease-out, box-shadow 0.3s ease-out, filter 0.3s ease-out, -webkit-transform 3s ease-out, -webkit-filter 0.3s ease-out;
  -webkit-transform: translate(0, -10vw) scale(1);
          transform: translate(0, -10vw) scale(1);
}

.card--project:hover figure img,
.card--project:focus figure img {
  -webkit-transform: scale(1);
          transform: scale(1);
}

.card--project:focus {
  background-color: #C0C0CC;
}

.card--project:active {
  background-color: #555570;
  border: none;
}