@font-face {
    font-family: RetinaaBeta;
    font-weight: normal;
    src: url("../fonts/Retinaa-Regular.woff2") format("woff2"),
       url("../fonts/Retinaa-Regular.woff") format("woff"),
       url("../fonts/Retinaa-Regular.otf") format("opentype"),
       url("../fonts/Retinaa-Regular.ttf") format("truetype");
}

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	vertical-align: baseline;
    line-height: 140%;
    letter-spacing: 0.01em;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

html {
    font-size: 1vw;
}

:root {
    --color-background: #000;
}

body {
    background: var(--color-background);   
    font-family: RetinaaBeta, monospace;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

body.no-animate .slides {
    transition-duration: 0s !important;
}

::-moz-selection { /* Code for Firefox */
color: black;
background: white;
}

::selection {
    color: black;
    background: white;
}

[data-scroll="false"] {
    position: relative;
    overflow: hidden;
    height: 100vh;
}

body,
input,
button,
textarea {
    font-size: 2.2rem;
    border-radius: 0;
}

input,
button,
textarea {
    background: white;
    border: none;
    appearance: none;
}

input:focus {
    outline: none;
}

button {
    font-size: 12px;
}

input::placeholder {
    color: black;
}

input:focus::placeholder {
    color: rgba(0,0,0,0.1);
}

body[data-case-study-open="true"] {
    position:relative;
    overflow: hidden;
}

a {
    color: currentColor;
    text-decoration: none;
}

* {
    -webkit-tap-highlight-color: rgba(0,0,0,0.5);
}

.intro-text {
    position: absolute;
    z-index: 20;
    visibility: hidden;
    top: 0;
    height: 25vh;
}

.text-container {
    box-sizing: border-box;
    width: 90vw;
    margin: auto;
}

.text-container a {
    text-decoration: underline;
}
.text-container a:hover {
    text-decoration: none;
}

.slide-txt.text-container a {
    position: relative;
    z-index: 20;
}

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

.text-wrapper {
    width: 100%;
}

.text-wrapper.text-small {
    margin-top: 6rem;
    font-size: 13px;
    line-height: 1.3em;
    max-width: 1000px;
}

.client-logos {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 2rem;
}

.client-logos img {
    width: auto;
    height: auto;
    max-height: 4em;
    max-width: 100%;
    box-sizing: border-box;
}

.terminal-sticky-container {
    position: relative;
}

.terminal-holder {
    position: sticky;
    top: 50vh;
    top: calc(50vh - 18px);
    z-index: 150;
    /* height: 35px; */
    pointer-events: none;
}

.terminal {
    display: flex;
    font-size: 11.5px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    position: relative;
    height: 35px;
    line-height: 35px;
    left: 5vw;
    width: 90vw;
    top: 50%;
    margin-top: -17.5px;
    opacity: 1;
    z-index: 100;
    pointer-events: auto;
    overflow-x: hidden;
    color: white;
}

.terminal-section {
    position: relative;
    background: rgba(255,255,255,0.25);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    width: 45vw;
    display: flex;
    width: calc(50% - 1px);
}

.terminal-section .terminal-btn {
    width: 100%;
    text-align: center;
}

.terminal a,
.terminal div {
    line-height: 35px;
}

body[data-terminal="false"][data-terminal="false"] .main-btn {
    opacity: 1;
    /* background: black;
    color: white; */
}

[data-fixed-terminal="true"] .terminal {
    /* position: fixed;
    top: 85px;
    transition: none; */
    visibility: visible;
}

body[data-case-study-open="true"] .terminal-holder {
    pointer-events: none;
}

body[data-log-overlay="true"] {
    overflow: hidden;
}

body[data-fixed-terminal="true"] .terminal-spacer {
    height: 17px;
}

body[data-info="true"] .terminal-btn.info-btn,
body[data-log="true"] .terminal-btn.log-btn {
    opacity: 1;
    background: rgba(255,255,255,0.25);
}

.terminal-btn {
    box-sizing: border-box;
    padding: 0 0.6em;
    text-align: center;
}

.terminal-btn.terminal-btn__nav {
    width: 100%;
    text-align: center;
}

.terminal .main-btn {
    /*background: #eeeeee;*/
}

.terminal-btn {
    position: relative;
    width: 72px;
    text-align: center;
    z-index: 100;
    box-sizing: border-box;
    min-width:  42px;
}

.terminal-btn svg,
.terminal-btn span {
    display: inline-block;
    margin: auto;
}

.no-touch .terminal-btn:hover {
    background: rgba(0,0,0,0.075);
}

.terminal-right {
    margin-left: auto;
    margin-right: 0;
    display: flex;
    min-width: 10%;
    transition: clip-path 0.33s ease;
    clip-path: inset(0 0 0 100%);
}

.terminal-right .terminal-btn {
    display: none;
    width: 72px;
}

body[data-log-overlay="true"] .terminal-right .close-btn {
    display: block;
    margin-left: auto;
}

.terminal-left {
    transition: clip-path 0.33s ease;
    clip-path: inset(0 66.66% 0 0);
}

body[data-terminal=true] .terminal-left {
    clip-path: inset(0 0 0 0);
}

body[data-case-study-open="true"] .terminal-left,
body[data-log-overlay="true"] .terminal-left {
    clip-path: inset(0 0 0 100%);
}
body[data-case-study-open="true"] .terminal-right {
    clip-path: inset(0 100% 0 0) !important;
}

.terminal .terminal-display {
    padding: 0 0.6em;
    cursor: default;
    background: transparent;
    /*min-width: 100%;*/
    text-align: center;
    width: 100%;
    transition: clip-path 0.5s ease;
}

.terminal .terminal-newsletter {
    position: absolute;
    height: 100%;
    display: block;
    width: 100%;
    opacity: 0;
    transition: opacity 0s;
    transition-delay: 0.5s;
    pointer-events: none;
}

.terminal .terminal-newsletter form {
    height: 100%;
    display: flex;
}

.terminal .terminal-newsletter input {
    box-sizing: border-box;
    height: 100%;
    line-height: 35px;
    padding: 0 0.6em;
    appearance: none;
    font-size: inherit;
    font-family: inherit;
    text-transform: inherit;
    width: 100%;
    text-align: center;
    background: none;
    background: white;
    color: black;
}

.terminal .terminal-newsletter input::placeholder {
    color: black;
}

.terminal .terminal-newsletter input:focus::placeholder {
    color: rgba(0,0,0,0.25);
}

.terminal .terminal-newsletter button {
    display: block;
    height: 100%;
    font-size: inherit;
    font-family: inherit;
    background: #00ff00 !important;
    color: black;
}

.terminal-newsletter button:hover {
    color: black;
}

.terminal .terminal-newsletter input:focus ~ button,
.terminal .terminal-newsletter button:hover {
    visibility: visible;
    cursor: pointer;
}

.terminal .terminal-display:hover {
    /* background: #f5f5f5; */
}

/* All instances to show terminal text display */
body[data-terminal="true"] .terminal[data-intro="true"] .terminal-right,
.terminal[data-case-study="true"] .terminal-right,
body[data-log-overlay="true"] .terminal-right,
body[data-info="true"] .terminal-right {
    clip-path: inset(0 0 0 0);
}

.terminal[data-case-study="true"] .terminal-display {
    opacity: 1;
    cursor: pointer;
}

.no-touch .terminal[data-case-study="true"] .terminal-display:hover {
    /* border-color: black; */
    background: rgba(0,0,0,0.075);
}

.terminal[data-intro="true"] .terminal-display {
    /*background: transparent;*/
    /*max-width:  80%;*/
}

[data-terminal=true] .terminal[data-intro="true"] .main-btn {
    background:  transparent;
}

.terminal .terminal-display.active {
    opacity: 1;
}

body[data-case-study-open="true"][data-mousemove="false"] .slides-close,
body[data-case-study-open="true"][data-mousemove="false"] .slides-nav--video {
    visibility: hidden;
}

body[data-case-study-open="true"][data-mousemove="false"] .slides-close:hover,
body[data-case-study-open="true"][data-mousemove="false"] .slides-nav--video:hover {
    visibility: visible;
}

.slides-nav:hover .slides-close,
.slides-nav:hover svg,
.slides-nav:hover .slides-nav--video {
    visibility: visible !important;
}

.terminal .close-btn.active,
[data-log-overlay="true"] .terminal .close-btn {
    opacity: 1;
    cursor: pointer;
    pointer-events: auto;
}

.terminal-display {
    /*max-width: 50%;*/
}

.terminal-display:after {
    content: attr(data-display);
    display: inline-block;

    white-space: nowrap;
}

@keyframes marquee {
    0% {
        transform:  translateX(0%);
    }

    60% {
        transform:  translateX(-105%);
    }

    60.0001% {
        transform:  translateX(calc(50vw - 5vw - 1px));
    }

    100% {
        transform:  translateX(0%);
    }
}

@keyframes marquee-mobile {
    0% {
        transform:  translateX(0%);
    }

    60% {
        transform:  translateX(-105%);
    }

    60.0001% {
        transform:  translateX(calc(100vw - 30px));
    }

    100% {
        transform:  translateX(0%);
    }
}

.terminal[data-marquee="true"] .terminal-display:after {
    animation:  marquee 15s linear infinite;
    animation-delay: 1.5s;
}

.terminal[data-speed="slow"] .terminal-display:after {
    animation-duration: 20s;
}

.terminal[data-speed="fast"] .terminal-display:after {
    animation-duration:  10s;
}

.terminal[data-marquee="true"] .terminal-display {
    clip-path: inset(0 0 0 0);
}

#index .case-studies {
    box-sizing: border-box;
    position: relative;
    z-index: 10;
    padding-top:  75vh;
    padding-bottom: 50vh;
}

.case-studies.preview {
    height: 100vh;
    display: flex;
}

.case-studies.preview .case-study {
    margin: auto;
    width: 100%;
}

.case-studies.preview .stripe {
    display: none;
}

.case-studies-holder {
    position: relative;
}

.case-studies .slide {
    display: none;
}

.slide-video img {
    display: none;
}

/* [data-case-study-open="true"] .slide video {
    max-height: 100vh;
} */

.case-studies .slide:first-of-type {
    display: block;
}

@keyframes stripe {
    0% {
        background-position: 0 0vh;
    }
    100% {
        background-position: 0 -50vh;
    }
}

.stripe {
    display: block;
    position: relative;
    bottom: 0;
    height:  52vh;
    left: 50vw;
    width:  2px;
    z-index: 1;
    opacity: 1;
    background-size: 100% 75vh;
    background-position: 0 0;
    margin-left: -1px;
}

.case-studies > .stripe:first-child,
#log .stripe {
    transition: 0.66s clip-path ease;
    clip-path: inset(100% 0 0 0);
}

.case-studies > .stripe.active:first-child,
#log .stripe.active {
    clip-path: inset(0 0 0 0);
}

#log .stripe {
    position: absolute;
    height: 42px;
    height: 100%;
    left: 0;
    margin-left: 0;
    bottom: auto;
    top: 0;
    clip-path: inset(0 0 0 100%);
}

#log .stripe:before,
#log .stripe:after {
    display: none;
}

.log-entry .log-item {
    position: relative;
}

.log-item__hide img,
.log-item__hide video {
    opacity: 0;
}

.log-entry .log-item.open-item {
    position: fixed;
    z-index: 99;
    transition: all 0.25s ease, z-index 0ms;
}

.log-entry .log-item.open-item .stripe {
    display: none;
}

.log-entry .log-item.open-item img,
.log-entry .log-item.open-item video {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.log-item img,
.log-item video {
    display: block;
}

.log-item.overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--color-background);
    /* backdrop-filter: blur(5px); */
    z-index: 110;
    display: flex;
}

.log-item.overlay img,
.log-item.overlay video {
    width: auto;
    height: auto;
    max-height: 100vh;
    max-width: 1200px;
    margin: auto;
    object-fit: contain;
    visibility: visible;
}

.log-item.overlay video {
    width: 80vw;
}

.log-item.log-video img,
.log-item.overlay .stripe {
    display: none;
}

.log-entry .log-item img,
.log-entry .log-item video,
.log-entry .log-item__text,
.log-entry .caption {
    opacity: 0;
    transition: opacity 0.2s 0.66s ease;
}

.log-entry.loaded .log-item img,
.log-entry.loaded .log-item video,
.log-entry.loaded .log-item__text,
.log-entry.loaded .caption {
    opacity: 1;
}

.log-entry.loaded .stripe {
    visibility: visible;
}

#log .log-entry .stripe {
    clip-path: inset(0 0 calc(100% - 18px) 0);
}

#log .log-entry.loaded .stripe {
    clip-path: inset(0 0 0% 0);
}

/* [data-case-study-open="true"] .stripe {
    visibility: hidden;
} */

.stripe-left.active,
.stripe-right.active {
    clip-path: none;
}

.stripe-left {
    left: -1px;
    bottom: 0;
    top: 0;
    height: 100%;
    margin-left: -1px;
    position: absolute;
}

.stripe-right {
    right:  -1px;
    left:  auto;
    bottom: 0;
    top:  0;
    height:  100%;
    margin-right:  -1px;
    position: absolute;
}

.stripe-left:before,
.stripe-left:after,
.stripe-right:before,
.stripe-right:after {
    content: "";
    position: fixed;
    top: 0;
    height: 50vh;
    height: calc(50vh - 18px);
    width: 3px;
    background: var(--color-background);
    z-index: 2;
}

.stripe.stripe-left:after,
.stripe.stripe-right:after {
    top: auto;
    bottom: 0;
    left: 5vw;
    position: fixed;
    height: 50%;
    height: calc(50% - 17.5px);
    margin-left: -2px;
}

.stripe.stripe-right:after {
    left: 95vw;
    right:  auto;
    margin-left: 0;
    margin-right:  -2px;
}

.stripe:after {
    content: "";
    position: fixed;
    top: 0;
    height: 50vh;
    height: calc(50vh - 18px);
    left: 50vw;
    width: 2px;
    z-index: 2;
    background: var(--color-background);
    margin-left: -1px;
}

.case-study {
    position: relative;
    z-index: 20;
}

.case-study.top {
    z-index: 100;
}

.case-study-active .case-study {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    padding-bottom: 0;
}


.slides {
    position: relative;
    left:  5vw;
    width: 90vw;
    transition: 0.33s ease;
    transition-property: left, top, right, bottom;
}

.slides.closing {
    /* transition-duration: 10ms;
    visibility: hidden; */
}

.slides .slide {
    visibility: hidden;
}

.show .slides .slide:nth-of-type(1) {
    display: block;
    visibility: visible;
}

.slides-open[data-index="1"] .slide:nth-of-type(1),
.slides-open[data-index="2"] .slide:nth-child(2),
.slides-open[data-index="3"] .slide:nth-child(3),
.slides-open[data-index="4"] .slide:nth-child(4),
.slides-open[data-index="5"] .slide:nth-child(5),
.slides-open[data-index="6"] .slide:nth-child(6),
.slides-open[data-index="7"] .slide:nth-child(7),
.slides-open[data-index="8"] .slide:nth-child(8),
.slides-open[data-index="9"] .slide:nth-child(9),
.slides-open[data-index="10"] .slide:nth-child(10),
.slides-open[data-index="11"] .slide:nth-child(11),
.slides-open[data-index="12"] .slide:nth-child(12),
.slides-open[data-index="13"] .slide:nth-child(13),
.slides-open[data-index="14"] .slide:nth-child(14),
.slides-open[data-index="15"] .slide:nth-child(15),
.slides-open[data-index="16"] .slide:nth-child(16),
.slides-open[data-index="17"] .slide:nth-child(17),
.slides-open[data-index="18"] .slide:nth-child(18),
.slides-open[data-index="19"] .slide:nth-child(19),
.slides-open[data-index="20"] .slide:nth-child(20) {
    display: block !important;
    visibility: visible;
    left: 0;
}


.slides.slides-open {
    position: fixed;
    width: auto;
    padding: 0;
    z-index: 90;
    user-select: none;
}

.slides-open .stripe {
    display: none;
}

.slides-open .slide {
    position: absolute;
    top: 0;
    left: 101%;
}

.slides-open.closing .slide {
    display: none;
}

.slides-open.closing .slide:first-child {
    display: block;
    visibility: visible !important;
}

.slides video {
    transition: max-height 0.33s ease;
}

.slides .slide:first-child img,
.slides .slide:first-child video,
.slides.slides-open.closing .slide:first-child img,
.slides.slides-open.closing .slide:first-child video {
    object-fit: cover;
    /* max-height: 85vh; */
    /* min-height: 50.625vw; */
    max-height: 54vw;
    object-position: center;
}

.slides.slides-open .slide:first-child img,
.slides.slides-open .slide:first-child video,
.slides.slides-open .slide .slide-img[data-horizontal="true"] img,
.slides.slides-open .slide .slide-video[data-horizontal="true"] video {
    min-height: 0;
    max-height: 100vh;
    object-fit: cover;
    object-position: center;
}

.slide {
    position: relative;
    z-index: 10;
    background: #ECECEC;
    width: 100%;
    height: 100%;
    visibility: hidden;
    cursor: pointer;
    /* transition: opacity 0.33s ease; */
}

.slides-nav {
    height: 42px;
    width: 100%;
    line-height: 42px;
    position: fixed;
    top:50%;
    left: 0;
    z-index: 10;
    transform: translateY(-50%);
    visibility: hidden;
    pointer-events: none;
    font-size: 11.5px;
    text-transform: uppercase;
}

.slides-nav-btn {
    width: 100%;
    text-align: center;
    display: flex;
}

.slides-nav .nav-btn {
    position: absolute;
    cursor: pointer;
    display: flex;
    height: 42px;
    width: 4vw;
    text-align: center;
    background: rgba(255,255,255,0.12);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    opacity: 1;
    transition: clip-path 0.33s ease;
    min-width: 42px;
    max-width: 72px;
}

.slides-nav .nav-btn svg {
    visibility: hidden;
    margin:  auto;
}

.nav-btn span {
    display: inline-block;
    margin: auto;
    line-height: 1em;
}

.nav-btn .terminal-btn {
    border: 0;
}

.slides-nav .nav-btn:hover {
    background: rgba(255,255,255,0.8);
}

.slides-nav .nav-btn:hover svg,
body[data-mousemove="true"] .slides-nav .nav-btn svg {
    visibility: visible;
}

.slides-nav .nav-btn .terminal-btn {
    opacity: 1;
    display: flex;
}

.slides-open .slides-nav {
    visibility: visible;
}

.slides-open .slides-nav .nav-btn {
    pointer-events: auto;
}

.slides-nav .slides-prev {    
    left: 0;
    right: auto;
    clip-path: inset(0 100% 0 0);
}

.slides-nav .slides-next {    
    left: auto;
    right: 0;
    clip-path: inset(0 0 0 100%);
}

.slides-nav .slides-close {    
    left: 50vw;
    transform: translateX(-50%);
    clip-path: inset(0 50% 0 50%);
}

.slides-nav--video {
    position: fixed;
    left: 50vw;
    transform: translateX(36px);
    display: none;
}

.slides[data-video="true"] .slides-nav--video {
    display: flex;
}

.slides-nav--video .nav-btn {
    position: relative;
}

.nav-btn[data-status="on"] span[data-on]:after {
    content: attr(data-on);
}

.nav-btn[data-status="off"] span[data-off]:after {
    content: attr(data-off);
}

.nav-btn[data-show="false"] {
    display: none;
}

body[data-case-study-open="true"] .terminal {
    pointer-events: none;
}

body[data-case-study-open="true"] .slides-nav .slides-prev,
body[data-case-study-open="true"] .slides-nav .slides-next,
body[data-case-study-open="true"] .slides-nav .slides-close {
    clip-path: inset(0 0 0 0);
}

.slides-nav .slides-close {
    transition-delay: 0s;
    transition-duration: 0.1s;
}

body[data-case-study-open="true"] .slides-nav .slides-close {
    transition-delay: 0.25s;
}

.slides[data-count="1"] .slides-nav .slides-prev,
.slides[data-count="1"] .slides-nav .slides-next {
    display: none;
}

.slides-nav .terminal-btn {
    margin: auto;
    opacity: 0;
}

.slides-nav .close-btn {
    pointer-events: none;
}

body[data-mousemove="true"] .slides-nav .terminal-btn,
.slides-nav:hover .terminal-btn {
    opacity: 1;
}

.case-study {
    /* transition: transform 0.5s ease; */
    user-select: none;
}

.case-study.top {
    z-index: 101 !important;
}

.slide-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 5;
}

.slide-img,
.slide-video {
    width: 100%;
    height: 100%;
}

.slide-img img,
.slide-video video {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: left center;
}

[data-alignment="center"] img,
[data-alignment="center"] video {
    object-position: center center;
}

[data-alignment="right"] img,
[data-alignment="right"] video {
    object-position: center right;
}

.slide-txt__container {
    width: 100%;
    height: 100%;
    display: flex;
}

.slide-txt.text-container {
    margin:  auto;
    text-align: left;
}


.slide-txt {
    /* padding-left: 5vw;
    padding-right: 20vw; */
    padding-top: 10vh;
    padding-bottom: 10vh;
    overflow: auto;
}

#log {
    position: relative;
    /* background: #DFDFDF; */
    z-index: 60;
    overflow-x: hidden;
    width: 90vw;
    margin-left: 5vw;
    padding-top: calc(5vw + 42px);
    min-height: 100vh;
}

#log:after {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #000;
    z-index: 98;
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.33s ease;
    -webkit-tap-highlight-color: transparent;
}

[data-log-overlay="true"] #log:after {
    opacity: 1;
}

body[data-fixed-terminal="true"] .terminal-holder {
    position: fixed;
    top: 2vw;
    margin-top: 17.5px;
}

/* #log .terminal {
    position: relative;
    visibility: visible;
    left: 0;
} */

body[data-fixed-terminal="true"] #log .terminal-holder {
    display: block;
}

.log-entries {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.log-entries .log-entry {
    margin: 0;
    width: 25%;
    width: calc(25% - 8px);
    margin-bottom: 80px;
    position: relative;
}

.log-entries .log-entry img,
.log-entries .log-entry video {
    width: 100%;
    height: auto;
}

.log-img,
.log-video {
    cursor: pointer;
}

.log-img img:nth-of-type(1) {
    display: block;
}
.log-img img:nth-of-type(2) {
    display: none;
    position: absolute;
    top: 0;
}

.log-img.open-item img:nth-of-type(1) {
    display: block;
}
.log-img.open-item img:nth-of-type(2) {
    display: block;
    visibility: hidden;
}
.log-img.open-item img:nth-of-type(2).loaded {
    visibility: visible;
}

.log-entries .log-text {
    padding-right: 1rem;
    padding-left: 0.1rem;
    padding-top: 0rem;
    font-size: 1rem;
    min-height: 22vw;
    display: flex;
    text-align: center;
    font-size: 1.32rem;
}

.log-text img {
    display: none;
}

.log-item__text {
    margin:  auto;
    margin-top: -0.35em;
    padding:  0 10px;
}

.log-item__text p {
    margin: 1em 0;
    line-height: 1.2em;
}

.log-item__text p:first-of-type {
    margin-top: 0;
}

.log-item__text p:last-of-type {
    margin-bottom: 0;
}

.log-load {
    height: 1px;
    margin-bottom: 25vh;
}

#log p.caption {
    display: none;
    font-size: 10px;
    text-align: center;
    text-transform: uppercase;
}

#info {
    /* background: #DFDFDF; */
    position: relative;
    z-index: 50;
    padding-top: calc(4vw + 42px);
    padding-bottom: 5vw;
    min-height: 100vh;
    color: white;
}
/*-------------------- Big screens */

@media (min-width: 1100px) {
    body,
    input,
    button,
    textarea {
        font-size: 1.85rem;
    }

    .text-container {
        width: 90vw;
        line-height: 150%;
        margin-left: 5vw;
    }
}

@media (min-width: 1530px) {

    body,
    input,
    button,
    textarea {
        font-size: 1.66rem;
    }

    .terminal {
        font-size:  12px;
    }

}

/*-------------------- Bigger terminal */
.terminal {
    height: 42px;
    line-height: 42px;
}

.terminal a, .terminal div {
    line-height: 42px;
}

.terminal-holder {
    top: calc(50vh - 21px);
}

.stripe-left:before, .stripe-left:after,
.stripe:after,
.stripe.stripe-left:after,
.stripe.stripe-right:after,
.stripe-right:before {
    height: calc(50vh - 21px);
}

.stripe.stripe-center:after {
    height: calc(50vh - 21px);
}

body[data-fixed-terminal="true"] .terminal-spacer {
    height: 21px;
}

/*-------------------- Mobile */

@media (min-width: 768px) {
    /*-------------------- Desktop only */
    .hide--desktop {
        display: none !important;
    }
    /* Show newsletter form */
    body[data-info="true"] .terminal-display {
        display: none;
    }
    body[data-info="true"] .terminal-newsletter {
        display: block;
        opacity: 1;
        transition-delay: 0s;
        pointer-events: auto;
    }
}

@media (max-width: 768px) {

    body,
    input,
    button,
    textarea {
        font-size: 16px;
    }

    .text-container {
        width: 100vw;
        padding: 0 15px;
    }

    .hide--mobile {
        display: none !important;
    }

    .terminal-holder {
        /* position: fixed; */
        top: calc(48vh - 63px);
        /* margin-top: 17.5px; */
    }

    body[data-case-study-open="true"] .terminal {
        position: fixed;
        top: 36px;
    }

    body[data-fixed-terminal="true"] .terminal-spacer {
        height: 36px;
    }

    body[data-fixed-terminal="true"] .terminal-holder {
        top: 15px;
    }

    .terminal {
        left: 15px;
        width: calc(100vw - 30px);
        overflow: hidden;
        font-size: 11px;
    }

    .terminal-btn.terminal-btn__large {
        width: auto;
        min-width: 0;
    }

    .terminal-btn {
        width: 35px;
    }

    .terminal-btn.main-btn {
        min-width: 64px;
    }
    .terminal-btn.info-btn {
        min-width: 32px;
        text-align: center;
    }

    .terminal-right .terminal-btn {
        width: 44px;
        min-width: 44px;
        margin-right: 2px;
    }

    .terminal-left,
    .terminal-right {
        min-width: 100%;
    }

    .terminal-section {
        transition: transform 0.33s ease, clip-path 0.33s ease;
        transform: translate3d(0,0,0);
        /* clip-path: none !important; */
    }

    .terminal-section.terminal-right {
        background: none;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        clip-path: none !important;
    }

    .terminal-section.terminal-right .terminal-btn,
    .terminal-section.terminal-right .terminal-display {
        background: rgba(255,255,255,0.25);
        backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
    }
    .terminal .terminal-newsletter {
        position: relative;
        width: 0;
    }

    /* Show newsletter form */
    body[data-info-scroll="true"] .terminal-display {
        display: none;
    }
    body[data-info-scroll="true"] .terminal-newsletter {
        display: block;
        opacity: 1;
        transition-delay: 0s;
        pointer-events: auto;
    }

    [data-info="true"] .terminal .terminal-newsletter {
        width: 100%;
    }

    .terminal[data-marquee="true"] .terminal-display:after {
        animation-name: marquee-mobile;
    }

    body[data-case-study-open="true"] .terminal .close-btn {
        pointer-events: auto;
    }

    body[data-case-study-open="true"] .terminal .terminal-display {
        display: none;
    }

    .terminal[data-case-study="true"] .terminal-section,
    body[data-log-overlay="true"] .terminal-section,
    body[data-info-scroll="true"] .terminal-section {
        transform: translate3d(-100%,0,0);
    }

    .terminal[data-case-study="true"] .terminal-section {
        /* transition-duration: 0s; */
    }

    .terminal #newsletter .terminal-btn {
        margin-left: 2px;
        margin-right: 0;
    }

    body[data-info="true"] .terminal-right .menu-btn {
        display: block;
    }

    body[data-info="true"] .terminal-right #newsletter .terminal-btn {
        display: block;
        margin-left: 2px;
    }

    body[data-info="true"] .terminal-right #newsletter .terminal-btn button {
        width: inherit;
    }

    body[data-show-menu="true"] .terminal[data-case-study="true"] .terminal-section,
    body[data-show-menu="true"][data-info="true"] .terminal-section {
        transform: translate3d(0%,0,0);
    }

    body[data-case-study-open="true"] .terminal-right {
        clip-path: none !important;
    }

    .terminal[data-case-study="true"] .terminal-display:before {
        content:"↗";
        position: absolute;
        right: 0;
        width: 42px;
        text-align: center;
        /* transform: rotate(-45deg); */
    }

    .terminal-btn.menu-btn {
        line-height: 4em;
    }

    .terminal[data-case-study="true"] .terminal-right .terminal-btn.menu-btn {
        /* display: block; */
    }

    body[data-case-study-open="true"] .terminal[data-case-study="true"] .terminal-right .terminal-btn.menu-btn {
        display: none;
    }
    body[data-case-study-open="true"] .terminal[data-case-study="true"] .terminal-right .terminal-btn.close-btn {
        display: block;
        margin-left:  0;
        margin-right: 0;
    }

    .intro-text {
        height: 31.33vh;
    }

    #index .case-studies {
        padding-top: calc(66.66vh + 42px);
        padding-bottom: 50vh;
    }

    .case-study {
        margin-bottom: 50vh;
    }

    .case-study:last-of-type {
        margin-bottom: 0;
    }

    .mobile-img + img {
        display: none;    
    }

    .mobile-vid + .slide-video {
        display: none;    
    }

    .slides img {
        transition: max-height 0.33s ease;
    }

    .slides .slide:first-child img.mobile-img,
    .slides .slide:first-child .mobile-vid video,
    .slides.slides-open.closing .slide:first-child img.mobile-img,
    .slides.slides-open.closing .slide:first-child .mobile-vid video {
        max-height: none;
        min-height: 0;
    }

    .stripe {
        /*display: none;*/
    }

    .log-item {
        -webkit-tap-highlight-color: transparent;
    }

    .log-item .stripe {
        display: block;
    }

    .stripe.stripe-left {
        /*display: block;
        position: absolute;
        top: -50vh;
        left: 50%;
        height: 50vh;*/
    }

    .stripe.stripe-center:after {
        height: calc(48vh - 21px);
    }

    .stripe-left,
    .stripe-right {
        display: none;
    }

    .stripe-left:before,
    .stripe-left:after {
        height: 15px;
        left: 13px;
    }

    .stripe.stripe-left:after {
        height: calc(100vh - 50px);
        margin: 0;
        left: 13px;
    }

    .slides {
        left: 15px;
        width: calc(100vw - 30px);
        /*padding-top: 50vh;*/
        transition-duration: 500ms;
        overflow: hidden;
    }

    .slides.closing {
        overflow: hidden;
        transition-duration: 0.1ms;
    }

    .slides img,
    .slides video {
        transition-duration: 0.0s !important;
    }

    .slides .slide {
        visibility: visible;
        margin-bottom: 2px;
    }

    .slides.slides-open {
        top: 0;
        height: 100vh;
        left: 0;
        overflow-y: auto;
        -webkit-overflow-scrolling: auto;
        background: var(--color-background);
    }

    .slides.slides-open .stripe {
        display: none;
    }

    .slides.slides-open .slide {
        display: block;
        position: relative;
        width: 100%;
        height: auto;
        left: 0;
    }

    .slides-nav {
        display: none;
    }

    .slide-txt.text-container {
        padding-top: 1.5em;
        padding-bottom: 1.75em;
    } 

    #log {
        width: 100vw;
        margin-left: 0;
    }

    .log-entries {
        gap: 12px;
    }

    .log-entries .log-entry {
        margin: 0;
        width: 50%;
        width: calc(50% - 6px);
    }

    #log .log-entry .stripe {
        left:  auto;
        right: -1px;
    }

    #log .log-entry:nth-child(2n) .stripe {
        right:  auto;
        left:  -1px;
    }

    .log-entries .log-text {
        font-size: 9px;
        padding-left: 5px;
        min-height: 47vw;
        font-size:  12px;
    }

    .log-entries:nth-child(2n) .log-text {
        padding-left: 0;
    }
    
    .text-wrapper.text-small {
        font-size: 10px;
    }

    #info {
        padding-top: 90px;
    }

}