* {
    cursor: default;
}
body.no-scroll,
html.no-scroll {
    overflow: hidden !important;
    width: 100vw;
    height: 100vh;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    position: fixed;
}
body,
html {
    margin: 0;
    padding: 0;
    font-family: sans-serif;
}


h1, h2, h3, h4, h5 {
    font-weight: 600 !important;
}
#page-wrapper {
    width: 100%;
    margin: 0;
    padding: 0;
    position: absolute;
    left: 0;
}
#card-stack {
    width: 100vw;
    height: 100vh;
    position: fixed;
    list-style: none;
    padding: 0;
    text-decoration: none;
    display: block;
    margin: 0;
    top: 0;
    overflow: hidden;
    left: 0;
    transform-origin: 50% 50%;
}
#card-stack > .card {
    width: 100%;
    will-change: transform;
    -webkit-perspective: 1000;
    transform-style: preserve-3d;
    height: 100%;
    position: absolute;
    overflow: hidden;
    transform-origin: 50% 50%;
    perspective: 0px;
}
.card-content {
    will-change: transform;
    -webkit-perspective: 1000;
    perspective: 1000;
    transform-style: preserve-3d;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    position: absolute;
    color: #fff;
    top: 50%;
    opacity: 0;
    display: none;
    left: 75px;
    list-style: none;
    height: 240px;
    width: 530px;
    z-index: 80000;
    margin-top: -105px;
}
.slide-length {
    color: #FFF;
    position: absolute;
    top: 24px;
    left: 50%;
    margin-left: 0;
}
#slide-indicators > div.slide-length {
    color: #FFF;
    position: absolute;
    top: 1px;
    left: 50%;
    margin-left: 0;
    opacity: 1;
    width: auto;
    letter-spacing: 2.4px;
}
#main-nav.light-background .slide-length {
    color: #000;
}
.nav-link.dribbble {
    bottom: -2px;
    left: 25px;
}
.nav-link.contact {
    bottom: -2px;
    right: 25px;
}

.nav-link.contact:hover {
    color: white;
}
.card.light-accent {
    color: #fff;
}
.preload-blur {
    width: 100%;
    height: 100%;
    position: absolute;
    display: block;
    will-change: opacity;
    transition: 1s transform ease-out;
    -webkit-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    -moz-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    -o-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    opacity: 1;
    transform: scale(1.5);
    background-size: cover;
}
#card-stack.onscreen .preload-blur {
    transform: scale(1.25);
}
#card-stack .preload-blur.scaled {
    transform: scale(1.5) !important;
}

.center-shading-light {
    width: 80vw;
    height: 140vh;
    position: fixed;
    top: -70vh;
    background-color: #fff;
    opacity: 0.088;
    left: 10vw;
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,ffffff+100&1+0,0+61 */

    background: -moz-radial-gradient(center, ellipse cover, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 61%, rgba(255, 255, 255, 0) 100%);
    /* FF3.6-15 */

    background: -webkit-radial-gradient(center, ellipse cover, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 61%, rgba(255, 255, 255, 0) 100%);
    /* Chrome10-25,Safari5.1-6 */

    background: radial-gradient(ellipse at center, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 61%, rgba(255, 255, 255, 0) 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */


    z-index: 900;
}

#intro {
    z-index: 8;
    background-color: #2d2d36;
}
#encrypto {
    z-index: 7;
    background-color: #060103;
}
#wildfire {
    z-index: 6;
    background-color: #141414;
}
#biomedical {
    z-index: 5;
    display: none;
    background-color: #2A3037;
}
#foodly {
    z-index: 4;
    display: none;
    background-color: #1E1D22;
}
#brokefemale {
    z-index: 3;
    display: none;
    background-color: #FFFFFF;
}
#card-stack > #wildfire .preload-blur {
    background-image: url(../img/blurs/wildfire.jpg);
    z-index: 529;
}
#card-stack > #intro .preload-blur {
    background-image: url(../img/blurs/intro.jpg);
    z-index: 729;
}
#card-stack > #encrypto .preload-blur {
    background-image: url(../img/blurs/encrypto.jpg);
    z-index: 629;
}
#card-stack > #foodly .preload-blur {
    background-image: url(../img/blurs/foodly.jpg);
    z-index: 329;
}
#card-stack > #brokefemale .preload-blur {
    background-image: url(../img/blurs/brokefemale.jpg);
    z-index: 229;
}
#card-stack > #biomedical .preload-blur {
    background-image: url(../img/blurs/biomedical.jpg);
    z-index: 429;
}
#main-nav {
    position: absolute;
    width: 100%;
    z-index: 200000;
    top: 0;
    left: 0;
    padding: 0 40px 0 40px;
    box-sizing: border-box;
}
.centerer {
    max-width: 1180px;
    position: relative;
    margin: 0 auto;
    z-index: 100000;
    height: 100%;
}
.centerer.main-nav-centerer {
    height: 84px;
    padding: 1px;
    margin-top: 1px;
}
.logo {
    /* float: left; */

    width: 200px;
    background-color: rgba(255, 255, 255, 0.055);
    text-align: center;
    position: fixed;
    bottom: 0px;
    left: 50%;
    margin-left: -100px;
    border-radius: 9px 9px 0px 0px;
    will-change: transform;
    -webkit-perspective: 1000;
    transform-style: preserve-3d;
    transition: 0.5s ease-out all;
    -webkit-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    -moz-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    -o-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    -webkit-backface-visibility: hidden;
    margin-bottom: 0;
    height: 40px;
}
.logo .logo-image {
    fill: #fff;
    width: 150px;
    height: 30px;
    text-indent: -9999px;
    left: 50%;
    background-image: url(../logo_white.png);
    background-size: contain;
    margin: 6px 0 0 -75px;
    position: absolute;
    will-change: opacity;
    transition: 0.5s ease-out opacity;
    -webkit-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    -moz-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    -o-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    -webkit-backface-visibility: hidden;
}
.logo .logo-image.black {
    opacity: 0;
    background-image: url(../logo_black.png);
}

#main-nav.light-background .logo:hover {
	background-color: rgba(0, 0, 0, 1);
}
.logo:hover{
	background-color: rgba(255, 255, 255, 1);
}

.logo:hover .logo-image.white{
	opacity: 0;
}
.logo:hover .logo-image.black{
	opacity: 1;
}
#main-nav.light-background .logo:hover .logo-image.white{
	opacity: 1;
}
#main-nav.light-background .logo:hover .logo-image.black{
	opacity: 0;
}

#main-nav.light-background .logo .logo-image.white {
    opacity: 0;
}
#main-nav.light-background .logo .logo-image.black {
    opacity: 1;
}
#main-nav.light-background .logo {
    background-color: rgba(0, 0, 0, 0.055);
}
.logo > a {
    font-size: 24px;
    font-weight: 300;
    color: #FFF;
    transition: 0.7s all ease-in-out;
    -webkit-transition: 0.7s all ease-in-out;
    -ms-transition: 0.7s all ease-in-out;
    -moz-transition: 0.7s all ease-in-out;
    -o-transition: 0.7s all ease-in-out;
    text-decoration: none;
    /* font-family: 'Slate W01 Light'; */
}
#main-nav #header-bottom-border {
    content: "";
    display: block;
    position: absolute;
    bottom: 0;
    background-color: rgba(255, 255, 255, 0.05);
    transition: 0.7s all ease-in-out;
    -webkit-transition: 0.7s all ease-in-out;
    -ms-transition: 0.7s all ease-in-out;
    -moz-transition: 0.7s all ease-in-out;
    -o-transition: 0.7s all ease-in-out;
    top: 94px;
    width: 98%;
    left: 50%;
    margin-left: -49%;
    height: 1px;
    opacity: 1;
}
#main-nav.light-background .main-nav-centerer div#header-bottom-border {
    background-color: rgba(0, 0, 0, 0.04);
}
#main-nav.light-background > .centerer > .logo > a {
    color: #000;
}
.nav-link {
    color: rgba(255, 255, 255, 0.25);
    transition: 0.7s all ease-in-out;
    -webkit-transition: 0.7s all ease-in-out;
    -ms-transition: 0.7s all ease-in-out;
    -moz-transition: 0.7s all ease-in-out;
    -o-transition: 0.7s all ease-in-out;
    text-decoration: none;
    padding: 0;
    /* font-family: 'Proxima N W01 Light'; */
    position: fixed;
    letter-spacing: 2px;
    text-transform: UPPERCASE;
    font-size: 11px;
    text-align: center;
}
#main-nav > .centerer > .nav-links > .nav-link {
    color: #fff;
}
#main-nav.light-background .nav-link {
    color: #000;
}
.nav-link.last {
    margin-right: 10px;
    padding-right: 0;
}
#card-content-stack {
    position: relative;
    padding: 0;
    width: 100vw;
    z-index: 100000;
    height: 100vh;
    margin: 0 !important;
}
#slide-descriptions {
    position: absolute;
    left: 50%;
    bottom: 22px;
    margin-left: -150px;
    letter-spacing: 1px;
    width: 300px;
    will-change: transform, opacity;
    opacity: 0;
    transform: translateX(40px);
    transition: 0.6s ease-out all;
    -webkit-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    -moz-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    -o-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    -webkit-perspective: 1000;
    transform-style: preserve-3d;
    -webkit-backface-visibility: hidden;
    /* font-family: 'Slate W01'; */
    text-align: center;
    height: 20px;
    top: 72px;
}
#slide-descriptions.onscreen {
    opacity: 1;
    transform: translateX(0);
}
#main-nav.light-background #slide-descriptions > div {
    color: #000;
}
#slide-descriptions > div {
    position: absolute;
    bottom: 0;
    transition: 0.4s all ease-in-out;
    -webkit-transition: 0.4s all ease-in-out;
    -ms-transition: 0.4s all ease-in-out;
    -moz-transition: 0.4s all ease-in-out;
    -o-transition: 0.4s all ease-in-out;
    -webkit-transition-delay: 0.3s;
    -ms-transition-delay: 0.3s;
    -moz-transition-delay: 0.3s;
    -o-transition-delay: 0.3s;
    transition-delay: 0.3s;
    color: #fff;
    font-size: 11px;
    opacity: 0;
    text-transform: uppercase;
    margin: 0 auto;
    top: 0;
    left: 50%;
    width: 300px;
    margin-left: -50%;
}
#slide-descriptions > div.active-slide {
    opacity: 1;
}
#slide-indicators {
    position: absolute;
    bottom: 24px;
    will-change: transform, opacity;
    opacity: 0;
    transform: translateY(-40px);
    -webkit-transition: all 900ms cubic-bezier(0.645, 0.045, 0.355, 1.000);
    -moz-transition: all 600ms cubic-bezier(0.645, 0.045, 0.355, 1.000);
    -o-transition: all 600ms cubic-bezier(0.645, 0.045, 0.355, 1.000);
    transition: all 600ms cubic-bezier(0.645, 0.045, 0.355, 1.000);

    -webkit-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    -moz-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    -o-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    -webkit-perspective: 1000;
    transform-style: preserve-3d;
    -webkit-backface-visibility: hidden;
    height: 30px;
    padding: 1px;
    top: 42px;
    width: 70px;
    left: 50%;
    margin-left: -39px;
    /* font-family: 'Proxima N W01 Reg'; */
}
#previous-slide-button {
    transform: translateX(-40px);
    left: 0px;
}
#next-slide-button {
    transform: translateX(40px);
    right: 0;
}
.slide-control.onscreen .slide-button#previous-slide-button,
.slide-control.onscreen .slide-button#next-slide-button {
    transform: translateX(0px);
    opacity: 1;
}
.slide-button {
    width: 52px;
    height: 18px;
    line-height: 0;
    opacity: 0;
    background-color: rgba(255, 255, 255, 0.055);
    -webkit-perspective: 1000;
    transform-style: preserve-3d;
    transition: 1s ease-out transform;
    -webkit-backface-visibility: hidden;
    -webkit-transition: all 600ms cubic-bezier(0.645, 0.045, 0.355, 1.000);
    -moz-transition: all 600ms cubic-bezier(0.645, 0.045, 0.355, 1.000);
    -o-transition: all 600ms cubic-bezier(0.645, 0.045, 0.355, 1.000);
    transition: all 600ms cubic-bezier(0.645, 0.045, 0.355, 1.000);

    -webkit-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    -moz-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    -o-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    border-radius: 8px;
    position: absolute;
    padding: 20px 0 0 0;
    /* font-family: 'Slate W01 Light'; */
    text-align: center;
    color: #FFF;
    top: 31px;
}
.slide-button:hover {
    background-color: #fff;
    color: #000;
}
.slide-button:active {
    opacity: 0 !important;
    border-radius: 30px !important;
}
#main-nav.light-background .slide-button {
    color: #000;
    background-color: rgba(0, 0, 0, 0.06);
}
#main-nav.light-background .slide-button:hover {
    background-color: #000;
    color: #FFF;
}
#slide-indicators.onscreen {
    opacity: 1;
    transform: translateY(0);
}
#slide-indicators > div:first-child {
    margin-left: 0;
}
#slide-indicators > div {
    transition: 0.4s all ease-in-out;
    -webkit-transition: 0.4s all ease-in-out;
    -ms-transition: 0.4s all ease-in-out;
    -moz-transition: 0.4s all ease-in-out;
    -o-transition: 0.4s all ease-in-out;
    -webkit-transition-delay: 0.3s;
    -ms-transition-delay: 0.3s;
    -moz-transition-delay: 0.3s;
    -o-transition-delay: 0.3s;
    transition-delay: 0.3s;
    margin-left: 0;
    background-color: rgba(0, 0, 0, 0);
    opacity: 0;
    position: absolute;
    width: 22px;
    text-align: center;
    left: 12px;
    font-size: 12px;
}
#slide-indicators > div > sup {
    font-size: 10px;
    /* font-family: 'Slate W01'; */
    margin-left: 1px;
}
#slide-indicators > div.active-slide {
    opacity: 1;
    color: #fff;
}
#main-nav.light-background #slide-indicators > div {
    background-color: rgba(0, 0, 0, 0);
    color: #000;
}
#main-nav.light-background #slide-indicators > div.active-slide {
    opacity: 1;
}
.card-content:first-child {
    display: block;
}
.card-content.hero {
    opacity: 1;
}
.card-content.light-background {
    color: #000;
}
.card-content > .card-title {
    font-size: 84px;
    font-weight: 100;
    margin-bottom: 70px;
    margin-top: 20px;
    position: relative;
    display: block;
    will-change: transform, opacity;
    opacity: 0;
    transform: translateX(40px);
    transition: 0.6s ease-out opacity, 0.6s ease-out transform;
    -webkit-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    -moz-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    -o-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    -webkit-perspective: 1000;
    transform-style: preserve-3d;
    -webkit-backface-visibility: hidden;
    /* font-family: 'Proxima N W01 Thin Reg'; */
    line-height: 0;
}
#card-content-stack.onscreen .card-content > .card-title {
    transform: translateX(0px);
    opacity: 1;
    width: 110%;
}
.card-content > .see-more {
    text-decoration: none;
    display: block;
    z-index: 10000;
    width: 110px;
    position: relative;
}
.card-content > .see-more > .card-button {
    text-align: center;
    width: 110px;
    z-index: 100001;
    font-weight: 500;
    border-radius: 3px;
    height: 24px;
    padding-top: 10px;
    will-change: transform, opacity, color;
    -webkit-perspective: 1000;
    transform-style: preserve-3d;
    -webkit-backface-visibility: hidden;
    transition: 0.25s ease-out all;
    -webkit-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    -moz-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    -o-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    opacity: 0;
    transform: translateX(80px);
    border: 1px solid rgba(255, 255, 255, 0.2);
    font-size: 12px;
    display: block;
    left: -1px;
    position: relative;
    border-radius: 20px;
    /* font-family: 'Proxima N W01 Reg'; */
    text-transform: uppercase;
    letter-spacing: 1.75px;
}
.card-content > .see-more > .card-button.unloaded {
    transition: 0.6s ease-out opacity, 0.6s ease-out transform, 0.25s ease color;
    -webkit-perspective: 1000;
    transform-style: preserve-3d;
    -webkit-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    -moz-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    -o-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    -webkit-backface-visibility: hidden;
}
#card-content-stack.onscreen .card-content > .see-more > .card-button {
    opacity: 1;
    transform: translateX(0px);
}
* {
    -webkit-user-select: none;
    /* Chrome/Safari */

    -moz-user-select: none;
    /* Firefox */

    -ms-user-select: none;
    /* IE10+ */

    -o-user-select: none;
    user-select: none;
}
.justshake {
    animation: shake 0.82s cubic-bezier(.36, .07, .19, .97) both;
    transform: translate3d(0, 0, 0);
}
@keyframes shake {
    10%, 90% {
        transform: translate3d(-2px, 0, 0);
    }
    20%,
    80% {
        transform: translate3d(3px, 0, 0);
    }
    30%,
    50%,
    70% {
        transform: translate3d(-5px, 0, 0);
    }
    40%,
    60% {
        transform: translate3d(5px, 0, 0);
    }
}
.card-content.light-background > .see-more > .card-button {
    border-color: rgba(0, 0, 0, 0.13);
    color: rgba(0, 0, 0, 1);
}
.card-content > .see-more > .card-button {
    border-color: rgba(255, 255, 255, 0);
    color: #fff;
    background-color: rgba(255, 255, 255, 0.055);
}
.card-content.light-background > .see-more > .card-button:hover {
    background-color: rgba(0, 0, 0, 1);
    border-color: rgba(0, 0, 0, 1);
    color: rgba(255, 255, 255, 1);
}
.card-content > .see-more > .card-button:hover {
    background-color: rgba(255, 255, 255, 1);
    border-color: rgba(255, 255, 255, 1);
    color: rgba(0, 0, 0, 1);
}
.card-content > .see-more > .card-button:active {
    opacity: 0;
}
.card-content > .card-description {
    font-size: 21px;
    font-weight: 300;
    margin-bottom: 34px;
    will-change: transform, opacity;
    opacity: 0;
    transform: translateX(60px);
    transition: 0.6s ease-out all;
    -webkit-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    -moz-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    -o-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    -webkit-perspective: 1000;
    transform-style: preserve-3d;
    -webkit-backface-visibility: hidden;
    display: block;
    position: relative;
    /* font-family: 'Slate W01 Light'; */
    margin-top: 24px;
    line-height: 30px;
    letter-spacing: 0.2px;
}
#card-content-stack.onscreen .card-content > .card-metadata {
    transform: translateX(0px);
    opacity: 1;
}
.card-content > .card-metadata {
    /* font-family: 'Proxima N W01 Reg'; */
    font-size: 12px;
    will-change: transform, opacity;
    transition: 0.6s ease-out all;
    -webkit-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    -moz-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    -o-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    -webkit-perspective: 1000;
    transform-style: preserve-3d;
    -webkit-backface-visibility: hidden;
    transform: translateX(230px);
    opacity: 0;
    letter-spacing: 2px;
}
.card-content > .card-metadata .accent {
    color: #FF5252;
}
#card-content-stack.onscreen .card-content > .card-description {
    opacity: 1;
    transform: translateX(0);
}
.wrapper {
    position: absolute;
    left: 0;
    right: 0;
    width: 100%;
    will-change: transform;
    -webkit-perspective: 1000;
    transform-style: preserve-3d;
    height: 100%;
    display: block;
}
#card-stack > .card > .wrapper div {
    overflow: visible;
}
.zoom-wrapper {
    width: 100%;
    height: 100%;
    position: absolute;
    left: -3%;
    top: -3%;
    -webkit-perspective: 1000;
    transform-style: preserve-3d;
    -webkit-backface-visibility: hidden;
    will-change: transform;
    transition: 1.2s all ease;
    transform: scale(1.5);
}
#card-stack.onscreen .zoom-wrapper {
    transform: scale(1.25);
}
.middle-hero {
    position: absolute;
    width: 640px;
    height: 55px;
    left: 50%;
    top: 50%;
    margin-left: -320px;
    margin-top: -33px;
    background-size: contain;
    background-image: url(../img/assets/intro/hero@2x.png);
    background-repeat: no-repeat;
}
.hero-instruction {
    width: 400px;
    text-align: center;
    left: 50%;
    position: absolute;
    margin-left: -200px;
    /* font-family: 'Proxima N W01 Reg'; */
    font-size: 12px;
    letter-spacing: 2px;
    margin-top: 60px;
    top: 50%;
}
#card-stack > #intro> .wrapper #fa {
    z-index: 723;
}
#fa {
    background-image: url(../img/assets/intro/far.png);
    left: 0px;
    top: 0px;
    width: 1440px;
    height: 900px;
    position: absolute;
    background-size: cover;
}
#card-stack > #intro> .wrapper #further {
    z-index: 722;
}
#further {
    background-image: url(../img/assets/intro/further.png);
    left: 0px;
    top: 0px;
    width: 1440px;
    height: 900px;
    position: absolute;
    background-size: cover;
}
#card-stack > #encrypto> .wrapper #wall {
    z-index: 622;
}
#wal {
    background-image: url(../img/assets/encrypto/wall.jpg);
    left: 0px;
    top: 0px;
    width: 1440px;
    height: 900px;
    position: absolute;
    background-size: cover;
}
#card-stack > #encrypto > .wrapper #lens {
    z-index: 623;
}
#lns {
    background-image: url(../img/assets/encrypto/lens.png);
    left: 820px;
    top: 300px;
    width: 435px;
    height: 435px;
    position: absolute;
    background-size: cover;
}
#card-stack > #wildfire> .wrapper #noise {
    z-index: 522;
}
#noi {
    background-image: url(../img/assets/wildfire/background.jpg);
    left: 0px;
    top: 0px;
    width: 1440px;
    height: 900px;
    position: absolute;
    background-size: cover;
}
#card-stack > #wildfire> .wrapper #wildfire-rider {
    z-index: 523;
}
#rdr {
    background-image: url(../img/assets/wildfire/biker.png);
    left: 560px;
    top: 170px;
    width: 760px;
    height: 818px;
    position: absolute;
    background-size: cover;
}
#card-stack > #biomedical > .wrapper #room {
    z-index: 421;
}
#rom {
    background-image: url(../img/assets/biomedical/room.jpg);
    left: 0px;
    top: 0px;
    width: 1440px;
    height: 900px;
    position: absolute;
    background-size: cover;
}
#card-stack > #biomedical > .wrapper #baby {
    z-index: 422;
}
#bby {
    background-image: url(../img/assets/biomedical/baby.png);
    left: 130px;
    top: 65px;
    width: 905px;
    height: 875px;
    position: absolute;
    background-size: cover;
}
#card-stack > #foodly > .wrapper #floor {
    z-index: 321;
}
#flr {
    background-image: url(../img/assets/foodly/floor.jpg);
    left: 0px;
    top: 0px;
    width: 1440px;
    height: 900px;
    position: absolute;
    background-size: cover;
}
#card-stack > #foodly > .wrapper #plate {
    z-index: 322;
}
#plt {
    background-image: url(../img/assets/foodly/plate.png);
    left: 930px;
    top: 160px;
    width: 765px;
    height: 681px;
    position: absolute;
    background-size: cover;
}
.paper {
    width: 1440px;
    height: 900px;
    position: absolute;
    top: 0px;
    left: 0;
}
#card-stack > #brokefemale > .wrapper #small-bubbles {
    z-index: 221;
}
.sbubble {
    background-image: url(../img/assets/brokefemale/sbubble.png);
    width: 75px;
    height: 74px;
    position: absolute;
    background-size: cover;
}
#sbubble-one {
    top: 340px;
    left: 20px;
}
#sbubble-two {
    top: 340px;
    left: 220px;
}
#sbubble-three {
    top: 450px;
    left: 100px;
}
#sbubble-four {
    top: 120px;
    left: 300px;
}
#sbubble-five {
    top: 60px;
    left: 700px;
}
#card-stack > #brokefemale > .wrapper #large-bubbles {
    z-index: 222;
}
.lbubble {
    background-image: url(../img/assets/brokefemale/lbubble.png);
    width: 97px;
    height: 97px;
    position: absolute;
    background-size: cover;
}
#lbubble-one {
    top: 300px;
    left: 200px;
}
#lbubble-two {
    top: 500px;
    left: 100px;
}
#lbubble-three {
    top: 120px;
    left: 330px;
}
#lbubble-four {
    top: 200px;
    left: 600px;
}
#lbubble-five {
    top: 500px;
    left: 10px;
}
#card-stack > #brokefemale > .wrapper #woman {
    z-index: 223;
}
#wmn {
    background-image: url(../img/assets/brokefemale/woman.png);
    left: 760px;
    top: 220px;
    width: 516px;
    height: 679px;
    position: absolute;
    background-size: cover;
}
#card-stack > #ourapp > .wrapper #fam-background {
    z-index: 120;
    top: -50px;
}
#tscreen {
    background-image: url(../img/assets/ourapp/topcard.png);
    left: 890px;
    top: 260px;
    width: 312px;
    height: 527px;
    position: absolute;
    background-size: contain;
}
#fbkg {
    background-image: url(../img/assets/ourapp/background.jpg);
    left: 0;
    top: 0;
    width: 1440px;
    height: 900px;
    position: absolute;
    background-size: cover;
}
#card-stack > #ourapp > .wrapper #topscreen {
    z-index: 123;
    top: -80px;
    left: 40px;
}
#card-stack > #ourapp > .wrapper #midscreen {
    z-index: 122;
    top: -80px;
    left: 40px;
}
#mscreen {
    background-image: url(../img/assets/ourapp/midcard.png);
    left: 890px;
    top: 240px;
    width: 369px;
    height: 552px;
    position: absolute;
    background-size: contain;
}
#card-stack > #ourapp > .wrapper #botscreen {
    z-index: 121;
    top: -80px;
    left: 40px;
}
#bscreen {
    background-image: url(../img/assets/ourapp/botcard.png);
    left: 880px;
    top: 240px;
    width: 425px;
    height: 573px;
    position: absolute;
    background-size: contain;
}

.hero-section {
    width: 100%;
    height: 100vh;
    min-height: 700px;
    position: relative;
    padding: 0;
    overflow: hidden;
}
.hero-section.onscreen .hero-background-image {
    transform: scale(1.25);
}
.hero-background-image {
    background-size: cover;
    position: absolute;
    left: 0;
    transform: scale(1.5);
    top: 0;
    width: 100%;
    height: 100%;
    -webkit-perspective: 1000;
    transform-style: preserve-3d;
    -webkit-backface-visibility: hidden;
    will-change: transform, opacity;
    transition: 1.2s all ease;
}
.intro .hero-background-image {
    background-image: url('../img/blurs/intro.jpg');
}
.encrypto .hero-background-image {
    background-image: url('../img/blurs/encrypto.jpg');
}
.brokefemale .hero-background-image {
    background-image: url('../img/blurs/brokefemale.jpg');
}
.biomedical .hero-background-image {
    background-image: url('../img/blurs/biomedical.jpg');
}
.wildfire .hero-background-image {
    background-image: url('../img/blurs/wildfire.jpg');
}
.ourapp .hero-background-image {
    background-image: url('../img/blurs/ourapp.jpg');
}
.foodly .hero-background-image {
    background-image: url('../img/blurs/foodly.jpg');
}
.hero-section:after {
    display: none;
}
html,
body {
    margin: 0;
    padding: 0;
    width: 100%;
    height: auto;
    /* font-family: 'Source Sans Pro', sans-serif; */
    color: #FFF;
}
.slide-control {
    width: 180px;
    height: 66px;
    position: fixed;
    left: 50%;
    margin-left: -110px;
    padding: 20px;
    top: 0;
    z-index: 40000;
}
.slide-control.lastSlide div#next-slide-button.slide-button {
    opacity: 0;
    transform: translateX(60px);
}
.slide-control.lastSlide div#previous-slide-button.slide-button {
    opacity: 1;
    transform: translateX(85px);
}
.slide-control.lastSlide #slide-indicators {
    opacity: 0;
    transform: translateX(50px);
}
.slide-control.onscreen.firstSlide div#next-slide-button.slide-button {
    opacity: 1;
    transform: translateX(-60px);
}
.slide-control.onscreen.firstSlide div#previous-slide-button.slide-button {
    opacity: 0;
    transform: translateX(-60px);
}
.slide-control.onscreen.firstSlide #slide-indicators {
    opacity: 0;
    transform: translateX(-50px);
}
html.encrypto,
html.encrypto body {
    background-color: #121213;
}
html.biomedical,
html.biomedical body {
    background-color: #1C1B20;
}
html.wildfire,
html.wildfire body {
    background-color: #373737;
}
html.ourapp,
html.ourapp body {
    background-color: #3c6ca9;
}
html.foodly,
html.foodly body {
    background-color: #26252B;
}
html.brokefemale,
html.brokefemale body {
    background-color: #fff;
}
#header-bottom-border {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 1px;
    background-color: rgba(255, 255, 255, 0.1);
}
#main-nav > #main-nav-background {
    z-index: 0;
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    opacity: 0;
    left: 0;
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#09090c+0,09090c+100&0.93+0,1+83 */
    /* IE9 SVG, needs conditional override of 'filter' to 'none' */

    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzA5MDkwYyIgc3RvcC1vcGFjaXR5PSIwLjkzIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjgzJSIgc3RvcC1jb2xvcj0iIzA5MDkwYyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwOTA5MGMiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top, rgba(9, 9, 12, 0.93) 0%, rgba(9, 9, 12, 1) 83%, rgba(9, 9, 12, 1) 100%);
    /* FF3.6+ */

    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(9, 9, 12, 0.93)), color-stop(83%, rgba(9, 9, 12, 1)), color-stop(100%, rgba(9, 9, 12, 1)));
    /* Chrome,Safari4+ */

    background: -webkit-linear-gradient(top, rgba(9, 9, 12, 0.93) 0%, rgba(9, 9, 12, 1) 83%, rgba(9, 9, 12, 1) 100%);
    /* Chrome10+,Safari5.1+ */

    background: -o-linear-gradient(top, rgba(9, 9, 12, 0.93) 0%, rgba(9, 9, 12, 1) 83%, rgba(9, 9, 12, 1) 100%);
    /* Opera 11.10+ */

    background: -ms-linear-gradient(top, rgba(9, 9, 12, 0.93) 0%, rgba(9, 9, 12, 1) 83%, rgba(9, 9, 12, 1) 100%);
    /* IE10+ */

    background: linear-gradient(to bottom, rgba(9, 9, 12, 0.93) 0%, rgba(9, 9, 12, 1) 83%, rgba(9, 9, 12, 1) 100%);
    /* W3C */
}
* {
    cursor: default;
}
.hero-section > .section-content > .big-title {
    font-size: 90px;
    will-change: transform, opacity;
    opacity: 0;
    transform: translateY(40px);
    transition: 0.6s ease-out all;
    text-align: center;
    z-index: 16;
    font-weight: 100;
    margin-top: 20vh;
    margin-bottom: 60px;
    /* font-family: 'Proxima N W01 Thin Reg'; */
}
.intro .hero-section > .section-content > .big-title {
    color: rgb(255, 255, 255);
}
.encrypto .hero-section > .section-content > .big-title {
    color: rgb(255, 255, 255);
}
.brokefemale .hero-section > .section-content > .big-title {
    color: #000;
}
.wildfire .hero-section > .section-content > .big-title {
    color: #FFFFFF;
}
.ourapp .hero-section > .section-content > .big-title {
    color: #FFF;
    /* font-family: 'Proxima N W01 Thin Reg'; */
}
.biomedical .hero-section > .section-content > .big-title {
    color: #FFF;
}
.foodly .hero-section > .section-content > .big-title {
    color: #FFF;
}

.hero-section.onscreen > .section-content > .big-title {
    opacity: 1;
    transform: translateY(0);
}
.hero-section.unloaded > .section-content > .big-title {
    opacity: 0;
}
.close {
    fill-rule: evenodd;
    fill: #fff;
}
.encrypto .close {
    fill: #fff;
}
.brokefemale .close {
    fill: #000;
}
.ourapp .close {
    fill: #fff;
}
.wildfire .close {
    fill: #fff;
}
.biomedical .close {
    fill: #fff;
}
.foodly .close {
    fill: #fff;
}
.brokefemale .atop .close {
    fill: #fff;
}
.close-button-svg {
    height: 16px;
    width: 16px;
    margin: 13px;
    color: #fff;
}
.close-button-shader {
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: -1;
    transform: rotate(45deg);
    left: -100%;
    top: -100%;
    will-change: transform;
    -webkit-perspective: 1000;
    transform-style: preserve-3d;
    -webkit-backface-visibility: hidden;
    transition: 0.4s ease-out all;
    -webkit-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    -moz-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    -o-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    transition-delay: 0.2s;
    opacity: 1;
}
.encrypto .close-button-shader {
    background-color: #7E9BCA;
}
.brokefemale .close-button-shader {
    background-color: #59778f;
}
.wildfire .close-button-shader {
    background-color: #ec363a;
}
.ourapp .close-button-shader {
    background-color: #4074b4;
}
.biomedical .close-button-shader {
    background-color: #1ebe66;
}
.foodly .close-button-shader {
    background-color: #67a77e;
}
.close-button {
    border-radius: 9999px;
    height: 42px;
    overflow: hidden;
    will-change: transform, opacity;
    -webkit-perspective: 1000;
    transform-style: preserve-3d;
    transition: 1s ease-out transform, 0.6s ease opacity;
    -webkit-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    -moz-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    -o-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    -webkit-backface-visibility: hidden;
    transition: 0.8s ease all;
    width: 42px;
    position: fixed;
    left: 40px;
    opacity: 0;
    margin-left: 0;
    top: 46px;
}
.close-button.onscreen {
    opacity: 1;
}
path.arrow {
    fill: #fff;
    fill-rule: evenodd;
}
.encrypto path.arrow {
    fill: #fff;
}
.brokefemale path.arrow {
    fill: #000;
}
.wildfire path.arrow {
    fill: #fff;
}
.ourapp path.arrow {
    fill: #fff;
}
.biomedical path.arrow {
    fill: #fff;
}
.foodly path.arrow {
    fill: #fff;
}
.hero-section.onscreen .arrow-div {
    transform: translateY(0px);
    opacity: 1;
}
.arrow-div {
    opacity: 0;
    transition: 0.4s ease-out all;
    width: 16px;
    height: 18px;
    position: absolute;
    left: 50%;
    will-change: transform, opacity;
    -webkit-perspective: 1000;
    transform-style: preserve-3d;
    -webkit-backface-visibility: hidden;
    margin-left: -8px;
    display: block;
    transform: translateY(60px);
    bottom: calc(10vh);
    z-index: 10000;
}
#story.encrypto .hero-section > .section-content > .big-title > .accent {
    color: #7e9bca;
}
#story.wildfire .hero-section > .section-content > .big-title > .accent {
    color: #ed373a;
}
#story.foodly .hero-section > .section-content > .big-title > .accent {
    color: #65A87D;
}
#story.brokefemale .hero-section > .section-content > .big-title > .accent {
    color: #587790;
}
section {
    display: block;
    position: relative;
    -webkit-backface-visibility: hidden;
    perspective: 1000;
    padding-top: 1px;
    overflow: hidden;
    transform: translateZ(0);
    z-index: 2;
}
#story > section.divide-section {
    position: absolute;
    width: 100%;
    height: 620px;
    opacity: 1;
    margin-top: -150px;
    will-change: transform;
    -webkit-perspective: 1000;
    transform-style: preserve-3d;
    transition: 1s ease-out transform;
    -webkit-backface-visibility: hidden;
    z-index: -1;
    background-size: cover;
    background-position: 50% 50%;
    padding: 0;
    border: none;
}
#story > section.divide-section:after {
    display: none;
}
#story.encrypto > section.divide-section#first-divide {
    background-image: url('../img/assets/encrypto/inner/image-one.jpg');
}
#story.encrypto > section.divide-section#second-divide {
    background-image: url('../img/assets/encrypto/inner/image-two.jpg');
}
#story.encrypto > section.divide-section#third-divide {
    background-image: url('../img/assets/encrypto/inner/image-three.jpg');
}
#story.encrypto > section.divide-section#fourth-divide {
    background-image: url('../img/assets/encrypto/inner/image-four.jpg');
}
#story.brokefemale > section.divide-section#first-divide {
    background-image: url('../img/assets/brokefemale/inner/image-one.jpg');
}
#story.brokefemale > section.divide-section#second-divide {
    background-image: url('../img/assets/brokefemale/inner/image-two.jpg');
}
#story.brokefemale > section.divide-section#third-divide {
    background-image: url('../img/assets/brokefemale/inner/image-three.jpg');
}
#story.brokefemale > section.divide-section#fourth-divide {
    background-image: url('../img/assets/brokefemale/inner/image-four.jpg');
}
#story.wildfire > section.divide-section#first-divide {
    background-image: url('../img/assets/wildfire/inner/image-one.jpg');
}
#story.wildfire > section.divide-section#second-divide {
    background-image: url('../img/assets/wildfire/inner/image-two.jpg');
}
#story.wildfire > section.divide-section#third-divide {
    background-image: url('../img/assets/wildfire/inner/image-three.jpg');
}
#story.wildfire > section.divide-section#fourth-divide {
    background-image: url('../img/assets/wildfire/inner/image-four.jpg');
}
#story.ourapp > section.divide-section#first-divide {
    background-image: url('../img/assets/ourapp/inner/image-one.jpg');
}
#story.ourapp > section.divide-section#second-divide {
    background-image: url('../img/assets/ourapp/inner/image-two.jpg');
}
#story.ourapp > section.divide-section#third-divide {
    background-image: url('../img/assets/ourapp/inner/image-three.jpg');
}
#story.ourapp > section.divide-section#fourth-divide {
    background-image: url('../img/assets/ourapp/inner/image-four.jpg');
}
#story.biomedical > section.divide-section#first-divide {
    background-image: url('../img/assets/biomedical/inner/image-one.jpg');
}
#story.biomedical > section.divide-section#second-divide {
    background-image: url('../img/assets/biomedical/inner/image-two.jpg');
}
#story.biomedical > section.divide-section#third-divide {
    background-image: url('../img/assets/biomedical/inner/image-three.jpg');
}
#story.biomedical > section.divide-section#fourth-divide {
    background-image: url('../img/assets/biomedical/inner/image-four.jpg');
}
#story.foodly > section.divide-section#first-divide {
    background-image: url('../img/assets/foodly/inner/image-one.jpg');
}
#story.foodly > section.divide-section#second-divide {
    background-image: url('../img/assets/foodly/inner/image-two.jpg');
}
#story.foodly > section.divide-section#third-divide {
    background-image: url('../img/assets/foodly/inner/image-three.jpg');
}
#story.foodly > section.divide-section#fourth-divide {
    background-image: url('../img/assets/foodly/inner/image-four.jpg');
}
section.hero-section {
    opacity: 1;
}
.section-content {
    z-index: 3;
    position: relative;
    padding: 80px;
}
.hero-section > .section-content >.opening-p {
    font-size: 20px;
    /* font-family: "Slate W01 Light"; */
    will-change: transform, opacity;
    line-height: 1.611;
    font-weight: 300;
    margin: 0 auto;
    opacity: 0;
    transition: 0.5s ease-out all;
    text-align: center;
    transform: translateY(50px);
    max-width: 620px;
    padding: 40px;
    margin-top: 0px;
    padding-top: 0px;
    margin-bottom: 120px;
}
.encrypto .hero-section > .section-content >.opening-p {
    color: rgb(255, 255, 255);
}
.brokefemale .hero-section > .section-content >.opening-p {
    color: #333;
}
.wildfire .hero-section > .section-content >.opening-p {
    color: rgb(255, 255, 255);
}
.ourapp .hero-section > .section-content >.opening-p {
    color: #fff;
}
.biomedical .hero-section > .section-content >.opening-p {
    color: #fff;
}
.foodly .hero-section > .section-content >.opening-p {
    color: #BABABB;
}
.hero-section.onscreen > .section-content >.opening-p {
    opacity: 1;
    transform: translateY(0);
}
.hero-section > .section-content > .design-preview {
    display: block;
    background-image: url(../img/encrypto/web_page1@2x.jpg);
    background-size: cover;
    margin: 0 auto;
    max-width: 1180px;
    height: 700px;
}
#story > #brief-section {
    padding: 1px;
    margin-top: 0px;
}
#story .second-nav.afloat {
    position: fixed;
    width: 100%;
    max-width: none;
    will-change: transform;
    -webkit-perspective: 1000;
    transform-style: preserve-3d;
    transition: 1s ease-out transform;
    -webkit-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    -moz-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    -o-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    -webkit-backface-visibility: hidden;
    top: -42px;
    opacity: 0;
    z-index: 10000;
    transition: 0.6s ease all;
    padding: 4px 0 0 0;
}
#story.encrypto .second-nav.afloat {
    border-bottom: 1px solid #1D1C1E;
    background-color: #101013;
}
#story.brokefemale .second-nav.afloat {
    border-bottom: 1px solid #E5e5e5;
    background-color: #fff;
}
#story.wildfire .second-nav.afloat {
    border-bottom: 1px solid #161417;
    background-color: #0e0d0f;
}
#story.ourapp .second-nav.afloat {
    border-bottom: 1px solid #E5e5e5;
    background-color: #fff;
}
#story.biomedical .second-nav.afloat {
    border-bottom: 1px solid #E5e5e5;
    background-color: #fff;
}
#story.foodly .second-nav.afloat {
    border-bottom: 1px solid #1C1C1E;
    background-color: #1F1F21;
}
.scrollmagic-pin-spacer {
    position: absolute;
    left: 0 !important;
    margin-left: 0 !important;
}
#story .second-nav .second-nav-list {
    max-width: 1180px;
    margin: 0 auto;
    padding: 5px 0 12px 0;
    font-weight: 500;
    text-align: center;
    background-color: inherit;
}
#story .second-nav .second-nav-list a {
    position: relative;
    z-index: 2;
    display: inline-block;
}
#story .second-nav .second-nav-list li {
    font-size: 11px;
    position: relative;
    /* font-family: 'Proxima N W01 Reg'; */
    will-change: color;
    transition: 0.2s color ease-in;
    text-transform: uppercase;
    text-align: left;
    display: inline-block;
    letter-spacing: 1.2px;
    margin: 0 60px;
    font-weight: 500;
}
#story.encrypto .second-nav .second-nav-list li {
    color: #444;
}
#story.brokefemale .second-nav .second-nav-list li {
    color: #999;
}
#story.wildfire .second-nav .second-nav-list li {
    color: #444;
}
#story.ourapp .second-nav .second-nav-list li {
    color: #DADADA;
}
#story.biomedical .second-nav .second-nav-list li {
    color: #999;
}
#story.foodly .second-nav .second-nav-list li {
    color: #444;
}
#story.encrypto .second-nav .second-nav-list a.active li {
    color: #FFF;
    font-weight: 500;
}
#story.brokefemale .second-nav .second-nav-list a.active li {
    color: #000;
    font-weight: 500;
}
#story.wildfire .second-nav .second-nav-list a.active li {
    color: #FFF;
    font-weight: 500;
}
#story.ourapp .second-nav .second-nav-list a.active li {
    color: #000;
    font-weight: 500;
}
#story.biomedical .second-nav .second-nav-list a.active li {
    color: #000;
    font-weight: 500;
}
#story.foodly .second-nav .second-nav-list a.active li {
    color: #FFF;
    font-weight: 500;
}
#story > #brief-section .info-box {
    transition: 1s ease opacity;
    opacity: 0;
}
#story > #brief-section > * {
    will-change: opacity;
    transition: 1s ease opacity;
}
#story > #brief-section .section-title {
    opacity: 0;
    transition-delay: 0;
}
#story > #brief-section .section-description {
    opacity: 0;
    transition-delay: 0.25;
}
#story > #brief-section.active .section-description {
    opacity: 1;
}
#story > #brief-section.active .section-title {
    opacity: 1;
}
#story > #brief-section.active .info-box {
    transition: 1s ease opacity;
    will-change: opacity;
    -webkit-perspective: 1000;
    transform-style: preserve-3d;
    -webkit-backface-visibility: hidden;
    opacity: 1;
}
#story > #brief-section .info-box:nth-child(1) {
    transition-delay: 0.50s;
}
#story > #brief-section .info-box:nth-child(2) {
    transition-delay: 0.65s;
}
#story > #brief-section .info-box:nth-child(3) {
    transition-delay: 0.80s;
}
#story > #brief-section .info-box:nth-child(4) {
    transition-delay: 0.95s;
}
#story > section.has-intro > * {
    transition: 1s ease opacity;
    will-change: opacity, transform;
    -webkit-perspective: 1000;
    transform-style: preserve-3d;
    -webkit-backface-visibility: hidden;
}
#story > section.has-special-intro > * {
    transition: 1s ease opacity;
    will-change: opacity, transform;
    -webkit-perspective: 1000;
    transform-style: preserve-3d;
    -webkit-backface-visibility: hidden;
}
#story > section.has-intro > .section-title {
    transition-delay: 0s;
}
#story > section.has-intro > .section-description {
    transition-delay: 0.2s;
}
#story > section.active:after {
    transform: translateY(0);
}
#story > section.has-intro > *:last-child {
    transition: 1s ease opacity, 1.5s ease transform;
    transform: translateY(40px);
    transition-delay: 0.4s;
}
#story > section.has-intro > * {
    opacity: 0;
}
#story > section.has-intro.active > * {
    opacity: 1;
    transform: translateY(0);
}
section > .section-title {
    font-weight: 100;
    /* font-family: 'Proxima N W01 Thin Reg'; */
    line-height: 0.5;
    text-align: center;
    margin-top: 150px;
    font-size: 70px;
    position: relative;
    letter-spacing: -0.8px;
}
#story.intro section > .section-title {
    color: rgb(255, 255, 255);
}
#story.encrypto section > .section-title {
    color: rgb(255, 255, 255);
}
#story.brokefemale section > .section-title {
    color: #000000;
}
#story.wildfire section > .section-title {
    color: rgb(255, 255, 255);
}
#story.biomedical section > .section-title {
    color: #333;
}
#story.ourapp section > .section-title {
    color: #000;
}
section > .section-title:after {
    content: "";
    position: absolute;
    display: block;
    width: 32px;
    height: 1px;
    left: 50%;
    margin-left: -16px;
    bottom: -50px;
}
#story.encrypto .section-title:after {
    background-color: #7E9BCA;
}
#story.brokefemale .section-title:after {
    background-color: #59778f;
}
#story.wildfire .section-title:after {
    background-color: #ec363a;
}
#story.biomedical .section-title:after {
    background-color: #1ebe66;
}
#story.ourapp .section-title:after {
    background-color: #4074b4;
}
#story.foodly .section-title:after {
    background-color: #67A77E;
}
section > .section-description {
    font-weight: 300;
    width: 780px;
    margin: 0 auto;
    font-size: 19px;
    /* font-family: "Slate W01 Light"; */
    line-height: 1.6;
    text-align: center;
    margin-bottom: 100px;
    margin-top: 90px;
    letter-spacing: 0;
}
#story.encrypto section > .section-description {
    color: #D0D0D0;
}
#story.brokefemale section > .section-description {
    color: #444444;
}
#story.wildfire section > .section-description {
    color: #D0D0D0;
}
#story.ourapp section > .section-description {
    color: #333;
}
#story.biomedical section > .section-description {
    color: #333;
}
#story.foodly section > .section-description {
    color: #BABABB;
}
#story > #brief-section > .section-title {
    font-weight: 100;
    /* font-family: 'Proxima N W01 Thin Reg'; */
    line-height: 0.5;
    text-align: center;
    margin-top: 150px;
    font-size: 70px;
    position: relative;
    letter-spacing: -0.8px;
}
#story > #brief-section > .section-description {
    font-weight: 300;
    width: 880px;
    margin: 0 auto;
    font-size: 19px;
    /* font-family: "Slate W01 Light"; */
    line-height: 1.6;
    text-align: center;
    margin-bottom: 200px;
    margin-top: 80px;
    letter-spacing: 0.34px;
}
#story > #brief-section > .info-panel {
    display: grid;
    padding: 0;
    border: 0;
    max-width: 1270px;
    margin: 50px auto;
    grid-template-columns: auto auto auto auto;
}
#story > #brief-section > .info-panel > .info-box {
    color: #fff;
    display: inline-block;
    border: 0;
    margin: 0px 75px 0 75px;
    position: relative;
    background-color: rgab(0, 0, 0, 0.05);
    text-align: left;
}
#story.encrypto > #brief-section > .info-panel > .info-box {
    color: #fff;
}
#story.brokefemale > #brief-section > .info-panel > .info-box {
    color: #000;
}
#story.wildfire > #brief-section > .info-panel > .info-box {
    color: #fff;
}
#story.biomedical > #brief-section > .info-panel > .info-box {
    color: #333;
}
#story.ourapp > #brief-section > .info-panel > .info-box {
    color: #333;
}
#story.foodly > #brief-section > .info-panel > .info-box {
    color: #fff;
}
#story > #brief-section > .info-panel > .info-box:before {
    width: 1px;
    height: 40px;
    content: "";
    position: absolute;
    left: -75px;
    top: 30px;
}
#story.encrypto > #brief-section > .info-panel > .info-box:before {
    background-color: #1D1C1E;
}
#story.brokefemale > #brief-section > .info-panel > .info-box:before {
    background-color: #e5e5e5;
}
#story.wildfire > #brief-section > .info-panel > .info-box:before {
    background-color: #1D1C1E;
}
#story.ourapp > #brief-section > .info-panel > .info-box:before {
    background-color: #e5e5e5;
}
#story.biomedical > #brief-section > .info-panel > .info-box:before {
    background-color: #e5e5e5;
}
#story.biomedical > #brief-section > .info-panel > .info-box:before {
    background-color: #E5E5E5;
}
#story > #brief-section > .info-panel > .info-box:first-child:before {
    display: none;
}
#story > #brief-section > .info-panel > .info-box .info-box-label {
    font-size: 13px;
    /* font-family: "Slate W01 Bk"; */
    font-weight: 500;
    margin-bottom: 11px;
    display: inline-block;
    text-transform: uppercase;
    letter-spacing: 1.25px;
    margin-left: 2px;
}
#story.encrypto > #brief-section > .info-panel > .info-box .info-box-label {
    color: #7e9bca;
}
#story.brokefemale > #brief-section > .info-panel > .info-box .info-box-label {
    color: #59778f;
}
#story.wildfire > #brief-section > .info-panel > .info-box .info-box-label {
    color: #ec363a;
}
#story.biomedical > #brief-section > .info-panel > .info-box .info-box-label {
    color: #1ebe66;
}
#story.ourapp > #brief-section > .info-panel > .info-box .info-box-label {
    color: #4074b4;
}
#story.foodly > #brief-section > .info-panel > .info-box .info-box-label {
    color: #67A77E;
}
#story > section {
    padding-bottom: 100px;
    position: relative;
    text-align: center;
    padding-top: 1px;
    margin-top: 470px;
}
#story.encrypto > section {
    background-color: #141416;
}
#story.brokefemale > section {
    background-color: #FFF;
    color: #000;
}
#story.wildfire > section {
    background-color: #161417;
}
#story.ourapp > section {
    background-color: #FFF;
    color: #333;
}
#story.biomedical > section {
    background-color: #FFF;
    color: #333;
}
#story.foodly > section {
    background-color: #1F1F21;
    color: #BABABB;
}
#story > section:after {
    position: absolute;
    transform: translateY(100%);
    content: "";
    width: 100%;
    transition: 0.8s transform ease;
    height: 490px;
    left: 0;
    z-index: -1;
    bottom: 0;
}
#story.encrypto > section:after {
    border-top: 1px solid rgba(0, 0, 0, 0.2);
    background-color: #111113;
}
#story.brokefemale > section:after {
    border-top: 1px solid rgba(0, 0, 0, 0.03);
    background-color: #FEFEFE;
}
#story.wildfire > section:after {
    border-top: 1px solid #09090a;
    background-color: #0e0d0f;
}
#story.ourapp > section:after {
    border-top: 1px solid rgba(0, 0, 0, 0.03);
    background-color: #FEFEFE;
}
#story.biomedical > section:after {
    border-top: 1px solid rgba(0, 0, 0, 0.03);
    background-color: #FEFEFE;
}
#story.foodly > section:after {
    border-top: 1px solid rgba(0, 0, 0, 0.03);
    background-color: #1C1C1E;
}
#story > section.divide-section:after {
    display: none;
}
#story > section:first-child {
    padding-bottom: 0;
    border-bottom: none;
    margin-top: 0;
}
#story.encrypto > section:first-child {
    background-color: #0A0A0C;
}
#story.brokefemale > section:first-child {
    background-color: #FFF;
}
#story.wildfire > section:first-child {
    background-color: #050505;
}
#story.ourapp > section:first-child {
    background-color: #4074b4;
}
#story.biomedical > section:first-child {
    background-color: #171416;
}
#story.foodly > section:first-child {
    background-color: #0E0F0A;
}
#story > #brief-section:after {
    height: 220px;
}
#story > #design-strategy-section > .project-overview-image {
    width: 900px;
    height: 559px;
    margin: 0 auto;
    background-size: cover;
}
#story.encrypto > #design-strategy-section > .project-overview-image {
    background-image: url(../img/assets/encrypto/inner/strategy.jpg);
}
#story.brokefemale > #design-strategy-section > .project-overview-image {
    background-image: url(../img/assets/brokefemale/inner/strategy.jpg);
}
#story.biomedical > #design-strategy-section > .project-overview-image {
    background-image: url(../img/assets/biomedical/inner/strategy.jpg);
}
#story.wildfire > #design-strategy-section > .project-overview-image {
    background-image: url(../img/assets/wildfire/inner/strategy.jpg);
}
#story.ourapp > #design-strategy-section > .project-overview-image {
    background-image: url(../img/assets/ourapp/inner/strategy.jpg);
}
#story.foodly > #design-strategy-section > .project-overview-image {
    background-image: url(../img/assets/foodly/inner/strategy.jpg);
}
#story > #design-strategy-section:after {
    bottom: 0px;
    height: 455px;
}
#story > #brief-section > .info-panel > .info-box .info-box-value-label {
    font-size: 31px;
    font-weight: 300;
    margin-top: 0;
    display: block;
    /* font-family: Slate W01 Light; */
}
#story > #typography-section > .type-poster {
    margin: 0 auto;
    display: inline-block;
    color: #fff;
}
#story > #typography-section {
    padding-bottom: 90px;
}
#story > #typography-section:after {} #story > #typography-section > .section-description {
    margin-bottom: 170px;
}
#story > #typography-section > .type-poster > div {
    display: inline-block;
}
#story > #typography-section > .type-poster > .left-font {
    padding-right: 80px;
    padding-bottom: 15px;
}
#story.encrypto > #typography-section > .type-poster > .left-font {
    border-right: 1px solid #1D1C1E;
}
#story.brokefemale > #typography-section > .type-poster > .left-font {
    border-right: 1px solid #e5e5e5;
}
#story.wildfire > #typography-section > .type-poster > .left-font {
    border-right: 1px solid #1D1C1E;
}
#story.biomedical > #typography-section > .type-poster > .left-font {
    border-right: 1px solid #e5e5e5;
}
#story.ourapp > #typography-section > .type-poster > .left-font {
    border-right: 1px solid #e5e5e5;
}
#story.foodly > #typography-section > .type-poster > .left-font {
    border-right: 1px solid #272729;
}
#story > #typography-section > .type-poster > .right-font {
    padding-left: 80px;
}
#story > #typography-section > .type-poster .font-title {
    font-size: 32px;
    /* font-family: "Slate W01 Light"; */
    font-weight: 100;
    text-align: center;
    margin-bottom: 0;
    margin-top: 10px;
}
#story.encrypto > #typography-section > .type-poster .font-title {
    color: rgb(255, 255, 255);
}
#story.brokefemale > #typography-section > .type-poster .font-title {
    color: #000;
}
#story.wildfire > #typography-section > .type-poster .font-title {
    color: #FFF;
}
#story.biomedical > #typography-section > .type-poster .font-title {
    color: #000;
}
#story.ourapp > #typography-section > .type-poster .font-title {
    color: #000;
}
#story.foodly > #typography-section > .type-poster .font-title {
    color: #FFF;
}
#story > #typography-section > .type-poster .font-weight {
    text-transform: uppercase;
    font-size: 13px;
    /* font-family: "Slate W01 Bk"; */
    font-weight: 500;
    letter-spacing: 1.25px;
    margin-bottom: 18px;
}
#story.biomedical > #typography-section > .type-poster .font-weight {
    color: #1ebe66;
}
#story.encrypto > #typography-section > .type-poster .font-weight {
    color: #7E9BCA;
}
#story.wildfire > #typography-section > .type-poster .font-weight {
    color: #ec363a;
}
#story.brokefemale > #typography-section > .type-poster .font-weight {
    color: #587790;
}
#story.foodly > #typography-section > .type-poster .font-weight {
    color: #1ebe66;
}
#story.ourapp > #typography-section > .type-poster .font-weight {
    color: #3D73B6;
}
#story > #typography-section > .type-poster .font-specimen.raleway-font {
    width: 300px;
    height: 195px;
    background-size: cover;
}
#story > #typography-section > .type-poster .font-specimen.open-sans-font {
    background-size: cover;
    width: 300px;
    height: 195px;
}
#story.encrypto > #typography-section > .type-poster .font-specimen.raleway-font {
    background-image: url(../img/assets/encrypto/inner/left-specimen.jpg);
}
#story.encrypto > #typography-section > .type-poster .font-specimen.open-sans-font {
    background-image: url(../img/assets/encrypto/inner/right-specimen.jpg);
}
#story.brokefemale > #typography-section > .type-poster .font-specimen.raleway-font {
    background-image: url(../img/assets/brokefemale/inner/left-specimen.jpg);
}
#story.brokefemale > #typography-section > .type-poster .font-specimen.open-sans-font {
    background-image: url(../img/assets/brokefemale/inner/right-specimen.jpg);
}
#story.foodly > #typography-section > .type-poster .font-specimen.raleway-font {
    background-image: url(../img/assets/foodly/inner/left-specimen.jpg);
}
#story.foodly > #typography-section > .type-poster .font-specimen.open-sans-font {
    background-image: url(../img/assets/foodly/inner/right-specimen.jpg);
}
#story.wildfire > #typography-section > .type-poster .font-specimen.raleway-font {
    background-image: url(../img/assets/wildfire/inner/left-specimen.jpg);
}
#story.wildfire > #typography-section > .type-poster .font-specimen.open-sans-font {
    background-image: url(../img/assets/wildfire/inner/right-specimen.jpg);
}
#story.ourapp > #typography-section > .type-poster .font-specimen.raleway-font {
    background-image: url(../img/assets/ourapp/inner/left-specimen.jpg);
}
#story.ourapp > #typography-section > .type-poster .font-specimen.open-sans-font {
    background-image: url(../img/assets/ourapp/inner/right-specimen.jpg);
}
#story.biomedical > #typography-section > .type-poster .font-specimen.raleway-font {
    background-image: url(../img/assets/biomedical/inner/left-specimen.jpg);
}
#story.biomedical > #typography-section > .type-poster .font-specimen.open-sans-font {
    background-image: url(../img/assets/biomedical/inner/right-specimen.jpg);
}
#story > #palette-section {
    padding-bottom: 90px;
}
#story > #palette-section > .color-panel {
    max-width: 1180px;
    margin: 0 auto;
    margin-top: 192px;
    padding: 0;
}
#story > #palette-section > .color-panel > .color-box {
    display: inline-block;
    padding: 0 30px;
}
#story > #palette-section:after {
    height: 349px;
}
#story > #palette-section > .color-panel > .color-box > p {
    font-size: 13px;
    /* font-family: "Slate W01 Bk"; */
    text-align: center;
    font-weight: 4000;
    letter-spacing: 1.25px;
    text-transform: uppercase;
    margin-top: 20px;
}
#story.encrypto > #palette-section > .color-panel > .color-box > p {
    color: #555;
}
#story.brokefemale > #palette-section > .color-panel > .color-box > p {
    color: #000;
}
#story.wildfire > #palette-section > .color-panel > .color-box > p {
    color: #555;
}
#story.biomedical > #palette-section > .color-panel > .color-box > p {
    color: #333;
}
#story.ourapp > #palette-section > .color-panel > .color-box > p {
    color: #333;
}
#story.foodly > #palette-section > .color-panel > .color-box > p {
    color: #BABABB;
}
#story > #palette-section > .color-panel > .color-box .color-spot {
    width: 110px;
    height: 110px;
    border-radius: 1000px;
}
#story.encrypto > #palette-section > .color-panel > .color-box .color-spot {
    border: 1px solid #1C1C1E;
}
#story.brokefemale > #palette-section > .color-panel > .color-box .color-spot {
    border: 1px solid #E5E5E5;
}
#story.wildfire > #palette-section > .color-panel > .color-box .color-spot {
    border: 1px solid #1C1C1E;
}
#story.ourapp > #palette-section > .color-panel > .color-box .color-spot {
    border: 1px solid #E5E5E5;
}
#story.biomedical > #palette-section > .color-panel > .color-box .color-spot {
    border: 1px solid #E5E5E5;
}
#story.foodly > #palette-section > .color-panel > .color-box .color-spot {
    border: 1px solid #29272D;
}
#story > #designs-section > .design-gallery {} #story > #designs-section > .section-description {
    margin-bottom: 100px;
}
#story > #designs-section > .section-description > em {
    font-size: 16px;
    line-height: 50px;
}
#story > #designs-section {
    padding-top: 10px;
}
#story > #designs-section:after {
    display: none;
}
#story > #designs-section > .design-gallery > .web-page {
    margin: 0 40px 40px 40px;
}
#story > #designs-section > .design-gallery > .web-page > .design-info {
    color: #555;
    font-size: 13px;
    /* font-family: "Source Sans Pro"; */
    text-align: center;
    font-weight: 500;
    letter-spacing: 1.25px;
    text-transform: uppercase;
    margin-bottom: 30px;
}
#story.encrypto > #designs-section > .design-gallery > .web-page > .home-page {
    width: 100%;
    border-radius: 16px;
    box-shadow: 0px 0px 100px 0px rgba(0, 0, 0, 0.4);
    max-width: 1360px;
}
#story.brokefemale > #designs-section > .design-gallery > .web-page > .home-page {
    width: 100%;
    box-shadow: 0px 0px 50px 0px rgba(0, 0, 0, 0.04);
    max-width: 1360px;
}
#story.wildfire > #designs-section > .design-gallery > .web-page > .home-page {
    width: 100%;
    border-radius: 6px;
    border: 1px solid rgba(255, 255, 255, 0.02);
    max-width: 1360px;
}
#story.biomedical > #designs-section > .design-gallery > .web-page > .home-page {
    width: 100%;
    box-shadow: 0px 0px 50px 0px rgba(0, 0, 0, 0.1);
    max-width: 1360px;
}
#story.ourapp > #designs-section > .design-gallery > .web-page > .home-page {
    width: 100%;
    box-shadow: none;
    max-width: 1360px;
}
#story.foodly > #designs-section > .design-gallery > .web-page > .home-page {
    width: 100%;
    border-radius: 6px;
    border: 1px solid rgba(255, 255, 255, 0.02);
    box-sizing: border-box;
    max-width: 1360px;
}
.light-background .desanddev {
    color: rgba(0, 0, 0, 0.15);
}
.desanddev {
    font-size: 11px;
    letter-spacing: 1px;
    color: rgba(255, 255, 255, 0.25);
    display: block;
    text-align: center;
    width: 260px;
    -webkit-perspective: 1000;
    transform-style: preserve-3d;
    -webkit-backface-visibility: hidden;
    will-change: transform, opacity;
    transition: 1.2s transform ease;
    position: fixed;
    left: 50%;
    margin-left: -130px;
    top: 31px;
    /* font-family: 'Slate W01 Light'; */
}
@media (max-width: 1280px) {
    .logo {}
}
@media (max-width: 1180px) {
    #card-stack > #ourapp > .wrapper #botscreen,
    #card-stack > #ourapp > .wrapper #midscreen,
    #card-stack > #ourapp > .wrapper #topscreen {
        top: -30px;
        left: 30px;
    }
}
@media (max-width: 1200px) {
    #slide-descriptions {
        position: absolute;
        left: 50%;
        margin-left: -150px;
    }
    .close-button.onscreen {
        position: fixed;
        margin-left: 0;
        top: 40px;
    }
    .section-description {
        max-width: 600px;
    }
    .hero-section.onscreen > .section-content >.opening-p {
        max-width: 600px;
        margin: 0 auto;
    }
    .close-button.onscreen.atop {
        transform: translateY(45px) !important;
    }
    #card-content-stack .card-content > .see-more > .card-button {
        transform: translateX(50px);
        opacity: 0;
    }
    .hero-section > .section-content > .big-title {
      font-size: 70px;
        line-height: 70px;
        margin-top: 26vh;
    }
    #story > #brief-section > .section-description {
        width: auto;
        padding: 0 40px;
        font-size: 18px;
        margin-bottom: 100px;
    }
    #story > #design-strategy-section > .project-overview-image {
        width: auto;
        background-size: contain;
        background-repeat: no-repeat;
        height: 56vw;
        margin: 0 auto;
        background-position: center;
    }
    .hero-section > .section-content >.opening-p {
        width: 100%;
        font-size: 18px;
        left: 0;
        margin: 0 auto;
        padding: 0;
        transform: translateY(110px);
        opacity: 0;
        max-width: 600px;
    }
    #story > section.divide-section {
        height: 400px;
        background-position: 50% 50%;
    }
    .hero-section.onscreen .arrow-div {
        bottom: -36px;
    }
    .hero-section .arrow-div {
        bottom: -126px;
        transform: translateY(120px);
        opacity: 0;
    }
    #story .second-nav .second-nav-list a {
        position: absolute;
        left: 50%;
        margin-left: -150px;
        width: 300px;
        opacity: 0;
        background-color: inherit;
    }
    #story .second-nav .second-nav-list a.active {
        opacity: 1;
    }
    #story > #brief-section .section-title {
        font-size: 50px;
        padding: 0 40px;
        line-height: 54px;
        margin-top: 90px;
    }
    #story .second-nav.afloat {
        height: 38px;
    }
    .section-content {
        padding: 40px;
    }
    #story section > .section-description {
        width: auto;
        padding: 0 80px;
    }
    #story > #brief-section:after {
        height: 470px;
    }
    #story > #brief-section > .info-panel > .info-box {
        display: block;
        width: 100%;
        margin: 0;
    }
    #story > #brief-section > .info-panel > .info-box p {
        width: 100%;
        text-align: center;
    }
    #story > #palette-section:after {
        height: 280px;
    }
    #story > #palette-section > .color-panel > .color-box > p {
        display: none;
    }
    #story > #palette-section > .color-panel > .color-box {
        padding: 0;
        margin-left: -30px;
        border: none;
    }
    #story > #palette-section > .color-panel > .color-box div {
        border: none;
    }
    #story > #designs-section > .design-gallery > .web-page {
        margin: 0;
    }
    #story > #designs-section > .design-gallery > .web-page img {
        border-radius: 0 !important;
        margin: 0 !important;
    }
    section > .section-title {
        font-size: 50px;
        padding: 0 40px;
        line-height: 54px;
        margin-top: 90px;
    }
    section > .section-description {
        padding: 0 40px;
        font-size: 18px;
        margin-bottom: 100px;
    }
    #story > section {
        margin-top: 250px;
        padding-bottom: 80px;
    }
    #story > #typography-section > .type-poster > div {
        display: block;
        margin: 0 auto;
        float: none;
        padding: 0 !important;
        border-right: none !important;
    }
    #story > #typography-section > .type-poster > .left-font {
        margin-bottom: 50px;
        padding-bottom: 50px !important;
    }
    #story > #typography-section:after {
        height: 823px;
    }
    #story > #designs-section {
        padding-bottom: 0;
    }
    #story > #palette-section > .color-panel > .color-box .color-spot {
        border: none !important;
        width: 100px;
        height: 100px;
    }
    #slide-descriptions {
        transform: translateY(140px) translateX(0px);
    }
    #slide-descriptions.onscreen {
        transform: translateY(0px) translateX(0px);
    }
    #card-stack > #ourapp > .wrapper #botscreen,
    #card-stack > #ourapp > .wrapper #midscreen,
    #card-stack > #ourapp > .wrapper #topscreen {
        top: -30px;
        left: -60px;
    }
}
@media (max-width: 860px) {
    .logo.center {} #main-nav {
        padding: 0 20px 0 20px;
    }
    .card-content {
        position: absolute;
        width: 100%;
        top: 50%;
        left: 0;
        height: 250px;
        z-index: 100000;
        margin-top: -100px;
        text-align: center;
    }
    .card-content > .see-more > .card-button {
        margin: 0 auto;
    }
    .card-content > .see-more {
        margin: 0 auto;
    }
    .card-content > .card-description {
        padding: 0 74px;
        line-height: 30px;
        transform: translateX(140px);
        opacity: 0;
    }
    #card-content-stack .card-content > .card-title {
        font-size: 64px;
        margin-bottom: 58px;
    }
    #card-stack > .card > .wrapper > div {
        left: -10%;
    }
    #card-stack > .card > .wrapper#intro-wrapper > div {
        left: 50%;
    }
    #story > #palette-section > .color-panel {
        margin-top: 160px;
    }
}
@media (max-width: 780px) {
    #card-stack > .card > .wrapper#intro-wrapper div#middle-hero {
        width: 100%;
        background-image: url(../img/assets/intro/hero2@2x.png);
        left: 0;
        height: 250px;
        background-position: 50% 50%;
        top: 50%;
        margin-top: -170px;
        left: 0;
        margin-left: 0;
    }
    h4.nav-link.contact {
        bottom: 40px;
        left: 0;
        width: 100%;
    }
}
@media (max-width: 740px) {
    #card-stack > #ourapp > .wrapper #botscreen,
    #card-stack > #ourapp > .wrapper #midscreen,
    #card-stack > #ourapp > .wrapper #topscreen {
        top: -30px;
        left: 120px;
    }
    #card-stack > #brokefemale > .wrapper #woman {
        top: 0px;
        left: 120px;
    }
    #card-content-stack.onscreen .card-content > .card-title {
        font-size: 64px;
        transform: translateX(0px);
        opacity: 1;
        padding: 0;
        width: 100vw;
        margin-left: 0;
        left: 0;
    }
    #card-content-stack.onscreen .card-content#brokefemale-content > .card-title {
    line-height: 0;
    }
    #card-content-stack.onscreen .card-content#brokefemale-content {;
    }
    #card-content-stack .card-content > .card-title {
        font-size: 64px;
        transform: translateX(100px);
        opacity: 0;
    }
    #card-stack > .card > .wrapper > div {
        left: -40%;
    }
}
@media (max-width: 700px) {
    #card-stack > #ourapp > .wrapper #botscreen,
    #card-stack > #ourapp > .wrapper #midscreen,
    #card-stack > #ourapp > .wrapper #topscreen {
        top: -30px;
        left: -90px;
    }
    #card-stack > #brokefemale > .wrapper #woman {
        top: 0px;
        left: 70px;
    }
    .desanddev {
        display: none;
    }
}
@media (max-width: 630px) {
    #card-stack > #brokefemale > .wrapper #woman {
        top: 0px;
        left: 30px;
    }
}
@media (max-width: 590px) {
    #card-stack > #ourapp > .wrapper #botscreen,
    #card-stack > #ourapp > .wrapper #midscreen,
    #card-stack > #ourapp > .wrapper #topscreen {
        top: -30px;
        left: -50px;
    }
}
@media (max-width: 540px) {
    #card-stack > #brokefemale > .wrapper #woman {
        top: 0px;
        left: 190px;
    }

		.brokefemale .hero-section > .section-content > .big-title{
		    line-height: 1;
		    margin-top: 120px;
		}
    #card-stack > #ourapp > .wrapper #botscreen,
    #card-stack > #ourapp > .wrapper #midscreen,
    #card-stack > #ourapp > .wrapper #topscreen {
        top: -30px;
        left: 200px;
    }
    .card-content > .card-description {
        width: 260px;
        margin-left: auto;
        margin-right: auto;
    }
    .card-content {
        margin-top: -135px;
    }
    #card-stack > .card > .wrapper > div {
        left: -120%;
    }
}
@media (max-width: 540px) {} @media (max-width: 458px) {
    #card-stack > #brokefemale > .wrapper #woman {
        top: 0px;
        left: 60px;
    }
    #brokefemale-content {
    }
}
@media (max-width: 455px) {
}
@media (max-width: 472px) {
    #card-stack > #ourapp > .wrapper #botscreen,
    #card-stack > #ourapp > .wrapper #midscreen,
    #card-stack > #ourapp > .wrapper #topscreen {
        top: -30px;
        left: 100px;
    }
}

@media (max-width: 410px){

	#card-content-stack.onscreen .card-content#brokefemale-content > .card-title {
		line-height: 1.1;
		margin-top: -60px;
		margin-bottom: 25px;
	}
	#card-content-stack .card-content#brokefemale-content > .card-title {
		line-height: 1.1;
		margin-top: -60px;
		margin-bottom: 25px;
	}

	#card-content-stack.onscreen .card-content > .card-description{
		padding: 0;
	}
	.biomedical .hero-section > .section-content > .big-title{
	font-size: 60px;
	}
}
div.middle-hero {
    background-image: url(../img/assets/intro/hero@2x.png);
}
#story.encrypto > section.divide-section#first-divide {
    background-image: url('../img/assets/encrypto/inner/image-one@2x.jpg');
}
#story.encrypto > section.divide-section#second-divide {
    background-image: url('../img/assets/encrypto/inner/image-two@2x.jpg');
}
#story.encrypto > section.divide-section#third-divide {
    background-image: url('../img/assets/encrypto/inner/image-three@2x.jpg');
}
#story.encrypto > section.divide-section#fourth-divide {
    background-image: url('../img/assets/encrypto/inner/image-four@2x.jpg');
}
#story.encrypto > #design-strategy-section > .project-overview-image {
    background-image: url(../img/assets/encrypto/inner/strategy@2x.jpg);
}
#story.encrypto > #typography-section > .type-poster .font-specimen.raleway-font {
    background-image: url(../img/assets/encrypto/inner/left-specimen@2x.jpg);
}
#story.encrypto > #typography-section > .type-poster .font-specimen.open-sans-font {
    background-image: url(../img/assets/encrypto/inner/right-specimen@2x.jpg);
}
#story.brokefemale > section.divide-section#first-divide {
    background-image: url('../img/assets/brokefemale/inner/image-one@2x.jpg');
}
#story.brokefemale > section.divide-section#second-divide {
    background-image: url('../img/assets/brokefemale/inner/image-two@2x.jpg');
}
#story.brokefemale > section.divide-section#third-divide {
    background-image: url('../img/assets/brokefemale/inner/image-three@2x.jpg');
}
#story.brokefemale > section.divide-section#fourth-divide {
    background-image: url('../img/assets/brokefemale/inner/image-four@2x.jpg');
}
#story.brokefemale > #design-strategy-section > .project-overview-image {
    background-image: url(../img/assets/brokefemale/inner/strategy@2x.jpg);
}
#story.brokefemale > #typography-section > .type-poster .font-specimen.raleway-font {
    background-image: url(../img/assets/brokefemale/inner/left-specimen@2x.jpg);
}
#story.brokefemale > #typography-section > .type-poster .font-specimen.open-sans-font {
    background-image: url(../img/assets/brokefemale/inner/right-specimen@2x.jpg);
}
#story.foodly > section.divide-section#first-divide {
    background-image: url('../img/assets/foodly/inner/image-one@2x.jpg');
}
#story.foodly > section.divide-section#second-divide {
    background-image: url('../img/assets/foodly/inner/image-two@2x.jpg');
}
#story.foodly > section.divide-section#third-divide {
    background-image: url('../img/assets/foodly/inner/image-three@2x.jpg');
}
#story.foodly > section.divide-section#fourth-divide {
    background-image: url('../img/assets/foodly/inner/image-four@2x.jpg');
}
#story.foodly > #design-strategy-section > .project-overview-image {
    background-image: url(../img/assets/foodly/inner/strategy@2x.jpg);
}
#story.foodly > #typography-section > .type-poster .font-specimen.raleway-font {
    background-image: url(../img/assets/foodly/inner/left-specimen@2x.jpg);
}
#story.foodly > #typography-section > .type-poster .font-specimen.open-sans-font {
    background-image: url(../img/assets/foodly/inner/right-specimen@2x.jpg);
}
#story.wildfire > section.divide-section#first-divide {
    background-image: url('../img/assets/wildfire/inner/image-one@2x.jpg');
}
#story.wildfire > section.divide-section#second-divide {
    background-image: url('../img/assets/wildfire/inner/image-two@2x.jpg');
}
#story.wildfire > section.divide-section#third-divide {
    background-image: url('../img/assets/wildfire/inner/image-three@2x.jpg');
}
#story.wildfire > section.divide-section#fourth-divide {
    background-image: url('../img/assets/wildfire/inner/image-four@2x.jpg');
}
#story.wildfire > #design-strategy-section > .project-overview-image {
    background-image: url(../img/assets/wildfire/inner/strategy@2x.jpg);
}
#story.wildfire > #typography-section > .type-poster .font-specimen.raleway-font {
    background-image: url(../img/assets/wildfire/inner/left-specimen@2x.jpg);
}
#story.wildfire > #typography-section > .type-poster .font-specimen.open-sans-font {
    background-image: url(../img/assets/wildfire/inner/right-specimen@2x.jpg);
}
#story.biomedical > section.divide-section#first-divide {
    background-image: url('../img/assets/biomedical/inner/image-one@2x.jpg');
}
#story.biomedical > section.divide-section#second-divide {
    background-image: url('../img/assets/biomedical/inner/image-two@2x.jpg');
}
#story.biomedical > section.divide-section#third-divide {
    background-image: url('../img/assets/biomedical/inner/image-three@2x.jpg');
}
#story.biomedical > section.divide-section#fourth-divide {
    background-image: url('../img/assets/biomedical/inner/image-four@2x.jpg');
}
#story.biomedical > #design-strategy-section > .project-overview-image {
    background-image: url(../img/assets/biomedical/inner/strategy@2x.jpg);
}
#story.biomedical > #typography-section > .type-poster .font-specimen.raleway-font {
    background-image: url(../img/assets/biomedical/inner/left-specimen@2x.jpg);
}
#story.biomedical > #typography-section > .type-poster .font-specimen.open-sans-font {
    background-image: url(../img/assets/biomedical/inner/right-specimen@2x.jpg);
}
#story.ourapp > section.divide-section#first-divide {
    background-image: url('../img/assets/ourapp/inner/image-one@2x.jpg');
}
#story.ourapp > section.divide-section#second-divide {
    background-image: url('../img/assets/ourapp/inner/image-two@2x.jpg');
}
#story.ourapp > section.divide-section#third-divide {
    background-image: url('../img/assets/ourapp/inner/image-three@2x.jpg');
}
#story.ourapp > section.divide-section#fourth-divide {
    background-image: url('../img/assets/ourapp/inner/image-four@2x.jpg');
}
#story.ourapp > #design-strategy-section > .project-overview-image {
    background-image: url(../img/assets/ourapp/inner/strategy@2x.jpg);
    height: 668px;
    width: 770px;
    background-size: contain;
    background-repeat: no-repeat;
}
#story.ourapp > #typography-section > .type-poster .font-specimen.raleway-font {
    background-image: url(../img/assets/ourapp/inner/left-specimen@2x.jpg);
}
#story.ourapp > #typography-section > .type-poster .font-specimen.open-sans-font {
    background-image: url(../img/assets/ourapp/inner/right-specimen@2x.jpg);
}
#fa {
    background-image: url(../img/assets/intro/far@2x.png);
}
#furthe {
    background-image: url(../img/assets/intro/further@2x.png);
}
#wal {
    background-image: url(../img/assets/encrypto/wall@2x.jpg);
}
#lns {
    background-image: url(../img/assets/encrypto/lens@2x.png);
}
#noi {
    background-image: url(../img/assets/wildfire/background@2x.jpg);
}
#rdr {
    background-image: url(../img/assets/wildfire/biker@2x.png);
}
#rom {
    background-image: url(../img/assets/biomedical/room@2x.jpg);
}
#bby {
    background-image: url(../img/assets/biomedical/baby@2x.png);
}
#flr {
    background-image: url(../img/assets/foodly/floor@2x.jpg);
}
#plt {
    background-image: url(../img/assets/foodly/plate@2x.png);
}
.lbubble {
    background-image: url(../img/assets/brokefemale/lbubble@2x.png);
}
.sbubble {
    background-image: url(../img/assets/brokefemale/sbubble@2x.png);
}
#wmn {
    background-image: url(../img/assets/brokefemale/woman@2x.png);
}
#fbkg {
    background-image: url(../img/assets/ourapp/background@2x.jpg);
}
#tscreen {
    background-image: url(../img/assets/ourapp/topcard@2x.png);
}
#mscreen {
    background-image: url(../img/assets/ourapp/midcard@2x.png);
}
#bscreen {
    background-image: url(../img/assets/ourapp/botcard@2x.png);
}

.back-to-back {
    position: fixed;
    top: 10px;
    left: 10px;
    padding: 7px 13px;
    background-color: #1b1b1b;
    color: #fff;
    z-index: 1000000000;
    display: block;
    border-radius: 9px;
    cursor: pointer;
    text-decoration: none;
    letter-spacing: 0.4px;
    transition: 0.15s ease background-color;
    font-size: 13px;
    box-shadow: 0px 3px 2px rgba(0,0,0,0.2);
}

.back-to-back:hover { 
    background-color: #2a2a2a;
}

.back-to-back:active { 
    background-color: #3f3f3f;
}