/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0;}main{display:block;}h1{font-size:2em;margin:.67em 0;}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace,monospace;font-size:1em;}a{background-color:transparent;}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted;}b,strong{font-weight:bolder;}code,kbd,samp{font-family:monospace,monospace;font-size:1em;}small{font-size:80%;}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline;}sub{bottom:-.25em;}sup{top:-.5em;}img{border-style:none;}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible;}button,select{text-transform:none;}button,[type="button"],[type="reset"],[type="submit"]{-webkit-appearance:button;}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner{border-style:none;padding:0;}button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring{outline:1px dotted ButtonText;}fieldset{padding:.35em .75em .625em;}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline;}textarea{overflow:auto;}[type="checkbox"],[type="radio"]{box-sizing:border-box;padding:0;}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto;}[type="search"]{-webkit-appearance:textfield;outline-offset:-2px;}[type="search"]::-webkit-search-decoration{-webkit-appearance:none;}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block;}summary{display:list-item;}template{display:none;}[hidden]{display:none;}
p, ul, ol, li, h1, h2, h3, h4, h5 {margin: 0; padding: 0;}
@font-face {
    font-family: 'NeueMachina';
    src: url('/css/font/NeueMachina-Regular.eot');
    src: url('/css/font/NeueMachina-Regular.eot?#iefix') format('embedded-opentype'),
        url('/css/font/NeueMachina-Regular.woff2') format('woff2'),
        url('/css/font/NeueMachina-Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: 'NeueMachina';
    src: url('/css/font/NeueMachina-Bold.eot');
    src: url('/css/font/NeueMachina-Bold.eot?#iefix') format('embedded-opentype'),
        url('/css/font/NeueMachina-Bold.woff2') format('woff2'),
        url('/css/font/NeueMachina-Bold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
}
@font-face {
    font-family: 'NeueMachina';
    src: url('/css/font/NeueMachina-Black.eot');
    src: url('/css/font/NeueMachina-Black.eot?#iefix') format('embedded-opentype'),
        url('/css/font/NeueMachina-Black.woff2') format('woff2'),
        url('/css/font/NeueMachina-Black.woff') format('woff');
    font-weight: 900;
    font-style: normal;
}
body {font-family: 'NeueMachina', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;}
h1, h2, h3, h4, h5 {
    font-weight: 900;
    line-height: 1em;
}
h1, h2 {
    font-size: max(3.2em, 6vw);
    font-size: -moz-max(3.2em, 6vw);
}
body.light-ux h1 {
    color: #FFF;
}
body.light-ux .dark-ux h1 {
    color: #000;
}
/* h2 {
    font-size: max(2.4em, 4vw);
    font-size: -moz-max(2.4em, 4vw);
} */
h3 {
    font-size: max(1.6em, 2.8vw);
    font-size: -moz-max(1.6em, 2.8vw);
}
h4 {
    font-size: max(0.9em, 1.2vw);
    font-size: -moz-max(0.9em, 1.2vw);
    text-transform: uppercase;
}
ul, li, p {
    font-size: max(1.4em, 1.68vw);
    font-size: -moz-max(1.4em, 1.68vw);
    line-height: 1.2em;
}
.dg.ac ul, .dg.ac li {
    font-size: 1em !important;
} 
p.small {
    font-size: max(1em, 1.2vw);
    font-size: -moz-max(1em, 1.2vw);
    letter-spacing: .05em;
    line-height: 1.2em;
}
a {
    color: inherit;
}
.hidden {
    display: none; visibility: hidden; overflow: hidden; width: 0; height: 0;
}
.main-canvas {
    position: fixed; top: 0; left: 0;
}
/* Section */
.section {
    color: initial;
    height: calc(100vh - 24px);
    height: -webkit-calc(100vh - 24px);
    height: -moz-calc(100vh - 24px);
    min-height: 460px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    margin: 12px;
    flex: 1 1 0px;
    position: relative;
}
.section.link {
    cursor: pointer;
}
.section .content {
    margin: 0 16px;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.section.compensation-top .content {
    margin-top: 48px;
}
.section .text {
    margin-top: max(24px, 2vw);
    margin-top: -moz-max(24px, 2vw);
    max-width: max(600px, 40vw);
    max-width: -moz-max(600px, 40vw);
}
.section .navigation {
    margin-top: 48px;
    flex-direction: column;
}
.section .navigation.forward {
    margin-top: 16px;
}
.section .backdrop {
    background-size: cover;
    background-position: center;
    width: 100%; height: 100%;
    position: absolute;
    z-index: -1;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
}
.section .backdrop video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.section .backdrop.tiles {
    z-index: unset;
}
.section .backdrop .tile {
    display: block;
    width: 50%;
    height: 33.3333%;
    background-size: inherit;
    background-position: inherit;
  }
.section.compact {
    height: calc(50vh - 24px);
    height: -webkit-calc(50vh - 24px);
    height: -moz-calc(50vh - 24px);
    min-height: unset;
}
.section.fit {
    height: auto;
    min-height: auto;
    padding-top: 96px;
    padding-bottom: 96px;
    display: block;
}
.section.fit.row-first {
}
.section.fit.row-next {
    padding-top: 0;
}
.section.left .content{
    text-align: left;
    align-items: flex-start;
}
.section.light {
    color: white;
}
.modal-wrapper {
    position: fixed; top: 0; bottom: 0; left: 0; right: 0; z-index: 2;
}
/* Thumbnails */
.section.thumbnail {
    align-items: stretch;
}
.section.thumbnail .content {
    padding: 24px;
    display: block;
    box-sizing: border-box;
}
.section.thumbnail img {
    height: 100%;
    width: 100%;
    object-fit: contain;
    display: block;
}
.section.image .content {
    margin: 0;
    display: block;
    width: 100%;
    height: 100%;
}
.section.image img, .section.basic-card .image img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    display: block;
}
.section.basic-card {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}
.section.basic-card .content {
    flex-grow: 1;
}
.section.basic-card p.small {
    flex-grow: 2;
    margin-top: max(16px, 1vw);
    margin-top: -moz-max(16px, 1vw);
    margin-bottom: max(16px, 1vw);
    margin-bottom: -moz-max(16px, 1vw);
  }
.section.basic-card .image {
    background-color: #E2E2E2;
    margin-bottom: 24px;
}
@media only screen and (max-width: 767px) {
    .section.thumbnail, .section.image, .section.basic-card {
        height: unset;
        min-height: auto;
    }
    .section.image img, .section.basic-card .image img {
        width: 100%;
        height: auto;
        object-fit: unset;
        display: block;
    }
}
@media only screen and (max-width: 1023px) {
    .section-group.merge-cells {
        height: calc(100vh - 24px);
        height: -webkit-calc(100vh - 24px);
        height: -moz-calc(100vh - 24px);
        display: flex;
        flex-direction: column;
        margin-bottom: 12px;
    }
    .section-group.merge-cells .section {
        height: unset;
        min-height: auto;
        margin-top: 0;
        margin-bottom: 0;
    }
}
@media only screen and (min-width: 416px) {
    .section .navigation {
        flex-direction: initial;
    }
}
@media only screen and (min-width: 769px) {
    .section-group {
        display: flex;
        margin: 16px 8px;
        flex-wrap: wrap;
    }
    .section {
        margin: 16px;
        height: calc(100vh - 32px);
        height: -webkit-calc(100vh - 32px);
        height: -moz-calc(100vh - 32px);
        margin: 0 8px;
    }
    .section.thumbnail .content {
        padding: 48px;
    }
    .section.fit.header, .section.fit.divider {
        width: 100%;
        flex-grow: 0;
        flex-basis: auto;
    }
    .section.basic-card .image {
        height: 21vw;
        margin-bottom: 48px;
    }
    #press, #featured, #in-use {
        padding: 96px 0;
    }
}

/* Buttons */
.button-group {
    display: flex;
    justify-content: center;
}
.button-group .button {
    margin: 0 4px;
}
.button {
    pointer-events: all;
    display: inline-flex;
    /* font-size: max(1em, 1.2vw);
    font-size: -moz-max(1em, 1.2vw); */
    font-size: 1em;
    font-weight: 600;
    letter-spacing: .05em;
    line-height: 1em;
    text-decoration: none;
    padding: 12px 16px;
    color: black;
    stroke: black;
    background-color: #E0E0E0;
    cursor: pointer;
    flex-direction: column;
    align-items: center;
}
.button.glyph-button {
    padding: 10px;
}
.button.glyph-button svg {
    display: block;
    overflow: visible;
    width: 28px; height: 28px;
}
.button.label-button svg {
    margin-top: 10px;
}
.button.link-button {
    padding-left: 0;
    padding-right: 0;
}
body.light-ux .button.no-navbar-button, .light .button {
    color: white;
    stroke: white;
}
.light .button {
    background-color: #707070;
}
.button.fancy {
    padding: 18px 32px;
    border-radius: 32px;
}
.button.primary {
    color: white;
    stroke: white;
    background-color: black;
}
body.light-ux .button.no-navbar-button.primary, .light .button.primary, body.light-ux .button.primary {
    color: black;
    stroke: black;
    background-color: white;
}
.button.secondary {
    background-color: transparent;
}
.light .button.secondary, body.light-ux .button.secondary {
    color: white;
}
body.light-ux .dark-ux .button.secondary {
    color: black;
}

/* Nav Bar */
.navbar {
    top: 0; left: 0; right: 0;
    display: flex;
    z-index: 100;
    flex-direction: row;
    padding: 24px 24px 12px;
    position: fixed;
    background-color: #FFF;
}
.navbar .navbar-section {
    flex-grow: 1;
    display: flex;
}
.navbar .navbar-section .dummy {
    width: 48px; height: 48px;
}
.navbar .center {
    justify-content: center;
    transition: all .1s ease-out .35s;
}
.navbar .center .userpic {
    display: block;
    width: 28px; height: 28px;
}
.navbar .right {
    justify-content: flex-end;
}
.navbar .left {
    transition: all .1s ease-out .35s;
}
.button.no-navbar-button {
    position: fixed; z-index: 1;
    top: 24px; left: 24px;
}
.button.no-navbar-button.right {
    left: unset;
    right: 24px;
}
.navbar.modal {
    position: fixed;
}
.navbar.modal .center {
    visibility: hidden;
    opacity: 0;
    transition: all .1s ease-in;
}
.navbar.modal .left {
    visibility: hidden;
    opacity: 0;
    transition: all .1s ease-in;
}
@media only screen and (min-width: 769px) {
    .navbar {
        padding: 32px 32px 16px;
    }
    .button.no-navbar-button {
        top: 32px; left: 32px;
    }
    .button.no-navbar-button.right {
        right: 32px;
    }
}

/* Hamburger Toggle */
.modal-wrapper {
    position: fixed;
    top: 0;
    background-color: white;
    color: #000;
    z-index: 99;
    width: 100%; height: 100%;
    transition: top .15s ease-out;
}
.modal-wrapper.invisible {
    top: -100%;
    width: 100%; overflow: hidden;
    transition: top .1s ease-in .2s;
}
.modal-wrapper .content {
    transition: opacity .15s ease-out .15s;
}
.modal-wrapper.invisible .content {
    opacity: 0;
    transition: opacity .2s ease-in;
}
.modal-content .section {
    background-color: white;
}
.hamburger-toggle {
    width: 28px; height: 28px;
    position: relative;
    overflow: hidden;
}
.hamburger-toggle .line {
    height: 2px; width: 28px;
    background-color: black;
    position: absolute;
    transform-origin: center;
    z-index: 1000;
}
.hamburger-toggle .line.l0 {
    top: 5px; left: 0; transition: left .12s ease-out .2s;
}
.hamburger-toggle .line.l1 {
    top: 13px; left: 0; transition: left .12s ease-out .25s;
}
.hamburger-toggle .line.l2 {
    top: 21px; left: 0; transition: left .12s ease-out .3s;
}
.hamburger-toggle.toggled .line.l0 {
    left: 28px; transition: left .12s ease-in 0s;
}
.hamburger-toggle.toggled .line.l1 {
    left: -28px; transition: left .12s ease-in 0.05s;
}
.hamburger-toggle.toggled .line.l2 {
    left: 28px; transition: left .12s ease-in 0.1s;
}
.hamburger-toggle .line.diagonal {
    width: 38px;
}
.hamburger-toggle .line.diagonal.l3 {
    top: -15px; left: 23px; transition: left .1s ease-in 0s, top .1s ease-in 0s;
    transform: rotateZ(-45deg);
}
.hamburger-toggle .line.diagonal.l4 {
    top: -15px; left: -32px; transition: left .1s ease-in .1s, top .1s ease-in .1s;
    transform: rotateZ(45deg);
}
.hamburger-toggle.toggled .line.diagonal.l3 {
    top: 13px; left: -5px; transition: left .1s ease-out .2s, top .1s ease-out .2s;
}
.hamburger-toggle.toggled .line.diagonal.l4 {
    top: 13px; left: -5px; transition: left .1s ease-out .3s, top .1s ease-out .3s;
}
/* Float Gallery */
.float-gallery {
    height: auto;
    min-height: auto;
    display: block;
}
.float-gallery picture {
    display: block;
    margin-bottom: 12px;
}
.float-gallery img {
    width: 100%;
    display: block;
}
.float-gallery img.pixel-art {
    image-rendering: auto;
    image-rendering: crisp-edges;
    image-rendering: pixelated;
    display: inline;
    object-position: center;
}
@media only screen and (min-width: 769px) {
    .float-gallery picture {
        position: absolute;
        padding-bottom: 16px;
        top: 0; left: 0;
    }
    .float-gallery.static picture {
        position: static !important;
    }
    .float-gallery img {
        max-width: 100%;
    }
}
#ghost-title-container {
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 1;
    position: fixed;
    padding: 28px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    text-align: center;
    transition-property: opacity;
    transition-duration: 4s;
}
#ghost-title-container.disappearing {
    opacity: 0.0;
}
@media only screen and (min-width: 769px) {
    #ghost-title-container {
        padding: 32px;
    }
}
.toolbar {
    position: fixed;
    bottom: 24px;
    width: 100%;
    padding: 24px;
    pointer-events: none;
    box-sizing: border-box;
    z-index: 1;
    display: flex;
    justify-content: center;
}
@media only screen and (min-width: 769px) {
    .toolbar {
        padding: 32px;
        bottom: 32px;
    }
}
