#nav {
  position: relative;
  z-index: 1;
  transition: all 400ms ease; }
  #nav #logo img {
    transition: all 400ms ease; }
  #nav nav ul {
    list-style: none;
    padding: 0;
    line-height: 1.5; }
    #nav nav ul a {
      color: #eae4da;
      font-size: 16px;
      font-weight: 500;
      padding: 10px; }
      #nav nav ul a.active, #nav nav ul a:hover {
        color: #ffbc02; }
    #nav nav ul.secondary {
      text-transform: uppercase; }
      #nav nav ul.secondary a {
        font-size: 14px; }
  @media (min-width: 900px) {
    #nav {
      height: 110px;
      padding: 24px 112px;
      display: flex;
      justify-content: space-between;
      align-items: flex-end; }
      #nav .hamburger {
        display: none; }
      #nav nav {
        position: absolute;
        right: 112px;
        top: 56px;
        padding-left: calc(128px + 10.5263157895%);
        text-align: right; }
        #nav nav ul li {
          display: inline-block; } }
  @media (max-width: 899px) {
    #nav {
      padding: 16px calc(10px + 5.263157895%); }
      #nav #logo img {
        width: 112px; }
      #nav nav {
        transition-duration: 0ms;
        height: 0;
        overflow: hidden;
        position: fixed;
        z-index: 1;
        top: -32px;
        left: 0;
        right: 0;
        background: #3D3741; }
        #nav nav ul {
          margin: 12px 0; }
          #nav nav ul a {
            font-size: 22px;
            display: block;
            width: 200px;
            margin: 0 0 0 5.263157895%;
            white-space: nowrap; }
          #nav nav ul.secondary a {
            padding: 4px 10px; }
        #nav nav.open {
          height: calc(100vh - 20px);
          transition: height 200ms ease-in;
          top: 55px; }
      #nav .hamburger {
        display: block;
        cursor: pointer;
        position: absolute;
        top: 4px;
        right: 5.263157895%;
        width: 48px;
        height: 48px;
        transition: all 0.25s; }
      #nav .hamburger__top-bun,
      #nav .hamburger__bottom-bun {
        content: '';
        display: block;
        position: absolute;
        left: 15px;
        width: 18px;
        height: 2px;
        background: #eae4da;
        transform: rotate(0);
        transition: all 0.25s; }
      #nav .hamburger:hover [class*="-bun"] {
        background: #AAA; }
      #nav .hamburger__top-bun {
        top: 23px;
        transform: translateY(-3px); }
      #nav .hamburger__bottom-bun {
        bottom: 23px;
        transform: translateY(3px); }
      #nav .hamburger.open {
        transform: rotate(90deg); }
      #nav .hamburger.open .hamburger__top-bun {
        transform: rotate(45deg) translateY(0px); }
      #nav .hamburger.open .hamburger__bottom-bun {
        transform: rotate(-45deg) translateY(0px); } }

footer {
  clear: both;
  padding: 20px 10.5263157895% 70px;
  border-top: 1px solid #3D3741;
  color: #BEBDAB;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 16px;
  font-weight: 500; }
  footer small span {
    display: block; }
  footer li {
    display: inline; }
  footer a {
    display: inline-block; }
  footer ul {
    display: flex;
    padding: 12px 0; }
  footer .s0cial-links {
    /* so the links don't get hidden by aggressive adblocking */
    margin-left: 36px; }
    footer .s0cial-links a {
      margin: 0 6px;
      width: 32px;
      height: 32px;
      opacity: 0.7;
      transition: opacity ease 400ms; }
      footer .s0cial-links a:hover {
        opacity: 1; }

@media (max-width: 768px) {
  footer {
    display: block;
    text-align: center; }
    footer small {
      display: block;
      margin: 16px 10%; }
    footer ul {
      justify-content: center; }
    footer .s0cial-links {
      /* so the links don't get hidden by aggressive adblocking */
      margin-left: 0; } }

.hero {
  background-color: #463C47;
  height: 580px;
  position: relative; }
  .hero svg, .hero iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: none; }
  @media (max-width: 768px) {
    .hero {
      height: 70vh; } }

section.section-with-header {
  margin: 94px 0 120px;
  overflow: hidden; }
  section.section-with-header .glyph {
    display: block;
    margin: 0 auto -35px;
    max-width: 275px; }
  section.section-with-header header {
    position: relative;
    margin-bottom: 47px;
    background: #252127;
    width: 50%;
    padding: 24px 2.653508772% 33px 21.228070176%;
    line-height: 1;
    color: #eae4da; }
    section.section-with-header header a {
      color: inherit;
      font-size: inherit; }
    section.section-with-header header .subheading {
      margin: 0; }
  section.section-with-header ul,
  section.section-with-header p,
  section.section-with-header h3 {
    margin: 0 21.228070176% 2rem; }
  section.section-with-header h3 {
    margin-bottom: 0; }
  @media (max-width: 768px) {
    section.section-with-header {
      margin-top: 0; }
      section.section-with-header header {
        width: auto;
        float: none !important; } }

@font-face {
  font-family: dinmit;
  src: url("/styles/webfonts/dinmittelschrift.woff") format("woff");
  font-weight: 400;
  font-style: normal; }

* {
  margin: 0;
  padding: 0; }

img {
  border: none;
  vertical-align: middle; }

html {
  box-sizing: border-box;
  background-color: #0A0A0A;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  font-smoothing: antialiased; }

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

body {
  font-family: dinmit, sans-serif;
  font-size: 17px;
  line-height: 1.471;
  max-width: 1400px;
  margin: auto;
  -webkit-font-smoothing: antialiased;
  color: #BEBDAB;
  background: #3D3741; }

h1, h2, h3, h4, h5, h6 {
  color: #eae4da; }

h1 {
  font-size: 45px;
  line-height: 54px; }

h2 {
  font-size: 26px;
  line-height: 1.285714286; }
  @media (max-width: 768px) {
    h2 {
      font-size: 22px; } }

h3 {
  font-size: 17px;
  line-height: 27px;
  text-transform: uppercase; }

p + h3,
p + h4 {
  margin: 2em 0 1em; }

h4 {
  font-size: 13px;
  font-weight: 500;
  text-transform: uppercase; }
  h4 abbr {
    text-transform: none; }

ul, ol {
  list-style: square;
  padding: 0 0 1em 1.5em; }
  ul li, ol li {
    margin-bottom: 8px; }
  ul ul, ul ol, ol ul, ol ol {
    font-size: 80%; }

.subheading {
  text-transform: uppercase;
  font-weight: 500;
  font-size: 13px;
  margin: 0 21.228070176%; }

p {
  margin: 12px 0; }

a {
  text-decoration: inherit;
  color: #ffbc02; }

section {
  clear: both; }

.grey {
  background-color: #3D3741; }

.divider-top {
  border-top: 2px solid #3D3741; }

.divider-bottom {
  border-bottom: 2px solid #3D3741; }

html.noscroll,
html.noscroll body {
  height: 100%;
  overflow: hidden; }

@media (min-width: 900px) {
  #logo {
    position: absolute;
    top: 52px; } }

.big-labels {
  padding: 75px 0 120px 0; }
  .big-labels div + div {
    margin-top: 60px; }
  .big-labels div:after {
    content: "";
    display: table;
    clear: both; }
  .big-labels h2 {
    float: left;
    clear: both;
    width: 29.7368421053%;
    margin-left: 10.5263157895%;
    padding: 0;
    text-align: right; }
  .big-labels p, .big-labels ul, .big-labels ol {
    float: right;
    width: 40.2631578947%;
    margin: 0 16.2280701754% 0.5em 0;
    padding-top: 0.3em; }
  .big-labels img {
    display: block;
    margin-top: 24px;
    width: 61.803398875%;
    border-radius: 8px;
    object-fit: cover; }

@media (max-width: 768px) {
  .big-labels div + div {
    margin-top: 21px; }
  .big-labels h2, .big-labels p, .big-labels ul, .big-labels ol {
    float: none;
    width: auto;
    padding: 0;
    margin-left: 10%;
    margin-right: 10%;
    text-align: left; } }

.cool-header {
  text-align: center;
  padding: 90px 32px 70px;
  color: #eae4da;
  background: #463C47;
  letter-spacing: 0.5px; }
  .cool-header .subheading {
    display: block;
    padding-top: 18px; }

.hero + .big-labels {
  padding-top: 24px; }

.blog-post aside {
  float: left;
  clear: both;
  width: 14.868421053%;
  margin-left: 10.5263157895%;
  text-align: right; }
  .blog-post aside h2, .blog-post aside ol {
    font-size: 17px;
    line-height: 1.5882352941;
    clear: both; }
    .blog-post aside h2 li, .blog-post aside ol li {
      float: right;
      clear: right; }

.blog-post article {
  float: right;
  width: 55.1315789477%;
  margin: 0 16.2280701754% 0.5em 0;
  padding-bottom: 120px; }
  .blog-post article p {
    margin-top: 0; }
  .blog-post article figure {
    display: flex;
    margin-bottom: 24px; }
    .blog-post article figure img {
      margin-right: 12px;
      min-width: 0; }
    @media (max-width: 640px) {
      .blog-post article figure {
        display: block; } }
  .blog-post article .video-container {
    margin: 24px 12px 24px 0;
    padding-bottom: 62.5%;
    height: 0;
    position: relative; }
    .blog-post article .video-container iframe {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%; }

.blog-post img {
  display: block;
  margin-top: 24px;
  width: calc(100% - 12px);
  border-radius: 8px;
  object-fit: cover; }

@media (max-width: 768px) {
  .blog-post aside, .blog-post article {
    float: none;
    width: auto;
    margin-left: 10%;
    margin-right: 10%;
    text-align: left; }
    .blog-post aside ol li, .blog-post article ol li {
      float: none; } }
