.pill-button {
    font-weight: 600;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 46px;
    margin-top: 40px;
    padding: 0 23px;
    border-radius: 46px;
    border: 2px solid #f5dfd3;
    -webkit-transition: 300ms background cubic-bezier(0.4, 0, 0.6, 1);
    transition: 300ms background cubic-bezier(0.4, 0, 0.6, 1)
}

.pill-button .icon-copy {
    color: #f5dfd3;
    -webkit-transition: 300ms color cubic-bezier(0.4, 0, 0.6, 1);
    transition: 300ms color cubic-bezier(0.4, 0, 0.6, 1)
}

a.pill-button:hover,
button.pill-button:hover {
    background: #f5dfd3;
    -webkit-transition: 300ms background cubic-bezier(0.4, 0, 0.6, 1);
    transition: 300ms background cubic-bezier(0.4, 0, 0.6, 1)
}

a.pill-button:hover .icon-copy,
button.pill-button:hover .icon-copy {
    color: #000;
    text-decoration: none;
    -webkit-transition: 300ms color cubic-bezier(0.4, 0, 0.6, 1);
    transition: 300ms color cubic-bezier(0.4, 0, 0.6, 1)
}

.pill-button:focus {
    -webkit-box-shadow: 0 0 0 4px rgba(131, 192, 253, 0.5);
    box-shadow: 0 0 0 4px rgba(131, 192, 253, 0.5);
    outline: none
}

.pill-button:focus[data-focus-method="mouse"]:not(input):not(textarea):not(select),
.pill-button:focus[data-focus-method="touch"]:not(input):not(textarea):not(select) {
    -webkit-box-shadow: none;
    box-shadow: none
}

.hardware {
    position: relative;
    z-index: 1
}

.glass {
    position: relative
}

.glass::before,
.glass::after {
    display: block;
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1
}

.glass-frame {
    pointer-events: none
}

.glass-frame,
.glass-screen {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1
}

.manifesto-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.typography-overview-body-elevated .icon-playcircle,
.typography-overview-body-elevated.icon-playcircle::after {
    font-weight: 400
}

.texture-1 {
    color: #ea9b5a
}

@supports (-webkit-background-clip: text) {
    .texture-1 {
        background-repeat: no-repeat;
        background-image: url("copy_texture_1_large.jpg")
    }
    @media only screen and (max-width: 1068px) {
        .texture-1 {
            background-repeat: no-repeat;
            background-image: url("copy_texture_1_medium.jpg")
        }
    }
    @media only screen and (max-width: 735px) {
        .texture-1 {
            background-repeat: no-repeat;
            background-image: url("copy_texture_1_small.jpg")
        }
    }
}

.texture-2 {
    color: #d6785d
}

@supports (-webkit-background-clip: text) {
    .texture-2 {
        background-repeat: no-repeat;
        background-image: url("copy_texture_2_large.jpg")
    }
    @media only screen and (max-width: 1068px) {
        .texture-2 {
            background-repeat: no-repeat;
            background-image: url("copy_texture_2_medium.jpg")
        }
    }
    @media only screen and (max-width: 735px) {
        .texture-2 {
            background-repeat: no-repeat;
            background-image: url("copy_texture_2_small.jpg")
        }
    }
}

.texture-3 {
    color: #d6785d
}

@supports (-webkit-background-clip: text) {
    .texture-3 {
        background-repeat: no-repeat;
        background-image: url("copy_texture_3_large.jpg")
    }
    @media only screen and (max-width: 1068px) {
        .texture-3 {
            background-repeat: no-repeat;
            background-image: url("copy_texture_3_medium.jpg")
        }
    }
    @media only screen and (max-width: 735px) {
        .texture-3 {
            background-repeat: no-repeat;
            background-image: url("copy_texture_3_small.jpg")
        }
    }
}

.texture-4 {
    color: #e09663
}

@supports (-webkit-background-clip: text) {
    .texture-4 {
        background-repeat: no-repeat;
        background-image: url("copy_texture_4_large.jpg")
    }
    @media only screen and (max-width: 1068px) {
        .texture-4 {
            background-repeat: no-repeat;
            background-image: url("copy_texture_4_medium.jpg")
        }
    }
    @media only screen and (max-width: 735px) {
        .texture-4 {
            background-repeat: no-repeat;
            background-image: url("copy_texture_4_small.jpg")
        }
    }
}

.texture-5 {
    color: #ffaC6e
}

@supports (-webkit-background-clip: text) {
    .texture-5 {
        background-repeat: no-repeat;
        background-image: url("copy_texture_5_large.jpg")
    }
    @media only screen and (max-width: 1068px) {
        .texture-5 {
            background-repeat: no-repeat;
            background-image: url("copy_texture_5_medium.jpg")
        }
    }
    @media only screen and (max-width: 735px) {
        .texture-5 {
            background-repeat: no-repeat;
            background-image: url("copy_texture_5_small.jpg")
        }
    }
}

.texture-6 {
    color: #bb8493
}

@supports (-webkit-background-clip: text) {
    .texture-6 {
        background-repeat: no-repeat;
        background-image: url("copy_texture_6_large.jpg")
    }
    @media only screen and (max-width: 1068px) {
        .texture-6 {
            background-repeat: no-repeat;
            background-image: url("copy_texture_6_medium.jpg")
        }
    }
    @media only screen and (max-width: 735px) {
        .texture-6 {
            background-repeat: no-repeat;
            background-image: url("copy_texture_6_small.jpg")
        }
    }
}

.texture-7 {
    color: #ae90ae
}

@supports (-webkit-background-clip: text) {
    .texture-7 {
        background-repeat: no-repeat;
        background-image: url("copy_texture_7_large.jpg")
    }
    @media only screen and (max-width: 1068px) {
        .texture-7 {
            background-repeat: no-repeat;
            background-image: url("copy_texture_7_medium.jpg")
        }
    }
    @media only screen and (max-width: 735px) {
        .texture-7 {
            background-repeat: no-repeat;
            background-image: url("copy_texture_7_small.jpg")
        }
    }
}

@media screen and (min-width: 736px) {
    .section-hero {
        padding-bottom: 175px;
        overflow: hidden;
        background-color: black
    }
    .section-hero .hero-lockup {
        position: relative;
        margin: 0px auto 0px auto;
        width: 1114px;
        height: 320px;
        left: -67px
    }
}

@media only screen and (min-width: 736px) and (max-width: 1068px) {
    .section-hero .hero-lockup {
        width: 704px
    }
}

@media only screen and (min-width: 736px) and (max-width: 1068px) {
    .section-hero .hero-lockup {
        height: 196px
    }
}

@media only screen and (min-width: 736px) and (max-width: 1068px) {
    .section-hero .hero-lockup {
        left: -6px
    }
}

@media screen and (min-width: 736px) {
    .section-hero .hero-lockup .inline-video-media {
        top: 183px;
        left: 0px
    }
}

@media only screen and (min-width: 736px) and (max-width: 1068px) {
    .section-hero .hero-lockup .inline-video-media {
        top: 113px
    }
}

@media screen and (min-width: 736px) {
    .section-hero .hero-lockup .inline-video-media,
    .section-hero .hero-lockup .inline-video-media>*,
    .section-hero .hero-lockup .inline-video-media>* .device,
    .section-hero .hero-lockup .inline-video-media>* .band-reflection {
        background-repeat: no-repeat;
        position: absolute;
        width: 1114px;
        height: 320px;
        background-size: 1114px 320px;
        overflow: hidden
    }
}

@media only screen and (min-width: 736px) and (max-width: 1068px) {
    .section-hero .hero-lockup .inline-video-media,
    .section-hero .hero-lockup .inline-video-media>*,
    .section-hero .hero-lockup .inline-video-media>* .device,
    .section-hero .hero-lockup .inline-video-media>* .band-reflection {
        width: 704px
    }
}

@media only screen and (min-width: 736px) and (max-width: 1068px) {
    .section-hero .hero-lockup .inline-video-media,
    .section-hero .hero-lockup .inline-video-media>*,
    .section-hero .hero-lockup .inline-video-media>* .device,
    .section-hero .hero-lockup .inline-video-media>* .band-reflection {
        height: 196px
    }
}

@media only screen and (min-width: 736px) and (max-width: 1068px) {
    .section-hero .hero-lockup .inline-video-media,
    .section-hero .hero-lockup .inline-video-media>*,
    .section-hero .hero-lockup .inline-video-media>* .device,
    .section-hero .hero-lockup .inline-video-media>* .band-reflection {
        background-size: 704px 196px
    }
}

@media screen and (min-width: 736px) {
    .section-hero .hero-lockup .inline-video-media>* {
        top: 0;
        left: 0;
        visibility: visible;
        opacity: 1;
        display: block
    }
    .section-hero .hero-lockup .inline-video-media .hero-animation-top-device {
        z-index: 3;
        background-size: 1114px 320px;
        background-repeat: no-repeat;
        background-image: url("hero_top_device_fallback_large.png")
    }
}

@media only screen and (min-width: 736px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-width: 736px) and (min-resolution: 1.5dppx),
screen and (min-width: 736px) and (-webkit-min-device-pixel-ratio: 1.5),
screen and (min-width: 736px) and (min-resolution: 144dpi) {
    .section-hero .hero-lockup .inline-video-media .hero-animation-top-device {
        background-image: url("hero_top_device_fallback_large_2x.png")
    }
}

@media screen and (min-width: 736px) {
    html.css-mask .section-hero .hero-lockup .inline-video-media .hero-animation-top-device {
        background-size: 1114px 320px;
        background-repeat: no-repeat;
        background-image: url("hero_top_device_large.jpg");
        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;
        -webkit-mask-image: url("hero_top_device_mask_large.svg");
        mask-image: url("hero_top_device_mask_large.svg")
    }
}

@media only screen and (min-width: 736px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-width: 736px) and (min-resolution: 1.5dppx),
screen and (min-width: 736px) and (-webkit-min-device-pixel-ratio: 1.5),
screen and (min-width: 736px) and (min-resolution: 144dpi) {
    html.css-mask .section-hero .hero-lockup .inline-video-media .hero-animation-top-device {
        background-image: url("hero_top_device_large_2x.jpg")
    }
}

@media only screen and (min-width: 736px) and (max-width: 1068px) {
    .section-hero .hero-lockup .inline-video-media .hero-animation-top-device {
        background-size: 704px 196px;
        background-repeat: no-repeat;
        background-image: url("hero_top_device_fallback_medium.png")
    }
}

@media only screen and (min-width: 736px) and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-width: 736px) and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (min-width: 736px) and (max-width: 1068px) and (min-resolution: 144dpi) {
    .section-hero .hero-lockup .inline-video-media .hero-animation-top-device {
        background-image: url("hero_top_device_fallback_medium_2x.png")
    }
}

@media only screen and (min-width: 736px) and (max-width: 1068px) {
    html.css-mask .section-hero .hero-lockup .inline-video-media .hero-animation-top-device {
        background-size: 704px 196px;
        background-repeat: no-repeat;
        background-image: url("hero_top_device_medium.jpg");
        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;
        -webkit-mask-image: url("hero_top_device_mask_medium.svg");
        mask-image: url("hero_top_device_mask_medium.svg")
    }
}

@media only screen and (min-width: 736px) and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-width: 736px) and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (min-width: 736px) and (max-width: 1068px) and (min-resolution: 144dpi) {
    html.css-mask .section-hero .hero-lockup .inline-video-media .hero-animation-top-device {
        background-image: url("hero_top_device_medium_2x.jpg")
    }
}

@media screen and (min-width: 736px) {
    .section-hero .hero-lockup .inline-video-media .hero-animation-top-device .band-reflection {
        display: none
    }
    .section-hero .hero-lockup .inline-video-media .hero-animation-bottom-device {
        z-index: 2
    }
    .section-hero .hero-lockup .inline-video-media .hero-animation-bottom-device .device {
        background-repeat: no-repeat;
        background-image: url("hero_bottom_device_large.jpg")
    }
}

@media only screen and (min-width: 736px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-width: 736px) and (min-resolution: 1.5dppx),
screen and (min-width: 736px) and (-webkit-min-device-pixel-ratio: 1.5),
screen and (min-width: 736px) and (min-resolution: 144dpi) {
    .section-hero .hero-lockup .inline-video-media .hero-animation-bottom-device .device {
        background-image: url("hero_bottom_device_large_2x.jpg")
    }
}

@media only screen and (min-width: 736px) and (max-width: 1068px) {
    .section-hero .hero-lockup .inline-video-media .hero-animation-bottom-device .device {
        background-repeat: no-repeat;
        background-image: url("hero_bottom_device_medium.jpg")
    }
}

@media only screen and (min-width: 736px) and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-width: 736px) and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (min-width: 736px) and (max-width: 1068px) and (min-resolution: 144dpi) {
    .section-hero .hero-lockup .inline-video-media .hero-animation-bottom-device .device {
        background-image: url("hero_bottom_device_medium_2x.jpg")
    }
}

@media screen and (min-width: 736px) {
    .section-hero .hero-lockup .inline-video-media .hero-animation-bottom-device .gradient-mask {
        display: none
    }
    .section-hero .hero-lockup .inline-video-media video {
        z-index: 1
    }
    .section-hero .text-gradient {
        will-change: transform;
        display: none
    }
    .section-hero .copy {
        position: relative;
        text-align: center;
        margin: 0 auto 0 auto;
        margin-top: 248px;
        width: 820px
    }
}

@media only screen and (min-width: 736px) and (max-width: 1068px) {
    .section-hero .copy {
        margin-top: 144px
    }
}

@media only screen and (min-width: 736px) and (max-width: 1068px) {
    .section-hero .copy {
        width: 680px
    }
}

@media screen and (min-width: 736px) {
    .section-hero .copy .headline .logotype {
        width: 167px;
        height: 28px;
        background-size: 167px 28px;
        background-repeat: no-repeat;
        /*background-image: url("hero_logo_large.svg");*/
        margin: 0 auto -28px auto
    }
    html.no-svg .section-hero .copy .headline .logotype {
        background-image: url("hero_logo_large.png")
    }
}

@media only screen and (min-width: 736px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-width: 736px) and (min-resolution: 1.5dppx),
screen and (min-width: 736px) and (-webkit-min-device-pixel-ratio: 1.5),
screen and (min-width: 736px) and (min-resolution: 144dpi) {
    html.no-svg .section-hero .copy .headline .logotype {
        background-image: url("hero_logo_large_2x.png")
    }
}

@media only screen and (min-width: 736px) and (max-width: 735px) {
    .section-hero .copy .headline .logotype {
        width: 112px;
        height: 19px;
        background-size: 112px 19px;
        background-repeat: no-repeat;
        background-image: url("hero_logo_small.png")
    }
}

@media only screen and (min-width: 736px) and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-width: 736px) and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (min-width: 736px) and (max-width: 735px) and (min-resolution: 144dpi) {
    .section-hero .copy .headline .logotype {
        background-image: url("hero_logo_small_2x.png")
    }
}

@media screen and (min-width: 736px) {
    .section-hero .copy .headline .tagline {
        margin-top: 0.6em
    }
    .section-hero .copy .intro {
        margin-top: 70px
    }
    .section-hero .copy .preorder {
        margin: 26px 0
    }
    .section-hero .copy .preorder span {
        color: #7f726d;
        margin: 0 6px;
        white-space: nowrap
    }
    .section-hero .copy .cta {
        margin-top: 20px;
        color: #ffe5db
    }
    .section-hero .copy .cta.cta-1,
    .section-hero .copy .cta.cta-2 {
        margin-top: 32px
    }
    .section-hero .copy .cta.cta-1 {
        margin-top: 51px;
        margin-right: 30px
    }
}

@media only screen and (min-width: 736px) and (max-width: 1068px) {
    .section-hero .copy .cta.cta-1 {
        margin-right: 25px
    }
}

@media screen and (min-width: 736px) {
    .section-hero .copy .cta.cta-2 {
        margin-top: 22px
    }
}

@media screen and (min-width: 736px) {
    html.js:not(.reduced-motion):not(.aow) .section-hero .hero-lockup .inline-video-media .hero-animation-top-device .band-reflection {
        display: block;
        opacity: 0;
        background-position: 74px 197px;
        background-size: 968px 27px;
        background-repeat: no-repeat;
        background-image: url("hero_top_device_reflection_large.jpg")
    }
}

@media only screen and (min-width: 736px) and (max-width: 1068px) {
    html.js:not(.reduced-motion):not(.aow) .section-hero .hero-lockup .inline-video-media .hero-animation-top-device .band-reflection {
        background-position: 44px 124px
    }
}

@media only screen and (min-width: 736px) and (max-width: 1068px) {
    html.js:not(.reduced-motion):not(.aow) .section-hero .hero-lockup .inline-video-media .hero-animation-top-device .band-reflection {
        background-size: 614px 18px
    }
}

@media only screen and (min-width: 736px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-width: 736px) and (min-resolution: 1.5dppx),
screen and (min-width: 736px) and (-webkit-min-device-pixel-ratio: 1.5),
screen and (min-width: 736px) and (min-resolution: 144dpi) {
    html.js:not(.reduced-motion):not(.aow) .section-hero .hero-lockup .inline-video-media .hero-animation-top-device .band-reflection {
        background-image: url("hero_top_device_reflection_large_2x.jpg")
    }
}

@media only screen and (min-width: 736px) and (max-width: 1068px) {
    html.js:not(.reduced-motion):not(.aow) .section-hero .hero-lockup .inline-video-media .hero-animation-top-device .band-reflection {
        background-repeat: no-repeat;
        background-image: url("hero_top_device_reflection_medium.jpg")
    }
}

@media only screen and (min-width: 736px) and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-width: 736px) and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (min-width: 736px) and (max-width: 1068px) and (min-resolution: 144dpi) {
    html.js:not(.reduced-motion):not(.aow) .section-hero .hero-lockup .inline-video-media .hero-animation-top-device .band-reflection {
        background-image: url("hero_top_device_reflection_medium_2x.jpg")
    }
}

@media screen and (min-width: 736px) {
    html.js.no-css-mask:not(.reduced-motion):not(.aow) .section-hero .hero-lockup .inline-video-media .hero-animation-top-device .band-reflection {
        background-repeat: no-repeat;
        background-image: url("hero_top_device_reflection_fallback_large.png")
    }
}

@media only screen and (min-width: 736px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-width: 736px) and (min-resolution: 1.5dppx),
screen and (min-width: 736px) and (-webkit-min-device-pixel-ratio: 1.5),
screen and (min-width: 736px) and (min-resolution: 144dpi) {
    html.js.no-css-mask:not(.reduced-motion):not(.aow) .section-hero .hero-lockup .inline-video-media .hero-animation-top-device .band-reflection {
        background-image: url("hero_top_device_reflection_fallback_large_2x.png")
    }
}

@media only screen and (min-width: 736px) and (max-width: 1068px) {
    html.js.no-css-mask:not(.reduced-motion):not(.aow) .section-hero .hero-lockup .inline-video-media .hero-animation-top-device .band-reflection {
        background-repeat: no-repeat;
        background-image: url("hero_top_device_reflection_fallback_medium.png")
    }
}

@media only screen and (min-width: 736px) and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-width: 736px) and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (min-width: 736px) and (max-width: 1068px) and (min-resolution: 144dpi) {
    html.js.no-css-mask:not(.reduced-motion):not(.aow) .section-hero .hero-lockup .inline-video-media .hero-animation-top-device .band-reflection {
        background-image: url("hero_top_device_reflection_fallback_medium_2x.png")
    }
}

@media screen and (min-width: 736px) {
    html.js:not(.reduced-motion):not(.aow) .section-hero .hero-lockup .inline-video-media .hero-animation-bottom-device {
        -webkit-transform: scale(.88) translateY(-77px);
        transform: scale(.88) translateY(-77px)
    }
}

@media only screen and (min-width: 736px) and (max-width: 1068px) {
    html.js:not(.reduced-motion):not(.aow) .section-hero .hero-lockup .inline-video-media .hero-animation-bottom-device {
        -webkit-transform: scale(.88) translateY(-47px);
        transform: scale(.88) translateY(-47px)
    }
}

@media screen and (min-width: 736px) {
    html.js:not(.reduced-motion):not(.aow) .section-hero .hero-lockup .inline-video-media .hero-animation-bottom-device .gradient-mask {
        display: block;
        position: absolute;
        right: 0px;
        top: 0px;
        opacity: 1
    }
    html.js:not(.reduced-motion):not(.aow) .section-hero .hero-lockup .inline-video-media .hero-animation-bottom-device .gradient-mask-right {
        background-repeat: no-repeat;
        background-image: url("hero_bottom_device_mask_right_quarter_size_large.png");
        background-size: 416px 320px;
        width: 416px;
        height: 320px;
        -webkit-transform: translateX(0px);
        transform: translateX(0px)
    }
}

@media only screen and (min-width: 736px) and (max-width: 1068px) {
    html.js:not(.reduced-motion):not(.aow) .section-hero .hero-lockup .inline-video-media .hero-animation-bottom-device .gradient-mask-right {
        background-repeat: no-repeat;
        background-image: url("hero_bottom_device_mask_right_quarter_size_medium.png");
        background-size: 316px 180px;
        width: 316px;
        height: 180px
    }
}

@media screen and (min-width: 736px) {
    html.js:not(.reduced-motion):not(.aow) .section-hero .hero-lockup .inline-video-media .hero-animation-bottom-device .gradient-mask-horizontal {
        background-repeat: no-repeat;
        background-image: url("hero_bottom_device_mask_horizontal_quarter_size_large.png");
        background-size: 1116px 716px;
        width: 1116px;
        height: 716px;
        -webkit-transform: translateY(0px);
        transform: translateY(0px)
    }
}

@media only screen and (min-width: 736px) and (max-width: 1068px) {
    html.js:not(.reduced-motion):not(.aow) .section-hero .hero-lockup .inline-video-media .hero-animation-bottom-device .gradient-mask-horizontal {
        background-repeat: no-repeat;
        background-image: url("hero_bottom_device_mask_horizontal_quarter_size_medium.png");
        background-size: 696px 400px;
        width: 696px;
        height: 400px
    }
}

@media screen and (min-width: 736px) {
    html.js:not(.reduced-motion):not(.aow) .section-hero .intro,
    html.js:not(.reduced-motion):not(.aow) .section-hero .preorder,
    html.js:not(.reduced-motion):not(.aow) .section-hero .cta {
        will-change: opacity;
        opacity: 0
    }
}

@media screen and (min-width: 736px) {
    html.js:not(.reduced-motion):not(.aow) .section-hero.css-animation-playback .hero-lockup .inline-video-media .hero-animation-top-device .band-reflection {
        -webkit-transition: opacity .7s ease-in 1.33s;
        transition: opacity .7s ease-in 1.33s;
        opacity: 1
    }
    html.js:not(.reduced-motion):not(.aow) .section-hero.css-animation-playback .hero-lockup .inline-video-media .hero-animation-bottom-device {
        -webkit-transition: -webkit-transform 2.1s ease-in-out 0s;
        transition: -webkit-transform 2.1s ease-in-out 0s;
        transition: transform 2.1s ease-in-out 0s;
        transition: transform 2.1s ease-in-out 0s, -webkit-transform 2.1s ease-in-out 0s;
        -webkit-transform: scale(1) translateY(0px);
        transform: scale(1) translateY(0px)
    }
    html.js:not(.reduced-motion):not(.aow) .section-hero.css-animation-playback .hero-lockup .inline-video-media .hero-animation-bottom-device .gradient-mask-right {
        -webkit-transition: opacity .35s linear 2.8s, -webkit-transform 1.75s ease-in .14s;
        transition: opacity .35s linear 2.8s, -webkit-transform 1.75s ease-in .14s;
        transition: transform 1.75s ease-in .14s, opacity .35s linear 2.8s;
        transition: transform 1.75s ease-in .14s, opacity .35s linear 2.8s, -webkit-transform 1.75s ease-in .14s;
        -webkit-transform: translatex(229px);
        transform: translatex(229px);
        opacity: 0
    }
}

@media only screen and (min-width: 736px) and (max-width: 1068px) {
    html.js:not(.reduced-motion):not(.aow) .section-hero.css-animation-playback .hero-lockup .inline-video-media .hero-animation-bottom-device .gradient-mask-right {
        -webkit-transform: translatex(145px);
        transform: translatex(145px)
    }
}

@media screen and (min-width: 736px) {
    html.js:not(.reduced-motion):not(.aow) .section-hero.css-animation-playback .hero-lockup .inline-video-media .hero-animation-bottom-device .gradient-mask-horizontal {
        -webkit-transition: opacity .35s linear 2.8s, -webkit-transform 1.75s ease-in-out .91s;
        transition: opacity .35s linear 2.8s, -webkit-transform 1.75s ease-in-out .91s;
        transition: transform 1.75s ease-in-out .91s, opacity .35s linear 2.8s;
        transition: transform 1.75s ease-in-out .91s, opacity .35s linear 2.8s, -webkit-transform 1.75s ease-in-out .91s;
        -webkit-transform: translateY(-320px);
        transform: translateY(-320px);
        opacity: 0
    }
}

@media only screen and (min-width: 736px) and (max-width: 1068px) {
    html.js:not(.reduced-motion):not(.aow) .section-hero.css-animation-playback .hero-lockup .inline-video-media .hero-animation-bottom-device .gradient-mask-horizontal {
        -webkit-transform: translateY(-196px);
        transform: translateY(-196px)
    }
}

@media screen and (min-width: 736px) {
    html.js:not(.reduced-motion):not(.aow) .section-hero.css-animation-playback .hero-lockup .inline-video-media video {
        display: none;
        opacity: 0
    }
    html.js:not(.reduced-motion):not(.aow) .section-hero.css-animation-remove-transitions .hero-lockup .inline-video-media .hero-animation-top-device .band-reflection {
        -webkit-transition: unset;
        transition: unset
    }
    html.js:not(.reduced-motion):not(.aow) .section-hero.css-animation-remove-transitions .hero-lockup .inline-video-media .hero-animation-bottom-device {
        -webkit-transition: none;
        transition: none
    }
    html.js:not(.reduced-motion):not(.aow) .section-hero.css-animation-remove-transitions .hero-lockup .inline-video-media .hero-animation-bottom-device .gradient-mask-right {
        -webkit-transition: unset;
        transition: unset
    }
    html.js:not(.reduced-motion):not(.aow) .section-hero.css-animation-remove-transitions .hero-lockup .inline-video-media .hero-animation-bottom-device .gradient-mask-horizontal {
        -webkit-transition: unset;
        transition: unset
    }
}

@media screen and (min-width: 736px) {
    html.js:not(.reduced-motion):not(.aow) .section-hero.video-animation-playback video {
        display: block;
        opacity: 1
    }
    html.js:not(.reduced-motion):not(.aow) .section-hero.video-animation-playback .hero-animation-top-device {
        -webkit-transition: opacity 0.25s linear 0s;
        transition: opacity 0.25s linear 0s;
        opacity: 0
    }
    html.js:not(.reduced-motion):not(.aow) .section-hero.video-animation-playback .hero-animation-bottom-device {
        display: none
    }
}

@media screen and (min-width: 736px) {
    html.no-reduced-motion.js .section-hero.geo-alt {
        background: -webkit-linear-gradient(bottom, #121212 0%, #000 400px);
        background: linear-gradient(to top, #121212 0%, #000 400px)
    }
    html.no-reduced-motion.js .section-hero.css-animation-playback.show-body-copy .intro,
    html.no-reduced-motion.js .section-hero.css-animation-playback.show-body-copy .preorder,
    html.no-reduced-motion.js .section-hero.css-animation-playback.show-body-copy .cta,
    html.no-reduced-motion.js .section-hero.video-animation-playback.show-body-copy .intro,
    html.no-reduced-motion.js .section-hero.video-animation-playback.show-body-copy .preorder,
    html.no-reduced-motion.js .section-hero.video-animation-playback.show-body-copy .cta {
        -webkit-transition: opacity 2.1s ease-out 0s;
        transition: opacity 2.1s ease-out 0s;
        opacity: 1
    }
}

@media only screen and (max-width: 735px) {
    .section-hero {
        position: relative;
        padding-bottom: 40px;
        overflow: hidden;
        background-color: black
    }
    .section-hero.geo-alt {
        background: -webkit-linear-gradient(bottom, #121212 0%, #000 400px);
        background: linear-gradient(to top, #121212 0%, #000 400px)
    }
    .section-hero .hero-lockup .inline-video-media {
        top: 35px;
        left: calc(50vw - 79px)
    }
    html.aow .section-hero .hero-lockup .inline-video-media {
        top: 43px
    }
    .section-hero .hero-lockup .inline-video-media,
    .section-hero .hero-lockup .inline-video-media>*,
    .section-hero .hero-lockup .inline-video-media>* .device,
    .section-hero .hero-lockup .inline-video-media>* .band-reflection {
        background-repeat: no-repeat;
        position: absolute;
        width: 172px;
        height: 408px;
        background-size: 172px 408px;
        overflow: hidden
    }
    .section-hero .hero-lockup .inline-video-media>* {
        top: 0;
        left: 0;
        visibility: visible;
        opacity: 1;
        display: block
    }
    .section-hero .hero-lockup .inline-video-media .hero-animation-top-device {
        z-index: 3
    }
}

@media only screen and (max-width: 735px) and (max-width: 735px) {
    .section-hero .hero-lockup .inline-video-media .hero-animation-top-device {
        background-repeat: no-repeat;
        background-image: url("hero_vertical_startframe_small.jpg")
    }
}

@media only screen and (max-width: 735px) and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (max-width: 735px) and (min-resolution: 144dpi) {
    .section-hero .hero-lockup .inline-video-media .hero-animation-top-device {
        background-image: url("hero_vertical_startframe_small_2x.jpg")
    }
}

@media only screen and (max-width: 735px) {
    .section-hero .hero-lockup .inline-video-media .hero-animation-top-device>* {
        display: none
    }
    html.reduced-motion .section-hero .hero-lockup .inline-video-media .hero-animation-top-device,
    html.aow .section-hero .hero-lockup .inline-video-media .hero-animation-top-device,
    html.reduced-motion .section-hero .hero-lockup .inline-video-media .hero-animation-top-device,
    html.aow .section-hero .hero-lockup .inline-video-media .hero-animation-top-device {
        display: none
    }
}

@media only screen and (max-width: 735px) and (max-width: 735px) {
    .section-hero .hero-lockup .inline-video-media .hero-animation-bottom-device {
        background-repeat: no-repeat;
        background-image: url("hero_vertical_endframe_small.jpg")
    }
}

@media only screen and (max-width: 735px) and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (max-width: 735px) and (min-resolution: 144dpi) {
    .section-hero .hero-lockup .inline-video-media .hero-animation-bottom-device {
        background-image: url("hero_vertical_endframe_small_2x.jpg")
    }
}

@media only screen and (max-width: 735px) {
    .section-hero .hero-lockup .inline-video-media .hero-animation-bottom-device>* {
        display: none
    }
    .section-hero .hero-lockup .inline-video-media video {
        z-index: 1
    }
    .section-hero .intro,
    .section-hero .preorder,
    .section-hero .cta {
        opacity: 0
    }
    html.no-js .section-hero .intro,
    html.reduced-motion .section-hero .intro,
    html.aow .section-hero .intro,
    html.no-js .section-hero .intro,
    html.reduced-motion .section-hero .intro,
    html.aow .section-hero .intro,
    html.no-js .section-hero .intro,
    html.reduced-motion .section-hero .intro,
    html.aow .section-hero .intro,
    html.no-js .section-hero .preorder,
    html.reduced-motion .section-hero .preorder,
    html.aow .section-hero .preorder,
    html.no-js .section-hero .preorder,
    html.reduced-motion .section-hero .preorder,
    html.aow .section-hero .preorder,
    html.no-js .section-hero .preorder,
    html.reduced-motion .section-hero .preorder,
    html.aow .section-hero .preorder,
    html.no-js .section-hero .cta,
    html.reduced-motion .section-hero .cta,
    html.aow .section-hero .cta,
    html.no-js .section-hero .cta,
    html.reduced-motion .section-hero .cta,
    html.aow .section-hero .cta,
    html.no-js .section-hero .cta,
    html.reduced-motion .section-hero .cta,
    html.aow .section-hero .cta {
        opacity: 1
    }
    html.no-reduced-motion .section-hero.video-animation-playback video {
        display: block;
        opacity: 1
    }
    html.no-reduced-motion .section-hero.video-animation-playback .hero-animation-top-device {
        -webkit-transition: opacity 0.25s linear 0s;
        transition: opacity 0.25s linear 0s;
        opacity: 0
    }
    html.no-reduced-motion .section-hero.video-animation-playback.video-animation-ended video {
        -webkit-transition: opacity 3s linear 0s;
        transition: opacity 3s linear 0s;
        opacity: 0
    }
    html.no-reduced-motion .section-hero.css-animation-playback video {
        display: none;
        opacity: 0
    }
    html.no-reduced-motion .section-hero.css-animation-playback .hero-animation-top-device {
        -webkit-transition: opacity 3s linear 0s;
        transition: opacity 3s linear 0s;
        opacity: 0
    }
    html.no-reduced-motion .section-hero.css-animation-playback.css-animation-remove-transitions .hero-animation-top-device {
        -webkit-transition: none;
        transition: none
    }
    html.no-reduced-motion .section-hero.video-animation-playback.show-body-copy .intro,
    html.no-reduced-motion .section-hero.video-animation-playback.show-body-copy .preorder,
    html.no-reduced-motion .section-hero.video-animation-playback.show-body-copy .cta,
    html.no-reduced-motion .section-hero.css-animation-playback.show-body-copy .intro,
    html.no-reduced-motion .section-hero.css-animation-playback.show-body-copy .preorder,
    html.no-reduced-motion .section-hero.css-animation-playback.show-body-copy .cta {
        -webkit-transition: opacity 2.1s ease-out 0s;
        transition: opacity 2.1s ease-out 0s;
        opacity: 1
    }
    html.no-js .section-hero .section-content video,
    html.no-js .section-hero .section-content .hero-animation-top-device {
        display: none
    }
    html.js .section-hero.css-animation-remove-transitions video {
        display: none;
        visibility: hidden
    }
}

@media only screen and (max-width: 735px) and (max-width: 735px) {
    html.js .section-hero:not(.og-viewport-small) video {
        display: none;
        visibility: hidden
    }
}

@media only screen and (max-width: 735px) {
    .section-hero .copy {
        display: block;
        position: relative;
        text-align: center;
        margin: 490px auto 40px auto;
        width: 90%
    }
    .section-hero .copy .headline .logotype {
        width: 167px;
        height: 28px;
        background-size: 167px 28px;
        background-repeat: no-repeat;
        /*background-image: url("hero_logo_large.svg");*/
        margin: 0 auto -28px auto
    }
    html.no-svg .section-hero .copy .headline .logotype {
        background-image: url("hero_logo_large.png")
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi) {
    html.no-svg .section-hero .copy .headline .logotype {
        background-image: url("hero_logo_large_2x.png")
    }
}

@media only screen and (max-width: 735px) and (max-width: 735px) {
    .section-hero .copy .headline .logotype {
        width: 112px;
        height: 19px;
        background-size: 112px 19px;
        background-repeat: no-repeat;
        background-image: url("hero_logo_small.png")
    }
}

@media only screen and (max-width: 735px) and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (max-width: 735px) and (min-resolution: 144dpi) {
    .section-hero .copy .headline .logotype {
        background-image: url("hero_logo_small_2x.png")
    }
}

@media only screen and (max-width: 735px) {
    .section-hero .copy .headline .tagline {
        margin-top: 0.6em
    }
    .section-hero .copy .intro {
        margin-top: 29px
    }
    .section-hero .copy .preorder {
        margin: 14px 0
    }
    .section-hero .copy .preorder span {
        color: #7f726d;
        margin: 0 6px;
        white-space: nowrap
    }
    .section-hero .copy .cta {
        margin-top: 40px;
        color: #ffe5db
    }
    .section-hero .copy .cta.no-messaging {
        margin-top: 30px
    }
    .section-hero .copy .cta.cta-1,
    .section-hero .copy .cta.cta-2 {
        display: inline-block
    }
    .section-hero .copy .cta.cta-1 {
        margin-top: 51px;
        padding-right: 0
    }
    .section-hero .copy .cta.cta-2 {
        margin-top: 22px
    }
}

.ribbon {
    margin-bottom: -32px;
    overflow: hidden
}

@media only screen and (max-width: 735px) {
    .ribbon {
        margin-top: 0px;
        margin-bottom: -4px
    }
}

.ribbon-wrapper {
    width: 100%;
    padding: 13px 0;
    text-align: center;
    background-color: #0070c9;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition: background-color 1s ease-in-out 1.2s, color 1s ease-in-out 1s, -webkit-transform .6s ease-in-out;
    transition: background-color 1s ease-in-out 1.2s, color 1s ease-in-out 1s, -webkit-transform .6s ease-in-out;
    transition: transform .6s ease-in-out, background-color 1s ease-in-out 1.2s, color 1s ease-in-out 1s;
    transition: transform .6s ease-in-out, background-color 1s ease-in-out 1.2s, color 1s ease-in-out 1s, -webkit-transform .6s ease-in-out
}

.ribbon-content {
    margin-left: auto;
    margin-right: auto;
    width: 980px;
    display: block
}

@media only screen and (min-width: 1442px) {
    .ribbon-content {
        margin-left: auto;
        margin-right: auto;
        width: 980px
    }
}

@media only screen and (max-width: 1068px) {
    .ribbon-content {
        margin-left: auto;
        margin-right: auto;
        width: 692px
    }
}

@media only screen and (max-width: 735px) {
    .ribbon-content {
        margin-left: auto;
        margin-right: auto;
        width: 87.5%
    }
}

.ribbon .ribbon-wrapper {
    color: #fff
}

.ribbon a.icon-wrapper {
    color: #fff;
    font-weight: 600;
    -webkit-transition: color 1s ease-in-out 1s;
    transition: color 1s ease-in-out 1s
}

html.js.no-reduced-motion .ribbon.ribbon-hide a.icon-wrapper {
    color: #6bf
}

html.js.no-reduced-motion.aow .ribbon.ribbon-hide a.icon-wrapper {
    color: #fff
}

html.js.no-reduced-motion .ribbon.ribbon-hide .ribbon-wrapper {
    background-color: #181818;
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%)
}

html.js.no-reduced-motion.aow .ribbon.ribbon-hide .ribbon-wrapper {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
    background-color: #0070c9
}

.ribbon+.section-content {
    padding-top: auto;
    margin-top: 46px
}

@media only screen and (max-width: 1068px) {
    .ribbon+.section-content {
        padding-top: auto
    }
}

@media only screen and (max-width: 735px) {
    .ribbon+.section-content {
        padding-top: 66px
    }
}

@media only screen and (max-width: 1068px) {
    .ribbon+.section-content {
        margin-top: 46px
    }
}

@media only screen and (max-width: 735px) {
    .ribbon+.section-content {
        margin-top: auto
    }
}

.ribbon+.section-content .inline-video-media {
    margin-top: auto
}

@media only screen and (max-width: 1068px) {
    .ribbon+.section-content .inline-video-media {
        margin-top: auto
    }
}

@media only screen and (max-width: 735px) {
    .ribbon+.section-content .inline-video-media {
        margin-top: 66px
    }
}

.section-design-film .block-link {
    background-repeat: no-repeat;
    background-image: url("design_film_large.jpg");
    background-size: cover;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 1440px;
    height: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    outline-offset: -3px
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-design-film .block-link {
        background-image: url("design_film_large_2x.jpg")
    }
}

.section-design-film .block-link::after {
    content: '';
    display: block;
    padding-bottom: 58.75%
}

@media only screen and (max-width: 1068px) {
    .section-design-film .block-link {
        background-repeat: no-repeat;
        background-image: url("design_film_medium.jpg");
        background-size: cover
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    .section-design-film .block-link {
        background-image: url("design_film_medium_2x.jpg")
    }
}

@media only screen and (max-width: 1068px) {
    .section-design-film .block-link::after {
        content: '';
        display: block;
        padding-bottom: 72.47191%
    }
}

@media only screen and (max-width: 735px) {
    .section-design-film .block-link {
        background-repeat: no-repeat;
        background-image: url("design_film_small.jpg");
        background-size: cover
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi) {
    .section-design-film .block-link {
        background-image: url("design_film_small_2x.jpg")
    }
}

@media only screen and (max-width: 735px) {
    .section-design-film .block-link::after {
        content: '';
        display: block;
        padding-bottom: 56.25%
    }
}

@media only screen and (max-width: 1068px) {
    .section-design-film .block-link {
        max-width: 1068px
    }
}

@media only screen and (max-width: 735px) {
    .section-design-film .block-link {
        max-width: 736px
    }
}

.section-design-film .block-link .copy-wrapper {
    position: relative;
    z-index: 2
}

.section-design-film .block-link .film-headline {
    margin-bottom: 18px
}

@media only screen and (max-width: 735px) {
    .section-design-film .block-link .film-headline {
        margin-bottom: 8px
    }
}

.section-design-film .block-link .film-headline,
.section-design-film .block-link .film-cta {
    color: #ffe5db
}

.section-design-film .block-link::before {
    position: absolute;
    z-index: 1;
    display: block;
    content: '';
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    -webkit-transition: 500ms opacity cubic-bezier(0.4, 0, 0.6, 1);
    transition: 500ms opacity cubic-bezier(0.4, 0, 0.6, 1);
    background-color: #000;
    opacity: 0
}

.section-design-film .block-link:hover {
    text-decoration: none
}

.section-design-film .block-link:hover::before {
    opacity: 0.35
}

.section-design-film .block-link:hover .film-cta {
    text-decoration: underline
}

@-webkit-keyframes fadein {
    from {
        opacity: 0
    }
    to {
        opacity: 1
    }
}

@keyframes fadein {
    from {
        opacity: 0
    }
    to {
        opacity: 1
    }
}

.section-display {
    --hardware-spacing-2up: 24px;
    --hardware-spacing-3up: 44px;
    --hardware-scale-factor: .22;
    margin-bottom: 200px
}

@media only screen and (max-width: 1068px),
(max-height: 845px) {
    .section-display {
        --hardware-spacing-2up: 20px;
        --hardware-spacing-3up: 35px;
        --hardware-scale-factor: .22
    }
}

@media only screen and (max-width: 1068px),
(max-height: 715px) {
    .section-display {
        --hardware-spacing-2up: 10px;
        --hardware-spacing-3up: 30px;
        --hardware-scale-factor: .24
    }
}

@media only screen and (max-width: 735px),
(max-height: 585px) {
    .section-display {
        --hardware-spacing-2up: -48px;
        --hardware-spacing-3up: 22px;
        --hardware-scale-factor: .56
    }
}

@media only screen and (max-width: 1068px) {
    .section-display {
        margin-bottom: 100px
    }
}

@media only screen and (max-width: 735px),
(max-height: 585px) {
    .section-display {
        margin-bottom: 124px
    }
}

.section-display .manifesto-wrapper {
    position: relative;
    padding: 190px 0 140px 0
}

@media only screen and (max-width: 1068px) {
    .section-display .manifesto-wrapper {
        padding: 132px 0 100px 0
    }
}

@media only screen and (max-width: 735px) {
    .section-display .manifesto-wrapper {
        padding: 80px 0 90px 0
    }
}

.section-display.enhanced .manifesto-wrapper {
    padding-bottom: 70px
}

.section-display .manifesto-shadow {
    display: none;
    height: 500px;
    width: 100%;
    position: absolute;
    left: 0;
    bottom: 0;
    background: -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(75%, #000));
    background: -webkit-linear-gradient(top, transparent, #000 75%);
    background: linear-gradient(to bottom, transparent, #000 75%);
    pointer-events: none
}

.section-display.enhanced .manifesto-shadow {
    display: block;
    will-change: opacity, transform
}

.section-display .sticky-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    overflow: hidden
}

.section-display.enhanced .sticky-item {
    min-height: 80vh
}

.section-display .compare {
    width: 100%
}

@media only screen and (max-width: 735px),
(max-height: 585px) {
    .section-display .compare {
        width: auto
    }
}

.section-display .compare-header {
    margin-bottom: 36px;
    text-align: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.section-display .compare-header * {
    display: inline;
    color: #ffe5db
}

@media only screen and (max-width: 735px),
(max-height: 585px) {
    .section-display .compare .compare-header {
        display: none
    }
}

.section-display.enhanced .anim-transform,
.section-display.enhanced .anim-opacity,
.section-display.enhanced .anim-transform-opacity {
    visibility: hidden
}

.section-display.enhanced.activated .anim-transform,
.section-display.enhanced.activated .anim-opacity,
.section-display.enhanced.activated .anim-transform-opacity {
    visibility: visible
}

.section-display.enhanced.activated .anim-transform {
    will-change: transform
}

.section-display.enhanced.activated .anim-opacity {
    will-change: opacity
}

.section-display.enhanced.activated .anim-transform-opacity {
    will-change: transform, opacity
}

.section-display .hardware {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    pointer-events: none
}

.section-display .hardware-aligner {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 100%
}

.section-display .hardware-label {
    margin-top: 26px
}

@media only screen and (max-width: 735px),
(max-height: 585px) {
    .section-display .hardware-label {
        display: none
    }
}

.section-display .hardware-badge {
    display: none;
    pointer-events: auto;
    position: absolute;
    z-index: 1;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    -ms-flex-item-align: start;
    align-self: flex-start;
    text-align: right;
    right: 140px
}

@media only screen and (max-width: 1068px),
(max-height: 845px) {
    .section-display .hardware-badge {
        right: 112px
    }
}

@media only screen and (max-width: 1068px),
(max-height: 715px) {
    .section-display .hardware-badge {
        right: 82px
    }
}

.section-display[data-display-animation-flipped] .hardware-badge {
    text-align: left;
    right: initial;
    left: 140px
}

@media only screen and (max-width: 1068px),
(max-height: 845px) {
    .section-display[data-display-animation-flipped] .hardware-badge {
        right: initial;
        left: 112px
    }
}

@media only screen and (max-width: 1068px),
(max-height: 715px) {
    .section-display[data-display-animation-flipped] .hardware-badge {
        right: initial;
        left: 82px
    }
}

@media only screen and (max-width: 735px),
(max-height: 585px) {
    .section-display .hardware-badge {
        margin-left: 3px;
        display: block;
        position: relative;
        left: auto !important;
        right: auto !important;
        -webkit-transform: none;
        transform: none;
        text-align: left !important;
        margin-top: 20px
    }
    .section-display[data-display-animation-flipped] .hardware-badge {
        margin-left: 40px
    }
}

.section-display.enhanced .hardware-badge {
    display: block
}

.section-display .hardware-badge-top {
    color: #fff
}

.section-display .hardware-badge p+p {
    margin-top: 0
}

.section-display .hardware:nth-child(2) .hardware-badge {
    text-align: left;
    right: initial;
    left: 140px
}

@media only screen and (max-width: 1068px),
(max-height: 845px) {
    .section-display .hardware:nth-child(2) .hardware-badge {
        right: initial;
        left: 112px
    }
}

@media only screen and (max-width: 1068px),
(max-height: 715px) {
    .section-display .hardware:nth-child(2) .hardware-badge {
        right: initial;
        left: 82px
    }
}

.section-display[data-display-animation-flipped] .hardware:nth-child(2) .hardware-badge {
    margin-left: 3px;
    text-align: right;
    left: initial;
    right: 140px
}

@media only screen and (max-width: 1068px),
(max-height: 845px) {
    .section-display[data-display-animation-flipped] .hardware:nth-child(2) .hardware-badge {
        left: initial;
        right: 112px
    }
}

@media only screen and (max-width: 1068px),
(max-height: 715px) {
    .section-display[data-display-animation-flipped] .hardware:nth-child(2) .hardware-badge {
        left: initial;
        right: 82px
    }
}

@media only screen and (max-width: 735px),
(max-height: 585px) {
    .section-display .hardware:nth-child(2) .hardware-badge {
        margin-left: 17px
    }
}

.section-display .hardware-anim-container {
    position: relative;
    z-index: 2;
    height: 605px
}

@media only screen and (max-width: 1068px),
(max-height: 845px) {
    .section-display .hardware-anim-container {
        height: 484px
    }
}

@media only screen and (max-width: 1068px),
(max-height: 715px) {
    .section-display .hardware-anim-container {
        height: 380px
    }
}

@media only screen and (max-width: 735px),
(max-height: 585px) {
    .section-display .hardware-anim-container {
        height: 363px
    }
}

.section-display .hardware-image-iphonexs {
    width: 240px;
    height: 517px;
    background-size: 240px 517px;
    background-repeat: no-repeat;
    background-image: url("screen_display_iphonexs_large.jpg");
    width: 240px;
    height: 517px;
    background-size: 240px 517px;
    background-repeat: no-repeat;
    background-image: url("screen_display_iphonexs_large.jpg")
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-display .hardware-image-iphonexs {
        background-image: url("screen_display_iphonexs_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px) {
    .section-display .hardware-image-iphonexs {
        width: 150px;
        height: 323px;
        background-size: 150px 323px;
        background-repeat: no-repeat;
        background-image: url("screen_display_iphonexs_medium.jpg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    .section-display .hardware-image-iphonexs {
        background-image: url("screen_display_iphonexs_medium_2x.jpg")
    }
}

@media only screen and (max-width: 735px) {
    .section-display .hardware-image-iphonexs {
        width: 130px;
        height: 257px;
        background-size: 130px 257px;
        background-repeat: no-repeat;
        background-image: url("screen_display_iphonexs_small.jpg")
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi) {
    .section-display .hardware-image-iphonexs {
        background-image: url("screen_display_iphonexs_small_2x.jpg")
    }
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-display .hardware-image-iphonexs {
        background-image: url("screen_display_iphonexs_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px),
(max-height: 845px) {
    .section-display .hardware-image-iphonexs {
        width: 192px;
        height: 414px;
        background-size: 192px 414px;
        background-repeat: no-repeat;
        background-image: url("screen_display_iphonexs_large.jpg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-height: 845px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-height: 845px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi),
(max-height: 845px) and (-webkit-min-device-pixel-ratio: 1.5),
(max-height: 845px) and (min-resolution: 144dpi) {
    .section-display .hardware-image-iphonexs {
        background-image: url("screen_display_iphonexs_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px),
(max-height: 715px) {
    .section-display .hardware-image-iphonexs {
        width: 150px;
        height: 323px;
        background-size: 150px 323px;
        background-repeat: no-repeat;
        background-image: url("screen_display_iphonexs_medium.jpg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-height: 715px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-height: 715px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi),
(max-height: 715px) and (-webkit-min-device-pixel-ratio: 1.5),
(max-height: 715px) and (min-resolution: 144dpi) {
    .section-display .hardware-image-iphonexs {
        background-image: url("screen_display_iphonexs_medium_2x.jpg")
    }
}

@media only screen and (max-width: 735px),
(max-height: 585px) {
    .section-display .hardware-image-iphonexs {
        width: 130px;
        height: 257px;
        background-size: 130px 257px;
        background-repeat: no-repeat;
        background-image: url("screen_display_iphonexs_small.jpg")
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-height: 585px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-height: 585px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi),
(max-height: 585px) and (-webkit-min-device-pixel-ratio: 1.5),
(max-height: 585px) and (min-resolution: 144dpi) {
    .section-display .hardware-image-iphonexs {
        background-image: url("screen_display_iphonexs_small_2x.jpg")
    }
}

.section-display .hardware-image-iphonexsmax {
    width: 265px;
    height: 571px;
    background-size: 265px 571px;
    background-repeat: no-repeat;
    background-image: url("screen_display_iphonexsmax_large.jpg");
    width: 265px;
    height: 571px;
    background-size: 265px 571px;
    background-repeat: no-repeat;
    background-image: url("screen_display_iphonexsmax_large.jpg")
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-display .hardware-image-iphonexsmax {
        background-image: url("screen_display_iphonexsmax_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px) {
    .section-display .hardware-image-iphonexsmax {
        width: 166px;
        height: 357px;
        background-size: 166px 357px;
        background-repeat: no-repeat;
        background-image: url("screen_display_iphonexsmax_medium.jpg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    .section-display .hardware-image-iphonexsmax {
        background-image: url("screen_display_iphonexsmax_medium_2x.jpg")
    }
}

@media only screen and (max-width: 735px) {
    .section-display .hardware-image-iphonexsmax {
        width: 141px;
        height: 282px;
        background-size: 141px 282px;
        background-repeat: no-repeat;
        background-image: url("screen_display_iphonexsmax_small.jpg")
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi) {
    .section-display .hardware-image-iphonexsmax {
        background-image: url("screen_display_iphonexsmax_small_2x.jpg")
    }
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-display .hardware-image-iphonexsmax {
        background-image: url("screen_display_iphonexsmax_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px),
(max-height: 845px) {
    .section-display .hardware-image-iphonexsmax {
        width: 212px;
        height: 457px;
        background-size: 212px 457px;
        background-repeat: no-repeat;
        background-image: url("screen_display_iphonexsmax_large.jpg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-height: 845px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-height: 845px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi),
(max-height: 845px) and (-webkit-min-device-pixel-ratio: 1.5),
(max-height: 845px) and (min-resolution: 144dpi) {
    .section-display .hardware-image-iphonexsmax {
        background-image: url("screen_display_iphonexsmax_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px),
(max-height: 715px) {
    .section-display .hardware-image-iphonexsmax {
        width: 166px;
        height: 357px;
        background-size: 166px 357px;
        background-repeat: no-repeat;
        background-image: url("screen_display_iphonexsmax_medium.jpg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-height: 715px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-height: 715px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi),
(max-height: 715px) and (-webkit-min-device-pixel-ratio: 1.5),
(max-height: 715px) and (min-resolution: 144dpi) {
    .section-display .hardware-image-iphonexsmax {
        background-image: url("screen_display_iphonexsmax_medium_2x.jpg")
    }
}

@media only screen and (max-width: 735px),
(max-height: 585px) {
    .section-display .hardware-image-iphonexsmax {
        width: 141px;
        height: 282px;
        background-size: 141px 282px;
        background-repeat: no-repeat;
        background-image: url("screen_display_iphonexsmax_small.jpg")
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-height: 585px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-height: 585px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi),
(max-height: 585px) and (-webkit-min-device-pixel-ratio: 1.5),
(max-height: 585px) and (min-resolution: 144dpi) {
    .section-display .hardware-image-iphonexsmax {
        background-image: url("screen_display_iphonexsmax_small_2x.jpg")
    }
}

.section-display .hardware-image-iphone8 {
    width: 261px;
    height: 527px;
    background-size: 261px 527px;
    background-repeat: no-repeat;
    background-image: url("screen_display_iphone8_large.jpg");
    width: 261px;
    height: 527px;
    background-size: 261px 527px;
    background-repeat: no-repeat;
    background-image: url("screen_display_iphone8_large.jpg")
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-display .hardware-image-iphone8 {
        background-image: url("screen_display_iphone8_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px) {
    .section-display .hardware-image-iphone8 {
        width: 164px;
        height: 330px;
        background-size: 164px 330px;
        background-repeat: no-repeat;
        background-image: url("screen_display_iphone8_medium.jpg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    .section-display .hardware-image-iphone8 {
        background-image: url("screen_display_iphone8_medium_2x.jpg")
    }
}

@media only screen and (max-width: 735px) {
    .section-display .hardware-image-iphone8 {
        width: 123px;
        height: 247px;
        background-size: 123px 247px;
        background-repeat: no-repeat;
        background-image: url("screen_display_iphone8_small.jpg")
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi) {
    .section-display .hardware-image-iphone8 {
        background-image: url("screen_display_iphone8_small_2x.jpg")
    }
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-display .hardware-image-iphone8 {
        background-image: url("screen_display_iphone8_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px),
(max-height: 845px) {
    .section-display .hardware-image-iphone8 {
        width: 209px;
        height: 422px;
        background-size: 209px 422px;
        background-repeat: no-repeat;
        background-image: url("screen_display_iphone8_large.jpg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-height: 845px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-height: 845px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi),
(max-height: 845px) and (-webkit-min-device-pixel-ratio: 1.5),
(max-height: 845px) and (min-resolution: 144dpi) {
    .section-display .hardware-image-iphone8 {
        background-image: url("screen_display_iphone8_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px),
(max-height: 715px) {
    .section-display .hardware-image-iphone8 {
        width: 164px;
        height: 330px;
        background-size: 164px 330px;
        background-repeat: no-repeat;
        background-image: url("screen_display_iphone8_medium.jpg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-height: 715px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-height: 715px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi),
(max-height: 715px) and (-webkit-min-device-pixel-ratio: 1.5),
(max-height: 715px) and (min-resolution: 144dpi) {
    .section-display .hardware-image-iphone8 {
        background-image: url("screen_display_iphone8_medium_2x.jpg")
    }
}

@media only screen and (max-width: 735px),
(max-height: 585px) {
    .section-display .hardware-image-iphone8 {
        width: 123px;
        height: 247px;
        background-size: 123px 247px;
        background-repeat: no-repeat;
        background-image: url("screen_display_iphone8_small.jpg")
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-height: 585px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-height: 585px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi),
(max-height: 585px) and (-webkit-min-device-pixel-ratio: 1.5),
(max-height: 585px) and (min-resolution: 144dpi) {
    .section-display .hardware-image-iphone8 {
        background-image: url("screen_display_iphone8_small_2x.jpg")
    }
}

.section-display .hardware-image-iphone8plus {
    width: 305px;
    height: 610px;
    background-size: 305px 610px;
    background-repeat: no-repeat;
    background-image: url("screen_display_iphone8plus_large.jpg");
    width: 305px;
    height: 610px;
    background-size: 305px 610px;
    background-repeat: no-repeat;
    background-image: url("screen_display_iphone8plus_large.jpg")
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-display .hardware-image-iphone8plus {
        background-image: url("screen_display_iphone8plus_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px) {
    .section-display .hardware-image-iphone8plus {
        width: 192px;
        height: 381px;
        background-size: 192px 381px;
        background-repeat: no-repeat;
        background-image: url("screen_display_iphone8plus_medium.jpg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    .section-display .hardware-image-iphone8plus {
        background-image: url("screen_display_iphone8plus_medium_2x.jpg")
    }
}

@media only screen and (max-width: 735px) {
    .section-display .hardware-image-iphone8plus {
        width: 142px;
        height: 282px;
        background-size: 142px 282px;
        background-repeat: no-repeat;
        background-image: url("screen_display_iphone8plus_small.jpg")
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi) {
    .section-display .hardware-image-iphone8plus {
        background-image: url("screen_display_iphone8plus_small_2x.jpg")
    }
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-display .hardware-image-iphone8plus {
        background-image: url("screen_display_iphone8plus_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px),
(max-height: 845px) {
    .section-display .hardware-image-iphone8plus {
        width: 244px;
        height: 488px;
        background-size: 244px 488px;
        background-repeat: no-repeat;
        background-image: url("screen_display_iphone8plus_large.jpg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-height: 845px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-height: 845px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi),
(max-height: 845px) and (-webkit-min-device-pixel-ratio: 1.5),
(max-height: 845px) and (min-resolution: 144dpi) {
    .section-display .hardware-image-iphone8plus {
        background-image: url("screen_display_iphone8plus_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px),
(max-height: 715px) {
    .section-display .hardware-image-iphone8plus {
        width: 192px;
        height: 381px;
        background-size: 192px 381px;
        background-repeat: no-repeat;
        background-image: url("screen_display_iphone8plus_medium.jpg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-height: 715px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-height: 715px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi),
(max-height: 715px) and (-webkit-min-device-pixel-ratio: 1.5),
(max-height: 715px) and (min-resolution: 144dpi) {
    .section-display .hardware-image-iphone8plus {
        background-image: url("screen_display_iphone8plus_medium_2x.jpg")
    }
}

@media only screen and (max-width: 735px),
(max-height: 585px) {
    .section-display .hardware-image-iphone8plus {
        width: 142px;
        height: 282px;
        background-size: 142px 282px;
        background-repeat: no-repeat;
        background-image: url("screen_display_iphone8plus_small.jpg")
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-height: 585px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-height: 585px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi),
(max-height: 585px) and (-webkit-min-device-pixel-ratio: 1.5),
(max-height: 585px) and (min-resolution: 144dpi) {
    .section-display .hardware-image-iphone8plus {
        background-image: url("screen_display_iphone8plus_small_2x.jpg")
    }
}

.section-display .photo-preview {
    position: relative;
    z-index: 1
}

@media only screen and (max-width: 735px),
(max-height: 585px) {
    .section-display .photo-preview {
        display: none
    }
}

.section-display.enhanced .photo-preview {
    opacity: 0.001
}

.section-display .glass-display-iphonexsmax {
    width: 302px;
    height: 605px;
    width: 302px;
    height: 605px
}

@media only screen and (max-width: 1068px) {
    .section-display .glass-display-iphonexsmax {
        width: 190px;
        height: 380px
    }
}

@media only screen and (max-width: 735px) {
    .section-display .glass-display-iphonexsmax {
        width: 181px;
        height: 363px
    }
}

@media only screen and (max-width: 1068px),
(max-height: 845px) {
    .section-display .glass-display-iphonexsmax {
        width: 242px;
        height: 484px
    }
}

@media only screen and (max-width: 1068px),
(max-height: 715px) {
    .section-display .glass-display-iphonexsmax {
        width: 190px;
        height: 380px
    }
}

@media only screen and (max-width: 735px),
(max-height: 585px) {
    .section-display .glass-display-iphonexsmax {
        width: 181px;
        height: 363px
    }
}

.section-display .glass-display-iphonexsmax .glass-frame {
    width: 302px;
    height: 605px;
    background-size: 302px 605px;
    background-repeat: no-repeat;
    background-image: url("hardware_display_iphonexsmax_gold_portrait_fallback_large.png");
    width: 302px;
    height: 605px;
    background-size: 302px 605px;
    background-repeat: no-repeat;
    background-image: url("hardware_display_iphonexsmax_gold_portrait_fallback_large.png");
    z-index: 2
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-display .glass-display-iphonexsmax .glass-frame {
        background-image: url("hardware_display_iphonexsmax_gold_portrait_fallback_large_2x.png")
    }
}

html.css-mask .section-display .glass-display-iphonexsmax .glass-frame {
    width: 302px;
    height: 605px;
    background-size: 302px 605px;
    background-repeat: no-repeat;
    background-image: url("hardware_display_iphonexsmax_gold_portrait_large.jpg");
    -webkit-mask-size: 302px 605px;
    mask-size: 302px 605px;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-image: url("hardware_display_iphonexsmax_gold_portrait_mask_large.svg");
    mask-image: url("hardware_display_iphonexsmax_gold_portrait_mask_large.svg")
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    html.css-mask .section-display .glass-display-iphonexsmax .glass-frame {
        background-image: url("hardware_display_iphonexsmax_gold_portrait_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px) {
    .section-display .glass-display-iphonexsmax .glass-frame {
        width: 190px;
        height: 380px;
        background-size: 190px 380px;
        background-repeat: no-repeat;
        background-image: url("hardware_display_iphonexsmax_gold_portrait_fallback_medium.png")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    .section-display .glass-display-iphonexsmax .glass-frame {
        background-image: url("hardware_display_iphonexsmax_gold_portrait_fallback_medium_2x.png")
    }
}

@media only screen and (max-width: 1068px) {
    html.css-mask .section-display .glass-display-iphonexsmax .glass-frame {
        width: 190px;
        height: 380px;
        background-size: 190px 380px;
        background-repeat: no-repeat;
        background-image: url("hardware_display_iphonexsmax_gold_portrait_medium.jpg");
        -webkit-mask-size: 190px 380px;
        mask-size: 190px 380px;
        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;
        -webkit-mask-image: url("hardware_display_iphonexsmax_gold_portrait_mask_medium.svg");
        mask-image: url("hardware_display_iphonexsmax_gold_portrait_mask_medium.svg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    html.css-mask .section-display .glass-display-iphonexsmax .glass-frame {
        background-image: url("hardware_display_iphonexsmax_gold_portrait_medium_2x.jpg")
    }
}

@media only screen and (max-width: 735px) {
    .section-display .glass-display-iphonexsmax .glass-frame {
        width: 181px;
        height: 363px;
        background-size: 181px 363px;
        background-repeat: no-repeat;
        background-image: url("hardware_display_iphonexsmax_gold_portrait_fallback_small.png")
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi) {
    .section-display .glass-display-iphonexsmax .glass-frame {
        background-image: url("hardware_display_iphonexsmax_gold_portrait_fallback_small_2x.png")
    }
}

@media only screen and (max-width: 735px) {
    html.css-mask .section-display .glass-display-iphonexsmax .glass-frame {
        width: 181px;
        height: 363px;
        background-size: 181px 363px;
        background-repeat: no-repeat;
        background-image: url("hardware_display_iphonexsmax_gold_portrait_small.jpg");
        -webkit-mask-size: 181px 363px;
        mask-size: 181px 363px;
        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;
        -webkit-mask-image: url("hardware_display_iphonexsmax_gold_portrait_mask_small.svg");
        mask-image: url("hardware_display_iphonexsmax_gold_portrait_mask_small.svg")
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi) {
    html.css-mask .section-display .glass-display-iphonexsmax .glass-frame {
        background-image: url("hardware_display_iphonexsmax_gold_portrait_small_2x.jpg")
    }
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-display .glass-display-iphonexsmax .glass-frame {
        background-image: url("hardware_display_iphonexsmax_gold_portrait_fallback_large_2x.png")
    }
}

html.css-mask .section-display .glass-display-iphonexsmax .glass-frame {
    width: 302px;
    height: 605px;
    background-size: 302px 605px;
    background-repeat: no-repeat;
    background-image: url("hardware_display_iphonexsmax_gold_portrait_large.jpg");
    -webkit-mask-size: 302px 605px;
    mask-size: 302px 605px;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-image: url("hardware_display_iphonexsmax_gold_portrait_mask_large.svg");
    mask-image: url("hardware_display_iphonexsmax_gold_portrait_mask_large.svg")
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    html.css-mask .section-display .glass-display-iphonexsmax .glass-frame {
        background-image: url("hardware_display_iphonexsmax_gold_portrait_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px),
(max-height: 845px) {
    .section-display .glass-display-iphonexsmax .glass-frame {
        width: 242px;
        height: 484px;
        background-size: 242px 484px;
        background-repeat: no-repeat;
        background-image: url("hardware_display_iphonexsmax_gold_portrait_fallback_large.png")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-height: 845px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-height: 845px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi),
(max-height: 845px) and (-webkit-min-device-pixel-ratio: 1.5),
(max-height: 845px) and (min-resolution: 144dpi) {
    .section-display .glass-display-iphonexsmax .glass-frame {
        background-image: url("hardware_display_iphonexsmax_gold_portrait_fallback_large_2x.png")
    }
}

@media only screen and (max-width: 1068px),
(max-height: 845px) {
    html.css-mask .section-display .glass-display-iphonexsmax .glass-frame {
        width: 242px;
        height: 484px;
        background-size: 242px 484px;
        background-repeat: no-repeat;
        background-image: url("hardware_display_iphonexsmax_gold_portrait_large.jpg");
        -webkit-mask-size: 242px 484px;
        mask-size: 242px 484px;
        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;
        -webkit-mask-image: url("hardware_display_iphonexsmax_gold_portrait_mask_large.svg");
        mask-image: url("hardware_display_iphonexsmax_gold_portrait_mask_large.svg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-height: 845px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-height: 845px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi),
(max-height: 845px) and (-webkit-min-device-pixel-ratio: 1.5),
(max-height: 845px) and (min-resolution: 144dpi) {
    html.css-mask .section-display .glass-display-iphonexsmax .glass-frame {
        background-image: url("hardware_display_iphonexsmax_gold_portrait_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px),
(max-height: 715px) {
    .section-display .glass-display-iphonexsmax .glass-frame {
        width: 190px;
        height: 380px;
        background-size: 190px 380px;
        background-repeat: no-repeat;
        background-image: url("hardware_display_iphonexsmax_gold_portrait_fallback_medium.png")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-height: 715px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-height: 715px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi),
(max-height: 715px) and (-webkit-min-device-pixel-ratio: 1.5),
(max-height: 715px) and (min-resolution: 144dpi) {
    .section-display .glass-display-iphonexsmax .glass-frame {
        background-image: url("hardware_display_iphonexsmax_gold_portrait_fallback_medium_2x.png")
    }
}

@media only screen and (max-width: 1068px),
(max-height: 715px) {
    html.css-mask .section-display .glass-display-iphonexsmax .glass-frame {
        width: 190px;
        height: 380px;
        background-size: 190px 380px;
        background-repeat: no-repeat;
        background-image: url("hardware_display_iphonexsmax_gold_portrait_medium.jpg");
        -webkit-mask-size: 190px 380px;
        mask-size: 190px 380px;
        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;
        -webkit-mask-image: url("hardware_display_iphonexsmax_gold_portrait_mask_medium.svg");
        mask-image: url("hardware_display_iphonexsmax_gold_portrait_mask_medium.svg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-height: 715px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-height: 715px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi),
(max-height: 715px) and (-webkit-min-device-pixel-ratio: 1.5),
(max-height: 715px) and (min-resolution: 144dpi) {
    html.css-mask .section-display .glass-display-iphonexsmax .glass-frame {
        background-image: url("hardware_display_iphonexsmax_gold_portrait_medium_2x.jpg")
    }
}

@media only screen and (max-width: 735px),
(max-height: 585px) {
    .section-display .glass-display-iphonexsmax .glass-frame {
        width: 181px;
        height: 363px;
        background-size: 181px 363px;
        background-repeat: no-repeat;
        background-image: url("hardware_display_iphonexsmax_gold_portrait_fallback_small.png")
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-height: 585px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-height: 585px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi),
(max-height: 585px) and (-webkit-min-device-pixel-ratio: 1.5),
(max-height: 585px) and (min-resolution: 144dpi) {
    .section-display .glass-display-iphonexsmax .glass-frame {
        background-image: url("hardware_display_iphonexsmax_gold_portrait_fallback_small_2x.png")
    }
}

@media only screen and (max-width: 735px),
(max-height: 585px) {
    html.css-mask .section-display .glass-display-iphonexsmax .glass-frame {
        width: 181px;
        height: 363px;
        background-size: 181px 363px;
        background-repeat: no-repeat;
        background-image: url("hardware_display_iphonexsmax_gold_portrait_small.jpg");
        -webkit-mask-size: 181px 363px;
        mask-size: 181px 363px;
        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;
        -webkit-mask-image: url("hardware_display_iphonexsmax_gold_portrait_mask_small.svg");
        mask-image: url("hardware_display_iphonexsmax_gold_portrait_mask_small.svg")
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-height: 585px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-height: 585px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi),
(max-height: 585px) and (-webkit-min-device-pixel-ratio: 1.5),
(max-height: 585px) and (min-resolution: 144dpi) {
    html.css-mask .section-display .glass-display-iphonexsmax .glass-frame {
        background-image: url("hardware_display_iphonexsmax_gold_portrait_small_2x.jpg")
    }
}

.section-display .glass-display-iphonexsmax .glass-screen {
    width: 265px;
    height: 571px;
    background-size: 265px 571px;
    background-repeat: no-repeat;
    background-image: url("screen_display_wallpaper_iphonexsmax_large.jpg");
    width: 265px;
    height: 571px;
    background-size: 265px 571px;
    background-repeat: no-repeat;
    background-image: url("screen_display_wallpaper_iphonexsmax_large.jpg");
    margin-left: 19px;
    margin-top: 17px
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-display .glass-display-iphonexsmax .glass-screen {
        background-image: url("screen_display_wallpaper_iphonexsmax_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px) {
    .section-display .glass-display-iphonexsmax .glass-screen {
        width: 166px;
        height: 357px;
        background-size: 166px 357px;
        background-repeat: no-repeat;
        background-image: url("screen_display_wallpaper_iphonexsmax_medium.jpg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    .section-display .glass-display-iphonexsmax .glass-screen {
        background-image: url("screen_display_wallpaper_iphonexsmax_medium_2x.jpg")
    }
}

@media only screen and (max-width: 735px) {
    .section-display .glass-display-iphonexsmax .glass-screen {
        width: 160px;
        height: 343px;
        background-size: 160px 343px;
        background-repeat: no-repeat;
        background-image: url("screen_display_wallpaper_iphonexsmax_small.jpg")
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi) {
    .section-display .glass-display-iphonexsmax .glass-screen {
        background-image: url("screen_display_wallpaper_iphonexsmax_small_2x.jpg")
    }
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-display .glass-display-iphonexsmax .glass-screen {
        background-image: url("screen_display_wallpaper_iphonexsmax_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px),
(max-height: 845px) {
    .section-display .glass-display-iphonexsmax .glass-screen {
        width: 212px;
        height: 457px;
        background-size: 212px 457px;
        background-repeat: no-repeat;
        background-image: url("screen_display_wallpaper_iphonexsmax_large.jpg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-height: 845px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-height: 845px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi),
(max-height: 845px) and (-webkit-min-device-pixel-ratio: 1.5),
(max-height: 845px) and (min-resolution: 144dpi) {
    .section-display .glass-display-iphonexsmax .glass-screen {
        background-image: url("screen_display_wallpaper_iphonexsmax_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px),
(max-height: 715px) {
    .section-display .glass-display-iphonexsmax .glass-screen {
        width: 166px;
        height: 357px;
        background-size: 166px 357px;
        background-repeat: no-repeat;
        background-image: url("screen_display_wallpaper_iphonexsmax_medium.jpg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-height: 715px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-height: 715px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi),
(max-height: 715px) and (-webkit-min-device-pixel-ratio: 1.5),
(max-height: 715px) and (min-resolution: 144dpi) {
    .section-display .glass-display-iphonexsmax .glass-screen {
        background-image: url("screen_display_wallpaper_iphonexsmax_medium_2x.jpg")
    }
}

@media only screen and (max-width: 735px),
(max-height: 585px) {
    .section-display .glass-display-iphonexsmax .glass-screen {
        width: 160px;
        height: 343px;
        background-size: 160px 343px;
        background-repeat: no-repeat;
        background-image: url("screen_display_wallpaper_iphonexsmax_small.jpg")
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-height: 585px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-height: 585px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi),
(max-height: 585px) and (-webkit-min-device-pixel-ratio: 1.5),
(max-height: 585px) and (min-resolution: 144dpi) {
    .section-display .glass-display-iphonexsmax .glass-screen {
        background-image: url("screen_display_wallpaper_iphonexsmax_small_2x.jpg")
    }
}

@media only screen and (max-width: 1068px),
(max-height: 845px) {
    .section-display .glass-display-iphonexsmax .glass-screen {
        margin-left: 15.5px;
        margin-top: 13.5px
    }
}

@media only screen and (max-width: 1068px),
(max-height: 715px) {
    .section-display .glass-display-iphonexsmax .glass-screen {
        margin-left: 12px;
        margin-top: 13px
    }
}

@media only screen and (max-width: 735px),
(max-height: 585px) {
    .section-display .glass-display-iphonexsmax .glass-screen {
        margin-left: 11px;
        margin-top: 11px
    }
}

.section-display .glass-display-iphonexsmax .photo-preview {
    width: 265px;
    height: 571px;
    background-size: 265px 571px;
    background-repeat: no-repeat;
    background-image: url("screen_display_iphonexsmax_large.jpg");
    width: 265px;
    height: 571px;
    background-size: 265px 571px;
    background-repeat: no-repeat;
    background-image: url("screen_display_iphonexsmax_large.jpg")
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-display .glass-display-iphonexsmax .photo-preview {
        background-image: url("screen_display_iphonexsmax_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px) {
    .section-display .glass-display-iphonexsmax .photo-preview {
        width: 166px;
        height: 357px;
        background-size: 166px 357px;
        background-repeat: no-repeat;
        background-image: url("screen_display_iphonexsmax_medium.jpg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    .section-display .glass-display-iphonexsmax .photo-preview {
        background-image: url("screen_display_iphonexsmax_medium_2x.jpg")
    }
}

@media only screen and (max-width: 735px) {
    .section-display .glass-display-iphonexsmax .photo-preview {
        width: 141px;
        height: 282px;
        background-size: 141px 282px;
        background-repeat: no-repeat;
        background-image: url("screen_display_iphonexsmax_small.jpg")
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi) {
    .section-display .glass-display-iphonexsmax .photo-preview {
        background-image: url("screen_display_iphonexsmax_small_2x.jpg")
    }
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-display .glass-display-iphonexsmax .photo-preview {
        background-image: url("screen_display_iphonexsmax_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px),
(max-height: 845px) {
    .section-display .glass-display-iphonexsmax .photo-preview {
        width: 212px;
        height: 457px;
        background-size: 212px 457px;
        background-repeat: no-repeat;
        background-image: url("screen_display_iphonexsmax_large.jpg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-height: 845px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-height: 845px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi),
(max-height: 845px) and (-webkit-min-device-pixel-ratio: 1.5),
(max-height: 845px) and (min-resolution: 144dpi) {
    .section-display .glass-display-iphonexsmax .photo-preview {
        background-image: url("screen_display_iphonexsmax_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px),
(max-height: 715px) {
    .section-display .glass-display-iphonexsmax .photo-preview {
        width: 166px;
        height: 357px;
        background-size: 166px 357px;
        background-repeat: no-repeat;
        background-image: url("screen_display_iphonexsmax_medium.jpg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-height: 715px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-height: 715px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi),
(max-height: 715px) and (-webkit-min-device-pixel-ratio: 1.5),
(max-height: 715px) and (min-resolution: 144dpi) {
    .section-display .glass-display-iphonexsmax .photo-preview {
        background-image: url("screen_display_iphonexsmax_medium_2x.jpg")
    }
}

@media only screen and (max-width: 735px),
(max-height: 585px) {
    .section-display .glass-display-iphonexsmax .photo-preview {
        width: 141px;
        height: 282px;
        background-size: 141px 282px;
        background-repeat: no-repeat;
        background-image: url("screen_display_iphonexsmax_small.jpg")
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-height: 585px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-height: 585px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi),
(max-height: 585px) and (-webkit-min-device-pixel-ratio: 1.5),
(max-height: 585px) and (min-resolution: 144dpi) {
    .section-display .glass-display-iphonexsmax .photo-preview {
        background-image: url("screen_display_iphonexsmax_small_2x.jpg")
    }
}

.section-display .glass-display-iphonexs {
    width: 278px;
    height: 551px;
    width: 278px;
    height: 551px
}

@media only screen and (max-width: 1068px) {
    .section-display .glass-display-iphonexs {
        width: 173px;
        height: 344px
    }
}

@media only screen and (max-width: 735px) {
    .section-display .glass-display-iphonexs {
        width: 169px;
        height: 333px
    }
}

@media only screen and (max-width: 1068px),
(max-height: 845px) {
    .section-display .glass-display-iphonexs {
        width: 222px;
        height: 441px
    }
}

@media only screen and (max-width: 1068px),
(max-height: 715px) {
    .section-display .glass-display-iphonexs {
        width: 173px;
        height: 344px
    }
}

@media only screen and (max-width: 735px),
(max-height: 585px) {
    .section-display .glass-display-iphonexs {
        width: 169px;
        height: 333px
    }
}

.section-display .glass-display-iphonexs .glass-frame {
    width: 278px;
    height: 551px;
    background-size: 278px 551px;
    background-repeat: no-repeat;
    background-image: url("hardware_display_iphonexs_gold_portrait_fallback_large.png");
    width: 278px;
    height: 551px;
    background-size: 278px 551px;
    background-repeat: no-repeat;
    background-image: url("hardware_display_iphonexs_gold_portrait_fallback_large.png");
    z-index: 2
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-display .glass-display-iphonexs .glass-frame {
        background-image: url("hardware_display_iphonexs_gold_portrait_fallback_large_2x.png")
    }
}

html.css-mask .section-display .glass-display-iphonexs .glass-frame {
    width: 278px;
    height: 551px;
    background-size: 278px 551px;
    background-repeat: no-repeat;
    background-image: url("hardware_display_iphonexs_gold_portrait_large.jpg");
    -webkit-mask-size: 278px 551px;
    mask-size: 278px 551px;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-image: url("hardware_display_iphonexs_gold_portrait_mask_large.svg");
    mask-image: url("hardware_display_iphonexs_gold_portrait_mask_large.svg")
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    html.css-mask .section-display .glass-display-iphonexs .glass-frame {
        background-image: url("hardware_display_iphonexs_gold_portrait_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px) {
    .section-display .glass-display-iphonexs .glass-frame {
        width: 173px;
        height: 344px;
        background-size: 173px 344px;
        background-repeat: no-repeat;
        background-image: url("hardware_display_iphonexs_gold_portrait_fallback_medium.png")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    .section-display .glass-display-iphonexs .glass-frame {
        background-image: url("hardware_display_iphonexs_gold_portrait_fallback_medium_2x.png")
    }
}

@media only screen and (max-width: 1068px) {
    html.css-mask .section-display .glass-display-iphonexs .glass-frame {
        width: 173px;
        height: 344px;
        background-size: 173px 344px;
        background-repeat: no-repeat;
        background-image: url("hardware_display_iphonexs_gold_portrait_medium.jpg");
        -webkit-mask-size: 173px 344px;
        mask-size: 173px 344px;
        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;
        -webkit-mask-image: url("hardware_display_iphonexs_gold_portrait_mask_medium.svg");
        mask-image: url("hardware_display_iphonexs_gold_portrait_mask_medium.svg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    html.css-mask .section-display .glass-display-iphonexs .glass-frame {
        background-image: url("hardware_display_iphonexs_gold_portrait_medium_2x.jpg")
    }
}

@media only screen and (max-width: 735px) {
    .section-display .glass-display-iphonexs .glass-frame {
        width: 169px;
        height: 333px;
        background-size: 169px 333px;
        background-repeat: no-repeat;
        background-image: url("hardware_display_iphonexs_gold_portrait_fallback_small.png")
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi) {
    .section-display .glass-display-iphonexs .glass-frame {
        background-image: url("hardware_display_iphonexs_gold_portrait_fallback_small_2x.png")
    }
}

@media only screen and (max-width: 735px) {
    html.css-mask .section-display .glass-display-iphonexs .glass-frame {
        width: 169px;
        height: 333px;
        background-size: 169px 333px;
        background-repeat: no-repeat;
        background-image: url("hardware_display_iphonexs_gold_portrait_small.jpg");
        -webkit-mask-size: 169px 333px;
        mask-size: 169px 333px;
        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;
        -webkit-mask-image: url("hardware_display_iphonexs_gold_portrait_mask_small.svg");
        mask-image: url("hardware_display_iphonexs_gold_portrait_mask_small.svg")
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi) {
    html.css-mask .section-display .glass-display-iphonexs .glass-frame {
        background-image: url("hardware_display_iphonexs_gold_portrait_small_2x.jpg")
    }
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-display .glass-display-iphonexs .glass-frame {
        background-image: url("hardware_display_iphonexs_gold_portrait_fallback_large_2x.png")
    }
}

html.css-mask .section-display .glass-display-iphonexs .glass-frame {
    width: 278px;
    height: 551px;
    background-size: 278px 551px;
    background-repeat: no-repeat;
    background-image: url("hardware_display_iphonexs_gold_portrait_large.jpg");
    -webkit-mask-size: 278px 551px;
    mask-size: 278px 551px;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-image: url("hardware_display_iphonexs_gold_portrait_mask_large.svg");
    mask-image: url("hardware_display_iphonexs_gold_portrait_mask_large.svg")
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    html.css-mask .section-display .glass-display-iphonexs .glass-frame {
        background-image: url("hardware_display_iphonexs_gold_portrait_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px),
(max-height: 845px) {
    .section-display .glass-display-iphonexs .glass-frame {
        width: 222px;
        height: 441px;
        background-size: 222px 441px;
        background-repeat: no-repeat;
        background-image: url("hardware_display_iphonexs_gold_portrait_fallback_large.png")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-height: 845px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-height: 845px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi),
(max-height: 845px) and (-webkit-min-device-pixel-ratio: 1.5),
(max-height: 845px) and (min-resolution: 144dpi) {
    .section-display .glass-display-iphonexs .glass-frame {
        background-image: url("hardware_display_iphonexs_gold_portrait_fallback_large_2x.png")
    }
}

@media only screen and (max-width: 1068px),
(max-height: 845px) {
    html.css-mask .section-display .glass-display-iphonexs .glass-frame {
        width: 222px;
        height: 441px;
        background-size: 222px 441px;
        background-repeat: no-repeat;
        background-image: url("hardware_display_iphonexs_gold_portrait_large.jpg");
        -webkit-mask-size: 222px 441px;
        mask-size: 222px 441px;
        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;
        -webkit-mask-image: url("hardware_display_iphonexs_gold_portrait_mask_large.svg");
        mask-image: url("hardware_display_iphonexs_gold_portrait_mask_large.svg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-height: 845px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-height: 845px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi),
(max-height: 845px) and (-webkit-min-device-pixel-ratio: 1.5),
(max-height: 845px) and (min-resolution: 144dpi) {
    html.css-mask .section-display .glass-display-iphonexs .glass-frame {
        background-image: url("hardware_display_iphonexs_gold_portrait_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px),
(max-height: 715px) {
    .section-display .glass-display-iphonexs .glass-frame {
        width: 173px;
        height: 344px;
        background-size: 173px 344px;
        background-repeat: no-repeat;
        background-image: url("hardware_display_iphonexs_gold_portrait_fallback_medium.png")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-height: 715px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-height: 715px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi),
(max-height: 715px) and (-webkit-min-device-pixel-ratio: 1.5),
(max-height: 715px) and (min-resolution: 144dpi) {
    .section-display .glass-display-iphonexs .glass-frame {
        background-image: url("hardware_display_iphonexs_gold_portrait_fallback_medium_2x.png")
    }
}

@media only screen and (max-width: 1068px),
(max-height: 715px) {
    html.css-mask .section-display .glass-display-iphonexs .glass-frame {
        width: 173px;
        height: 344px;
        background-size: 173px 344px;
        background-repeat: no-repeat;
        background-image: url("hardware_display_iphonexs_gold_portrait_medium.jpg");
        -webkit-mask-size: 173px 344px;
        mask-size: 173px 344px;
        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;
        -webkit-mask-image: url("hardware_display_iphonexs_gold_portrait_mask_medium.svg");
        mask-image: url("hardware_display_iphonexs_gold_portrait_mask_medium.svg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-height: 715px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-height: 715px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi),
(max-height: 715px) and (-webkit-min-device-pixel-ratio: 1.5),
(max-height: 715px) and (min-resolution: 144dpi) {
    html.css-mask .section-display .glass-display-iphonexs .glass-frame {
        background-image: url("hardware_display_iphonexs_gold_portrait_medium_2x.jpg")
    }
}

@media only screen and (max-width: 735px),
(max-height: 585px) {
    .section-display .glass-display-iphonexs .glass-frame {
        width: 169px;
        height: 333px;
        background-size: 169px 333px;
        background-repeat: no-repeat;
        background-image: url("hardware_display_iphonexs_gold_portrait_fallback_small.png")
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-height: 585px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-height: 585px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi),
(max-height: 585px) and (-webkit-min-device-pixel-ratio: 1.5),
(max-height: 585px) and (min-resolution: 144dpi) {
    .section-display .glass-display-iphonexs .glass-frame {
        background-image: url("hardware_display_iphonexs_gold_portrait_fallback_small_2x.png")
    }
}

@media only screen and (max-width: 735px),
(max-height: 585px) {
    html.css-mask .section-display .glass-display-iphonexs .glass-frame {
        width: 169px;
        height: 333px;
        background-size: 169px 333px;
        background-repeat: no-repeat;
        background-image: url("hardware_display_iphonexs_gold_portrait_small.jpg");
        -webkit-mask-size: 169px 333px;
        mask-size: 169px 333px;
        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;
        -webkit-mask-image: url("hardware_display_iphonexs_gold_portrait_mask_small.svg");
        mask-image: url("hardware_display_iphonexs_gold_portrait_mask_small.svg")
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-height: 585px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-height: 585px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi),
(max-height: 585px) and (-webkit-min-device-pixel-ratio: 1.5),
(max-height: 585px) and (min-resolution: 144dpi) {
    html.css-mask .section-display .glass-display-iphonexs .glass-frame {
        background-image: url("hardware_display_iphonexs_gold_portrait_small_2x.jpg")
    }
}

.section-display .glass-display-iphonexs .glass-screen {
    width: 240px;
    height: 517px;
    background-size: 240px 517px;
    background-repeat: no-repeat;
    background-image: url("screen_display_wallpaper_iphonexs_large.jpg");
    width: 240px;
    height: 517px;
    background-size: 240px 517px;
    background-repeat: no-repeat;
    background-image: url("screen_display_wallpaper_iphonexs_large.jpg");
    margin-left: 19px;
    margin-top: 17px
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-display .glass-display-iphonexs .glass-screen {
        background-image: url("screen_display_wallpaper_iphonexs_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px) {
    .section-display .glass-display-iphonexs .glass-screen {
        width: 150px;
        height: 323px;
        background-size: 150px 323px;
        background-repeat: no-repeat;
        background-image: url("screen_display_wallpaper_iphonexs_medium.jpg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    .section-display .glass-display-iphonexs .glass-screen {
        background-image: url("screen_display_wallpaper_iphonexs_medium_2x.jpg")
    }
}

@media only screen and (max-width: 735px) {
    .section-display .glass-display-iphonexs .glass-screen {
        width: 145px;
        height: 312px;
        background-size: 145px 312px;
        background-repeat: no-repeat;
        background-image: url("screen_display_wallpaper_iphonexs_small.jpg")
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi) {
    .section-display .glass-display-iphonexs .glass-screen {
        background-image: url("screen_display_wallpaper_iphonexs_small_2x.jpg")
    }
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-display .glass-display-iphonexs .glass-screen {
        background-image: url("screen_display_wallpaper_iphonexs_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px),
(max-height: 845px) {
    .section-display .glass-display-iphonexs .glass-screen {
        width: 192px;
        height: 414px;
        background-size: 192px 414px;
        background-repeat: no-repeat;
        background-image: url("screen_display_wallpaper_iphonexs_large.jpg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-height: 845px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-height: 845px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi),
(max-height: 845px) and (-webkit-min-device-pixel-ratio: 1.5),
(max-height: 845px) and (min-resolution: 144dpi) {
    .section-display .glass-display-iphonexs .glass-screen {
        background-image: url("screen_display_wallpaper_iphonexs_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px),
(max-height: 715px) {
    .section-display .glass-display-iphonexs .glass-screen {
        width: 150px;
        height: 323px;
        background-size: 150px 323px;
        background-repeat: no-repeat;
        background-image: url("screen_display_wallpaper_iphonexs_medium.jpg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-height: 715px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-height: 715px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi),
(max-height: 715px) and (-webkit-min-device-pixel-ratio: 1.5),
(max-height: 715px) and (min-resolution: 144dpi) {
    .section-display .glass-display-iphonexs .glass-screen {
        background-image: url("screen_display_wallpaper_iphonexs_medium_2x.jpg")
    }
}

@media only screen and (max-width: 735px),
(max-height: 585px) {
    .section-display .glass-display-iphonexs .glass-screen {
        width: 145px;
        height: 312px;
        background-size: 145px 312px;
        background-repeat: no-repeat;
        background-image: url("screen_display_wallpaper_iphonexs_small.jpg")
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-height: 585px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-height: 585px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi),
(max-height: 585px) and (-webkit-min-device-pixel-ratio: 1.5),
(max-height: 585px) and (min-resolution: 144dpi) {
    .section-display .glass-display-iphonexs .glass-screen {
        background-image: url("screen_display_wallpaper_iphonexs_small_2x.jpg")
    }
}

@media only screen and (max-width: 1068px),
(max-height: 845px) {
    .section-display .glass-display-iphonexs .glass-screen {
        margin-left: 15px;
        margin-top: 13px
    }
}

@media only screen and (max-width: 1068px),
(max-height: 715px) {
    .section-display .glass-display-iphonexs .glass-screen {
        margin-left: 12px;
        margin-top: 10px
    }
}

@media only screen and (max-width: 735px),
(max-height: 585px) {
    .section-display .glass-display-iphonexs .glass-screen {
        margin-left: 12px;
        margin-top: 13px
    }
}

.section-display .glass-display-iphonexs .photo-preview {
    width: 240px;
    height: 517px;
    background-size: 240px 517px;
    background-repeat: no-repeat;
    background-image: url("screen_display_iphonexs_large.jpg");
    width: 240px;
    height: 517px;
    background-size: 240px 517px;
    background-repeat: no-repeat;
    background-image: url("screen_display_iphonexs_large.jpg")
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-display .glass-display-iphonexs .photo-preview {
        background-image: url("screen_display_iphonexs_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px) {
    .section-display .glass-display-iphonexs .photo-preview {
        width: 150px;
        height: 323px;
        background-size: 150px 323px;
        background-repeat: no-repeat;
        background-image: url("screen_display_iphonexs_medium.jpg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    .section-display .glass-display-iphonexs .photo-preview {
        background-image: url("screen_display_iphonexs_medium_2x.jpg")
    }
}

@media only screen and (max-width: 735px) {
    .section-display .glass-display-iphonexs .photo-preview {
        width: 130px;
        height: 257px;
        background-size: 130px 257px;
        background-repeat: no-repeat;
        background-image: url("screen_display_iphonexs_small.jpg")
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi) {
    .section-display .glass-display-iphonexs .photo-preview {
        background-image: url("screen_display_iphonexs_small_2x.jpg")
    }
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-display .glass-display-iphonexs .photo-preview {
        background-image: url("screen_display_iphonexs_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px),
(max-height: 845px) {
    .section-display .glass-display-iphonexs .photo-preview {
        width: 192px;
        height: 414px;
        background-size: 192px 414px;
        background-repeat: no-repeat;
        background-image: url("screen_display_iphonexs_large.jpg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-height: 845px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-height: 845px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi),
(max-height: 845px) and (-webkit-min-device-pixel-ratio: 1.5),
(max-height: 845px) and (min-resolution: 144dpi) {
    .section-display .glass-display-iphonexs .photo-preview {
        background-image: url("screen_display_iphonexs_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px),
(max-height: 715px) {
    .section-display .glass-display-iphonexs .photo-preview {
        width: 150px;
        height: 323px;
        background-size: 150px 323px;
        background-repeat: no-repeat;
        background-image: url("screen_display_iphonexs_medium.jpg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-height: 715px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-height: 715px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi),
(max-height: 715px) and (-webkit-min-device-pixel-ratio: 1.5),
(max-height: 715px) and (min-resolution: 144dpi) {
    .section-display .glass-display-iphonexs .photo-preview {
        background-image: url("screen_display_iphonexs_medium_2x.jpg")
    }
}

@media only screen and (max-width: 735px),
(max-height: 585px) {
    .section-display .glass-display-iphonexs .photo-preview {
        width: 130px;
        height: 257px;
        background-size: 130px 257px;
        background-repeat: no-repeat;
        background-image: url("screen_display_iphonexs_small.jpg")
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-height: 585px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-height: 585px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi),
(max-height: 585px) and (-webkit-min-device-pixel-ratio: 1.5),
(max-height: 585px) and (min-resolution: 144dpi) {
    .section-display .glass-display-iphonexs .photo-preview {
        background-image: url("screen_display_iphonexs_small_2x.jpg")
    }
}

.section-display .scaling-hardware {
    display: none;
    position: absolute;
    z-index: 2;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%)
}

.section-display.enhanced .scaling-hardware {
    display: block
}

.section-display .scaling-hardware-image {
    width: 1372px;
    height: 2776px;
    background-size: 1372px 2776px;
    background-repeat: no-repeat;
    background-image: url("super_retina_fallback_large.png");
    width: 1372px;
    height: 2776px;
    background-size: 1372px 2776px;
    background-repeat: no-repeat;
    background-image: url("super_retina_fallback_large.png");
    -webkit-transform: scale(0.22);
    transform: scale(0.22);
    -webkit-transform-origin: center top;
    transform-origin: center top;
    margin-top: -5px
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-display .scaling-hardware-image {
        background-image: url("super_retina_fallback_large_2x.png")
    }
}

html.css-mask .section-display .scaling-hardware-image {
    width: 1372px;
    height: 2776px;
    background-size: 1372px 2776px;
    background-repeat: no-repeat;
    background-image: url("super_retina_large.jpg");
    -webkit-mask-size: 1372px 2776px;
    mask-size: 1372px 2776px;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-image: url("super_retina_mask_large.svg");
    mask-image: url("super_retina_mask_large.svg")
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    html.css-mask .section-display .scaling-hardware-image {
        background-image: url("super_retina_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px) {
    .section-display .scaling-hardware-image {
        width: 790px;
        height: 1572px;
        background-size: 790px 1572px;
        background-repeat: no-repeat;
        background-image: url("super_retina_fallback_medium.png")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    .section-display .scaling-hardware-image {
        background-image: url("super_retina_fallback_medium_2x.png")
    }
}

@media only screen and (max-width: 1068px) {
    html.css-mask .section-display .scaling-hardware-image {
        width: 790px;
        height: 1572px;
        background-size: 790px 1572px;
        background-repeat: no-repeat;
        background-image: url("super_retina_medium.jpg");
        -webkit-mask-size: 790px 1572px;
        mask-size: 790px 1572px;
        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;
        -webkit-mask-image: url("super_retina_mask_medium.svg");
        mask-image: url("super_retina_mask_medium.svg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    html.css-mask .section-display .scaling-hardware-image {
        background-image: url("super_retina_medium_2x.jpg")
    }
}

@media only screen and (max-width: 735px) {
    .section-display .scaling-hardware-image {
        width: 324px;
        height: 648px;
        background-size: 324px 648px;
        background-repeat: no-repeat;
        background-image: url("super_retina_fallback_small.png")
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi) {
    .section-display .scaling-hardware-image {
        background-image: url("super_retina_fallback_small_2x.png")
    }
}

@media only screen and (max-width: 735px) {
    html.css-mask .section-display .scaling-hardware-image {
        width: 324px;
        height: 648px;
        background-size: 324px 648px;
        background-repeat: no-repeat;
        background-image: url("super_retina_small.jpg");
        -webkit-mask-size: 324px 648px;
        mask-size: 324px 648px;
        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;
        -webkit-mask-image: url("super_retina_mask_small.svg");
        mask-image: url("super_retina_mask_small.svg")
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi) {
    html.css-mask .section-display .scaling-hardware-image {
        background-image: url("super_retina_small_2x.jpg")
    }
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-display .scaling-hardware-image {
        background-image: url("super_retina_fallback_large_2x.png")
    }
}

html.css-mask .section-display .scaling-hardware-image {
    width: 1372px;
    height: 2776px;
    background-size: 1372px 2776px;
    background-repeat: no-repeat;
    background-image: url("super_retina_large.jpg");
    -webkit-mask-size: 1372px 2776px;
    mask-size: 1372px 2776px;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-image: url("super_retina_mask_large.svg");
    mask-image: url("super_retina_mask_large.svg")
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    html.css-mask .section-display .scaling-hardware-image {
        background-image: url("super_retina_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px),
(max-height: 845px) {
    .section-display .scaling-hardware-image {
        width: 1098px;
        height: 2221px;
        background-size: 1098px 2221px;
        background-repeat: no-repeat;
        background-image: url("super_retina_fallback_large.png")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-height: 845px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-height: 845px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi),
(max-height: 845px) and (-webkit-min-device-pixel-ratio: 1.5),
(max-height: 845px) and (min-resolution: 144dpi) {
    .section-display .scaling-hardware-image {
        background-image: url("super_retina_fallback_large_2x.png")
    }
}

@media only screen and (max-width: 1068px),
(max-height: 845px) {
    html.css-mask .section-display .scaling-hardware-image {
        width: 1098px;
        height: 2221px;
        background-size: 1098px 2221px;
        background-repeat: no-repeat;
        background-image: url("super_retina_large.jpg");
        -webkit-mask-size: 1098px 2221px;
        mask-size: 1098px 2221px;
        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;
        -webkit-mask-image: url("super_retina_mask_large.svg");
        mask-image: url("super_retina_mask_large.svg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-height: 845px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-height: 845px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi),
(max-height: 845px) and (-webkit-min-device-pixel-ratio: 1.5),
(max-height: 845px) and (min-resolution: 144dpi) {
    html.css-mask .section-display .scaling-hardware-image {
        background-image: url("super_retina_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px),
(max-height: 715px) {
    .section-display .scaling-hardware-image {
        width: 790px;
        height: 1572px;
        background-size: 790px 1572px;
        background-repeat: no-repeat;
        background-image: url("super_retina_fallback_medium.png")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-height: 715px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-height: 715px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi),
(max-height: 715px) and (-webkit-min-device-pixel-ratio: 1.5),
(max-height: 715px) and (min-resolution: 144dpi) {
    .section-display .scaling-hardware-image {
        background-image: url("super_retina_fallback_medium_2x.png")
    }
}

@media only screen and (max-width: 1068px),
(max-height: 715px) {
    html.css-mask .section-display .scaling-hardware-image {
        width: 790px;
        height: 1572px;
        background-size: 790px 1572px;
        background-repeat: no-repeat;
        background-image: url("super_retina_medium.jpg");
        -webkit-mask-size: 790px 1572px;
        mask-size: 790px 1572px;
        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;
        -webkit-mask-image: url("super_retina_mask_medium.svg");
        mask-image: url("super_retina_mask_medium.svg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-height: 715px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-height: 715px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi),
(max-height: 715px) and (-webkit-min-device-pixel-ratio: 1.5),
(max-height: 715px) and (min-resolution: 144dpi) {
    html.css-mask .section-display .scaling-hardware-image {
        background-image: url("super_retina_medium_2x.jpg")
    }
}

@media only screen and (max-width: 735px),
(max-height: 585px) {
    .section-display .scaling-hardware-image {
        width: 324px;
        height: 648px;
        background-size: 324px 648px;
        background-repeat: no-repeat;
        background-image: url("super_retina_fallback_small.png")
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-height: 585px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-height: 585px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi),
(max-height: 585px) and (-webkit-min-device-pixel-ratio: 1.5),
(max-height: 585px) and (min-resolution: 144dpi) {
    .section-display .scaling-hardware-image {
        background-image: url("super_retina_fallback_small_2x.png")
    }
}

@media only screen and (max-width: 735px),
(max-height: 585px) {
    html.css-mask .section-display .scaling-hardware-image {
        width: 324px;
        height: 648px;
        background-size: 324px 648px;
        background-repeat: no-repeat;
        background-image: url("super_retina_small.jpg");
        -webkit-mask-size: 324px 648px;
        mask-size: 324px 648px;
        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;
        -webkit-mask-image: url("super_retina_mask_small.svg");
        mask-image: url("super_retina_mask_small.svg")
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-height: 585px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-height: 585px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi),
(max-height: 585px) and (-webkit-min-device-pixel-ratio: 1.5),
(max-height: 585px) and (min-resolution: 144dpi) {
    html.css-mask .section-display .scaling-hardware-image {
        background-image: url("super_retina_small_2x.jpg")
    }
}

@media only screen and (max-width: 1068px),
(max-height: 845px) {
    .section-display .scaling-hardware-image {
        margin-top: -4px
    }
}

@media only screen and (max-width: 1068px),
(max-height: 715px) {
    .section-display .scaling-hardware-image {
        margin-top: 3px
    }
}

@media only screen and (max-width: 735px),
(max-height: 585px) {
    .section-display .scaling-hardware-image {
        margin-top: 0.5px
    }
}

@media only screen and (max-width: 1068px),
(max-height: 845px) {
    .section-display .scaling-hardware .canvas-grid {
        -webkit-transform: scale(0.8);
        transform: scale(0.8);
        -webkit-transform-origin: top left;
        transform-origin: top left
    }
}

@media only screen and (max-width: 1068px),
(max-height: 715px) {
    .section-display .scaling-hardware .canvas-grid {
        -webkit-transform: none;
        transform: none
    }
}

.section-display .sliding-hardware {
    position: relative;
    z-index: 1;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-transform-origin: center top;
    transform-origin: center top
}

@media only screen and (max-width: 735px),
(max-height: 585px) {
    .section-display .iphone8-models {
        visibility: hidden;
        display: none
    }
}

.section-display .iphonexs-models {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    z-index: 1;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    pointer-events: none;
    width: 604px
}

.section-display .iphonexs-models .hardware-iphonexsmax {
    -webkit-transform: translateX(-196.5px);
    transform: translateX(-196.5px)
}

.section-display[data-display-animation-flipped] .iphonexs-models .hardware-iphonexsmax {
    -webkit-transform: translateX(calc(100% + 196.5px));
    transform: translateX(calc(100% + 196.5px))
}

.section-display .iphonexs-models .hardware-iphonexs {
    -webkit-transform: translateX(196.5px);
    transform: translateX(196.5px)
}

.section-display[data-display-animation-flipped] .iphonexs-models .hardware-iphonexs {
    -webkit-transform: translateX(calc(-100% - 196.5px));
    transform: translateX(calc(-100% - 196.5px))
}

@media only screen and (max-width: 1068px),
(max-height: 845px) {
    .section-display .iphonexs-models {
        width: 484px
    }
    .section-display .iphonexs-models .hardware-iphonexsmax {
        -webkit-transform: translateX(-157px);
        transform: translateX(-157px)
    }
    .section-display[data-display-animation-flipped] .iphonexs-models .hardware-iphonexsmax {
        -webkit-transform: translateX(calc(100% + 157px));
        transform: translateX(calc(100% + 157px))
    }
    .section-display .iphonexs-models .hardware-iphonexs {
        -webkit-transform: translateX(157px);
        transform: translateX(157px)
    }
    .section-display[data-display-animation-flipped] .iphonexs-models .hardware-iphonexs {
        -webkit-transform: translateX(calc(-100% - 157px));
        transform: translateX(calc(-100% - 157px))
    }
}

@media only screen and (max-width: 1068px),
(max-height: 715px) {
    .section-display .iphonexs-models {
        width: 380px
    }
    .section-display .iphonexs-models .hardware-iphonexsmax {
        -webkit-transform: translateX(-126px);
        transform: translateX(-126px)
    }
    .section-display[data-display-animation-flipped] .iphonexs-models .hardware-iphonexsmax {
        -webkit-transform: translateX(calc(100% + 126px));
        transform: translateX(calc(100% + 126px))
    }
    .section-display .iphonexs-models .hardware-iphonexs {
        -webkit-transform: translateX(126px);
        transform: translateX(126px)
    }
    .section-display[data-display-animation-flipped] .iphonexs-models .hardware-iphonexs {
        -webkit-transform: translateX(calc(-100% - 126px));
        transform: translateX(calc(-100% - 126px))
    }
}

@media only screen and (max-width: 735px),
(max-height: 585px) {
    .section-display .iphonexs-models {
        width: 362px
    }
    .section-display .iphonexs-models .hardware-iphonexsmax {
        -webkit-transform: translateX(-93px);
        transform: translateX(-93px)
    }
    .section-display[data-display-animation-flipped] .iphonexs-models .hardware-iphonexsmax {
        -webkit-transform: translateX(calc(100% + 93px));
        transform: translateX(calc(100% + 93px))
    }
    .section-display .iphonexs-models .hardware-iphonexs {
        -webkit-transform: translateX(93px);
        transform: translateX(93px)
    }
    .section-display[data-display-animation-flipped] .iphonexs-models .hardware-iphonexs {
        -webkit-transform: translateX(calc(-100% - 93px));
        transform: translateX(calc(-100% - 93px))
    }
}

@media only screen and (max-width: 735px),
(max-height: 585px) {
    .section-display .iphonexs-models {
        position: relative
    }
    .section-display .iphonexs-models .hardware-iphonexsmax {
        -webkit-transform: translateX(24px);
        transform: translateX(24px)
    }
    .section-display[data-display-animation-flipped] .iphonexs-models .hardware-iphonexsmax {
        -webkit-transform: translateX(calc(100% + -24px));
        transform: translateX(calc(100% + -24px))
    }
    .section-display .iphonexs-models .hardware-iphonexs {
        -webkit-transform: translateX(-24px);
        transform: translateX(-24px)
    }
    .section-display[data-display-animation-flipped] .iphonexs-models .hardware-iphonexs {
        -webkit-transform: translateX(calc(-100% - -24px));
        transform: translateX(calc(-100% - -24px))
    }
}

.section-display .gallery,
.section-display .gallery-item {
    width: 305px;
    height: 610px;
    width: 305px;
    height: 610px;
    background: #000;
    overflow: hidden
}

@media only screen and (max-width: 1068px) {
    .section-display .gallery,
    .section-display .gallery-item {
        width: 192px;
        height: 381px
    }
}

@media only screen and (max-width: 735px) {
    .section-display .gallery,
    .section-display .gallery-item {
        width: 142px;
        height: 282px
    }
}

@media only screen and (max-width: 1068px),
(max-height: 845px) {
    .section-display .gallery,
    .section-display .gallery-item {
        width: 244px;
        height: 488px
    }
}

@media only screen and (max-width: 1068px),
(max-height: 715px) {
    .section-display .gallery,
    .section-display .gallery-item {
        width: 192px;
        height: 381px
    }
}

@media only screen and (max-width: 735px),
(max-height: 585px) {
    .section-display .gallery,
    .section-display .gallery-item {
        width: 142px;
        height: 282px
    }
}

.section-display .gallery-item:nth-child(n+2),
.section-display .tabnav-item:nth-child(n+2) {
    display: none
}

.section-display.enhanced .gallery-item:nth-child(n+2),
.section-display.enhanced .tabnav-item:nth-child(n+2) {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.section-display .tabnav {
    position: relative
}

.section-display .tabnav-items {
    margin-left: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    list-style: none
}

.section-display .tabnav a {
    text-decoration: none;
    color: #ffe5db;
    pointer-events: none;
    display: inline-block;
    -webkit-transition: color .5s;
    transition: color .5s
}

.section-display .tabnav a:not(.current) {
    color: rgba(255, 229, 219, 0.5);
    pointer-events: auto
}

.section-display .tabnav a:not(.current):hover {
    color: rgba(255, 229, 219, 0.35)
}

.section-display .tabnav li {
    margin: 0 14px
}

@media only screen and (max-width: 1068px),
(max-height: 715px) {
    .section-display .tabnav li {
        margin: 0 9px
    }
}

.section-display .tabnav li::before {
    content: '•';
    position: absolute;
    z-index: 1;
    color: rgba(255, 229, 219, 0.5);
    margin-left: -17px;
    margin-top: 6px;
    font-size: 14px
}

@media only screen and (max-width: 1068px),
(max-height: 715px) {
    .section-display .tabnav li::before {
        margin-left: -11px;
        margin-top: 3px;
        font-size: 12px
    }
}

.section-display .tabnav li:first-child::before {
    display: none
}

.section-display .sticky-container {
    opacity: 0;
    -webkit-transition: opacity 0.5s;
    transition: opacity 0.5s
}

html.no-js .section-display .sticky-container {
    opacity: 1
}

.section-display.ready .sticky-container {
    opacity: 1
}

.section-display.enhanced .sticky-container {
    pointer-events: none;
    margin-top: -100vh;
    height: calc(275vh + 300px)
}

@media only screen and (max-width: 735px),
(max-height: 585px) {
    .section-display.enhanced .sticky-container {
        height: calc(175vh + 300px)
    }
}

.section-display.enhanced .sticky-item {
    position: -webkit-sticky;
    position: sticky;
    z-index: 1;
    top: 52px;
    min-height: initial;
    height: calc(100vh - 52px)
}

.section-display .flex-container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.section-display .small-compare {
    display: none;
    overflow: hidden;
    margin-top: 135px;
    width: 100%;
    max-width: 350px
}

.section-display.enhanced .small-compare {
    margin-top: 0
}

@media only screen and (max-width: 735px),
(max-height: 585px) {
    .section-display .small-compare {
        display: block
    }
}

.section-display .small-compare .section-content {
    margin-left: auto;
    margin-right: auto;
    width: 87.5%
}

.section-display .small-compare .hardware-column {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    margin: 0 11px
}

.section-display .small-compare .hardware-images {
    position: relative
}

.section-display .small-compare .hardware-images,
.section-display .small-compare .hardware-images>figure {
    width: 265px;
    height: 571px;
    width: 265px;
    height: 571px
}

@media only screen and (max-width: 1068px) {
    .section-display .small-compare .hardware-images,
    .section-display .small-compare .hardware-images>figure {
        width: 166px;
        height: 357px
    }
}

@media only screen and (max-width: 735px) {
    .section-display .small-compare .hardware-images,
    .section-display .small-compare .hardware-images>figure {
        width: 141px;
        height: 282px
    }
}

@media only screen and (max-width: 1068px),
(max-height: 845px) {
    .section-display .small-compare .hardware-images,
    .section-display .small-compare .hardware-images>figure {
        width: 212px;
        height: 457px
    }
}

@media only screen and (max-width: 1068px),
(max-height: 715px) {
    .section-display .small-compare .hardware-images,
    .section-display .small-compare .hardware-images>figure {
        width: 166px;
        height: 357px
    }
}

@media only screen and (max-width: 735px),
(max-height: 585px) {
    .section-display .small-compare .hardware-images,
    .section-display .small-compare .hardware-images>figure {
        width: 141px;
        height: 282px
    }
}

.section-display .small-compare .hardware-images>figure {
    position: absolute;
    top: 0;
    left: 0;
    background-position: center bottom;
    background-color: #000
}

.section-display .small-compare .hardware-images>figure:not(.current) {
    z-index: 1
}

.section-display .small-compare .hardware-images>figure.current {
    z-index: 2;
    -webkit-animation: fadein .5s;
    animation: fadein .5s
}

.section-display .small-compare .hardware-selector {
    width: 100%;
    position: relative;
    background: #000;
    border-bottom: 1px solid #58504D;
    margin-bottom: 41px
}

.section-display .small-compare .hardware-selector-dropdown {
    width: 100%;
    height: 2em;
    min-height: 40px;
    margin: 0;
    color: #ffe5db;
    background: transparent;
    border: 0;
    border-radius: 0;
    overflow: hidden;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none
}

.section-display .small-compare .hardware-selector-dropdown:not(:disabled) {
    cursor: pointer
}

.section-display .small-compare .hardware-selector-dropdown::-ms-expand {
    display: none
}

.section-display .small-compare .hardware-selector-dropdown::-ms-value {
    color: #fff;
    background: transparent
}

.section-display .small-compare .hardware-selector-dropdown option {
    color: black !important
}

.section-display .small-compare .hardware-selector-dropdown[data-focus-method='mouse'],
.section-display .small-compare .hardware-selector-dropdown[data-focus-method='touch'] {
    outline: 0
}

.section-display .small-compare .hardware-selector-dropdown[disabled],
.section-display .small-compare .hardware-selector-dropdown:disabled {
    cursor: initial
}

.section-display .small-compare .hardware-selector-dropdown[disabled]+.hardware-selector-icon,
.section-display .small-compare .hardware-selector-dropdown:disabled+.hardware-selector-icon {
    display: none
}

.section-display .small-compare .hardware-selector-icon {
    right: 0;
    display: block;
    position: absolute;
    top: 50%;
    margin-top: -10px;
    font-size: 20px;
    line-height: 1;
    color: #ffe5db;
    pointer-events: none
}

.section-materials .will-change {
    will-change: transform, opacity
}

.section-materials .sticky-wrapper {
    background: #000;
    background: -webkit-gradient(linear, left top, left bottom, from(#000), to(#121212));
    background: -webkit-linear-gradient(#000, #121212);
    background: linear-gradient(#000, #121212);
    position: relative;
    z-index: 0;
    overflow: hidden;
    margin-top: 13px
}

@media only screen and (min-width: 736px) {
    html.materials-enhanced .section-materials .sticky-wrapper {
        height: 200vh;
        min-height: 1500px;
        overflow: visible;
        background: none
    }
}

@media only screen and (max-width: 1068px) {
    .section-materials .sticky-wrapper {
        margin-top: 0
    }
}

@media only screen and (max-width: 735px) {
    .section-materials .sticky-wrapper {
        background: none;
        margin-top: 60px
    }
}

@media only screen and (min-width: 736px) {
    html.materials-enhanced .section-materials .sticky-wrapper .enhanced-wrapper {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        height: 100vh;
        min-height: 750px
    }
}

@media only screen and (min-width: 736px) and (max-width: 1068px) {
    html.materials-enhanced .section-materials .sticky-wrapper .enhanced-wrapper {
        max-height: 1110px
    }
}

@media only screen and (min-width: 736px) {
    html.materials-enhanced .section-materials .sticky-wrapper .sticky {
        position: -webkit-sticky;
        position: sticky;
        z-index: 0;
        top: 0
    }
}

.section-materials .hardware-wrapper {
    overflow: hidden;
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 0
}

@media only screen and (min-width: 736px) {
    html.materials-enhanced .section-materials .hardware-wrapper {
        position: relative;
        background: #000;
        background: -webkit-gradient(linear, left top, left bottom, from(#000), to(#121212));
        background: -webkit-linear-gradient(#000, #121212);
        background: linear-gradient(#000, #121212)
    }
}

@media only screen and (max-width: 1068px) {
    .section-materials .hardware-wrapper {
        top: 0
    }
}

@media only screen and (max-width: 735px) {
    .section-materials .hardware-wrapper {
        position: static;
        height: initial;
        overflow: visible
    }
    .section-materials .hardware-wrapper>.section-content {
        width: 100%
    }
}

@media only screen and (max-width: 735px) {
    .section-materials .hardware-wrapper .row {
        position: relative;
        z-index: 0;
        margin: 0 auto;
        background: #000;
        background: -webkit-gradient(linear, left top, left bottom, from(#000), to(#121212));
        background: -webkit-linear-gradient(#000, #121212);
        background: linear-gradient(#000, #121212)
    }
}

.section-materials .figure-wrapper {
    position: relative;
    top: 150px;
    z-index: 0
}

@media only screen and (max-width: 735px) {
    .section-materials .figure-wrapper {
        position: static
    }
    .section-materials .figure-wrapper-left,
    .section-materials .figure-wrapper-right {
        display: none
    }
}

.section-materials .figure-wrapper-center {
    width: 100%
}

.section-materials .figure-wrapper figure.center {
    position: relative;
    left: 50%;
    margin-left: -53.5px;
    width: 107px;
    height: 1440px;
    background-size: 107px 1440px;
    background-repeat: no-repeat;
    background-image: url("fit_finish_gold_large.png")
}

@media only screen and (max-width: 1068px) {
    .section-materials .figure-wrapper figure.center {
        left: 50%;
        margin-left: -36px
    }
}

@media only screen and (max-width: 735px) {
    .section-materials .figure-wrapper figure.center {
        left: 50%;
        margin-left: -135.5px
    }
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-materials .figure-wrapper figure.center {
        background-image: url("fit_finish_gold_large_2x.png")
    }
}

@media only screen and (max-width: 1068px) {
    .section-materials .figure-wrapper figure.center {
        width: 72px;
        height: 969px;
        background-size: 72px 969px;
        background-repeat: no-repeat;
        background-image: url("fit_finish_gold_medium.png")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    .section-materials .figure-wrapper figure.center {
        background-image: url("fit_finish_gold_medium_2x.png")
    }
}

@media only screen and (max-width: 735px) {
    .section-materials .figure-wrapper figure.center {
        width: 271px;
        height: 245px;
        background-size: 271px 245px;
        background-repeat: no-repeat;
        background-image: url("fit_finish_gold_small.png")
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi) {
    .section-materials .figure-wrapper figure.center {
        background-image: url("fit_finish_gold_small_2x.png")
    }
}

@media only screen and (max-width: 735px) {
    .section-materials .figure-wrapper figure.center {
        position: relative;
        z-index: 0;
        margin: 0 auto;
        left: auto;
        right: auto
    }
}

@media only screen and (min-width: 736px) {
    html.materials-enhanced .section-materials .figure-wrapper {
        position: absolute
    }
    html.materials-enhanced .section-materials .figure-wrapper-left {
        left: 100px
    }
    html.materials-enhanced .section-materials .figure-wrapper figure.left {
        width: 107px;
        height: 1440px;
        background-size: 107px 1440px;
        background-repeat: no-repeat;
        background-image: url("fit_finish_silver_large.png")
    }
}

@media only screen and (min-width: 736px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-width: 736px) and (min-resolution: 1.5dppx),
only screen and (min-width: 736px) and (min-resolution: 144dpi) {
    html.materials-enhanced .section-materials .figure-wrapper figure.left {
        background-image: url("fit_finish_silver_large_2x.png")
    }
}

@media only screen and (min-width: 736px) and (max-width: 1068px) {
    html.materials-enhanced .section-materials .figure-wrapper figure.left {
        width: 72px;
        height: 969px;
        background-size: 72px 969px;
        background-repeat: no-repeat;
        background-image: url("fit_finish_silver_medium.png")
    }
}

@media only screen and (min-width: 736px) and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-width: 736px) and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (min-width: 736px) and (max-width: 1068px) and (min-resolution: 144dpi) {
    html.materials-enhanced .section-materials .figure-wrapper figure.left {
        background-image: url("fit_finish_silver_medium_2x.png")
    }
}

@media only screen and (min-width: 736px) {
    html.materials-enhanced .section-materials .figure-wrapper-right {
        right: 100px
    }
    html.materials-enhanced .section-materials .figure-wrapper figure.right {
        width: 107px;
        height: 1440px;
        background-size: 107px 1440px;
        background-repeat: no-repeat;
        background-image: url("fit_finish_space_gray_large.png")
    }
}

@media only screen and (min-width: 736px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-width: 736px) and (min-resolution: 1.5dppx),
only screen and (min-width: 736px) and (min-resolution: 144dpi) {
    html.materials-enhanced .section-materials .figure-wrapper figure.right {
        background-image: url("fit_finish_space_gray_large_2x.png")
    }
}

@media only screen and (min-width: 736px) and (max-width: 1068px) {
    html.materials-enhanced .section-materials .figure-wrapper figure.right {
        width: 72px;
        height: 969px;
        background-size: 72px 969px;
        background-repeat: no-repeat;
        background-image: url("fit_finish_space_gray_medium.png")
    }
}

@media only screen and (min-width: 736px) and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-width: 736px) and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (min-width: 736px) and (max-width: 1068px) and (min-resolution: 144dpi) {
    html.materials-enhanced .section-materials .figure-wrapper figure.right {
        background-image: url("fit_finish_space_gray_medium_2x.png")
    }
}

.section-materials .copy-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding-top: 235px;
    padding-bottom: 80px
}

.section-materials .copy-wrapper:last-child::before {
    content: '';
    -webkit-box-ordinal-group: 1;
    -ms-flex-order: 0;
    order: 0
}

.section-materials .copy-wrapper:last-child::after {
    content: '';
    -webkit-box-ordinal-group: 5;
    -ms-flex-order: 4;
    order: 4
}

@media only screen and (min-width: 736px) {
    html.materials-enhanced .section-materials .copy-wrapper {
        -ms-flex-pack: distribute;
        justify-content: space-around;
        height: 100vh;
        min-height: 750px;
        padding: 0
    }
}

@media only screen and (max-width: 1068px) {
    .section-materials .copy-wrapper {
        padding-top: 170px
    }
}

@media only screen and (max-width: 735px) {
    .section-materials .copy-wrapper {
        padding-top: 30px;
        padding-bottom: 20px
    }
}

@media only screen and (max-width: 735px) {
    .section-materials .copy-wrapper .copy {
        padding-top: 30px
    }
}

@media only screen and (min-width: 736px) {
    html.materials-enhanced .section-materials .copy-wrapper .copy {
        margin: 0
    }
}

.section-materials .copy-wrapper .copy:nth-child(1) {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1
}

@media only screen and (max-width: 735px) {
    .section-materials .copy-wrapper .copy:nth-child(1) {
        margin-top: 0;
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1
    }
}

.section-materials .copy-wrapper .copy:nth-child(2) {
    margin-top: 45px;
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2
}

@media only screen and (max-width: 735px) {
    .section-materials .copy-wrapper .copy:nth-child(2) {
        margin-top: 0;
        -webkit-box-ordinal-group: 4;
        -ms-flex-order: 3;
        order: 3
    }
}

.section-materials .copy-wrapper .copy:nth-child(3) {
    margin-top: 60px;
    -webkit-box-ordinal-group: 4;
    -ms-flex-order: 3;
    order: 3
}

@media only screen and (max-width: 735px) {
    .section-materials .copy-wrapper .copy:nth-child(3) {
        margin-top: 0;
        -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
        order: 2
    }
}

.section-face-id .manifesto-wrapper {
    position: relative;
    padding-top: 190px;
    padding-bottom: 140px;
    overflow: hidden
}

@media only screen and (max-width: 1068px) {
    .section-face-id .manifesto-wrapper {
        padding-top: 132px;
        padding-bottom: 100px
    }
}

@media only screen and (max-width: 735px) {
    .section-face-id .manifesto-wrapper {
        padding-top: 108px;
        padding-bottom: 90px
    }
}

html.faceid-enhanced .section-face-id .manifesto-wrapper {
    padding-bottom: 0 !important
}

.section-face-id .manifesto-shadow {
    display: none;
    height: 500px;
    width: 100%;
    position: absolute;
    bottom: 0;
    background: -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(75%, #000));
    background: -webkit-linear-gradient(top, transparent, #000 75%);
    background: linear-gradient(to bottom, transparent, #000 75%);
    will-change: opacity, transform;
    pointer-events: none
}

html.faceid-enhanced .section-face-id .manifesto-shadow {
    display: block
}

.section-face-id .faceid-sticky-container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: relative;
    width: 100%;
    pointer-events: none
}

html.faceid-enhanced .section-face-id .faceid-sticky-container {
    min-height: 1022px;
    height: 165vh
}

@media only screen and (max-width: 1068px) {
    html.faceid-enhanced .section-face-id .faceid-sticky-container {
        min-height: 792px
    }
}

@media only screen and (max-width: 735px) {
    html.faceid-enhanced .section-face-id .faceid-sticky-container {
        min-height: 470px
    }
}

.section-face-id .faceid-sticky-container .chip-transition-prep {
    z-index: -1
}

.section-face-id .faceid-sticky-container .will-change {
    will-change: transform
}

html.faceid-enhanced .section-face-id .faceid-sticky-container .sticky-aligner {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    height: 100vh;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.section-face-id .faceid-sticky-container .faceid-device-zoom {
    position: relative;
    width: 514px;
    height: 1022px
}

.section-face-id .faceid-sticky-container .faceid-device-zoom .inline-video-media {
    z-index: 1;
    position: relative;
    width: 442px;
    height: 956px
}

@media only screen and (max-width: 1068px) {
    .section-face-id .faceid-sticky-container .faceid-device-zoom .inline-video-media {
        width: 344px;
        height: 746px
    }
}

@media only screen and (max-width: 735px) {
    .section-face-id .faceid-sticky-container .faceid-device-zoom .inline-video-media {
        width: 204px;
        height: 442px
    }
}

.section-face-id .faceid-sticky-container .faceid-device-zoom .inline-video-frame-static {
    background-size: 442px 956px;
    background-repeat: no-repeat;
    background-image: url("screen_faceid_static_large.jpg")
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-face-id .faceid-sticky-container .faceid-device-zoom .inline-video-frame-static {
        background-image: url("screen_faceid_static_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px) {
    .section-face-id .faceid-sticky-container .faceid-device-zoom .inline-video-frame-static {
        background-size: 344px 746px;
        background-repeat: no-repeat;
        background-image: url("screen_faceid_static_medium.jpg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    .section-face-id .faceid-sticky-container .faceid-device-zoom .inline-video-frame-static {
        background-image: url("screen_faceid_static_medium_2x.jpg")
    }
}

@media only screen and (max-width: 735px) {
    .section-face-id .faceid-sticky-container .faceid-device-zoom .inline-video-frame-static {
        background-size: 204px 442px;
        background-repeat: no-repeat;
        background-image: url("screen_faceid_static_small.jpg")
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi) {
    .section-face-id .faceid-sticky-container .faceid-device-zoom .inline-video-frame-static {
        background-image: url("screen_faceid_static_small_2x.jpg")
    }
}

.section-face-id .faceid-sticky-container .faceid-device-zoom .inline-video-frame-start {
    background-size: 442px 956px;
    background-repeat: no-repeat;
    background-image: url("screen_faceid_startframe_large.jpg")
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-face-id .faceid-sticky-container .faceid-device-zoom .inline-video-frame-start {
        background-image: url("screen_faceid_startframe_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px) {
    .section-face-id .faceid-sticky-container .faceid-device-zoom .inline-video-frame-start {
        background-size: 344px 746px;
        background-repeat: no-repeat;
        background-image: url("screen_faceid_startframe_medium.jpg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    .section-face-id .faceid-sticky-container .faceid-device-zoom .inline-video-frame-start {
        background-image: url("screen_faceid_startframe_medium_2x.jpg")
    }
}

@media only screen and (max-width: 735px) {
    .section-face-id .faceid-sticky-container .faceid-device-zoom .inline-video-frame-start {
        background-size: 204px 442px;
        background-repeat: no-repeat;
        background-image: url("screen_faceid_startframe_small.jpg")
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi) {
    .section-face-id .faceid-sticky-container .faceid-device-zoom .inline-video-frame-start {
        background-image: url("screen_faceid_startframe_small_2x.jpg")
    }
}

@media only screen and (max-width: 1068px) {
    .section-face-id .faceid-sticky-container .faceid-device-zoom {
        width: 396px;
        height: 792px
    }
}

@media only screen and (max-width: 735px) {
    .section-face-id .faceid-sticky-container .faceid-device-zoom {
        width: 236px;
        height: 470px
    }
}

.section-face-id .faceid-sticky-container .faceid-device-zoom .faceid-device {
    position: relative
}

html.faceid-enhanced .section-face-id .faceid-sticky-container .faceid-device-zoom .faceid-device {
    opacity: 0.999;
    -webkit-transition: opacity 200ms ease-in-out;
    transition: opacity 200ms ease-in-out
}

.section-face-id .faceid-sticky-container .faceid-device-zoom .faceid-device .device-screen {
    z-index: 1;
    position: absolute;
    top: 33px;
    left: 36px;
    background-color: black
}

@media only screen and (max-width: 1068px) {
    .section-face-id .faceid-sticky-container .faceid-device-zoom .faceid-device .device-screen {
        top: 23px;
        left: 26px
    }
}

@media only screen and (max-width: 735px) {
    .section-face-id .faceid-sticky-container .faceid-device-zoom .faceid-device .device-screen {
        top: 14px;
        left: 16px
    }
}

.section-face-id .faceid-sticky-container .faceid-device-zoom .faceid-device .device-screen .anim-screen-toggle {
    opacity: 0;
    -webkit-transition: opacity 300ms ease-in-out;
    transition: opacity 300ms ease-in-out
}

html.no-js .section-face-id .faceid-sticky-container .faceid-device-zoom .faceid-device .device-screen .anim-screen-toggle {
    opacity: 0.999
}

.section-face-id .faceid-sticky-container .faceid-device-zoom .faceid-device .device-screen .anim-screen-toggle.active {
    opacity: 0.999
}

html.reduced-motion .section-face-id .faceid-sticky-container .faceid-device-zoom .faceid-device .device-screen .inline-video-frame-start.frame-active {
    opacity: 0;
    visibility: hidden
}

html.reduced-motion .section-face-id .faceid-sticky-container .faceid-device-zoom .faceid-device .device-screen .inline-video-frame-static {
    opacity: 1;
    visibility: visible
}

.section-face-id .faceid-sticky-container .faceid-device-zoom .faceid-device .device-hardware {
    z-index: 2;
    position: relative;
    width: 514px;
    height: 1022px;
    background-size: 514px 1022px;
    background-repeat: no-repeat;
    background-image: url("hardware_faceid_gold_portrait_large.png")
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-face-id .faceid-sticky-container .faceid-device-zoom .faceid-device .device-hardware {
        background-image: url("hardware_faceid_gold_portrait_large_2x.png")
    }
}

@media only screen and (max-width: 1068px) {
    .section-face-id .faceid-sticky-container .faceid-device-zoom .faceid-device .device-hardware {
        width: 396px;
        height: 792px;
        background-size: 396px 792px;
        background-repeat: no-repeat;
        background-image: url("hardware_faceid_gold_portrait_medium.png")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    .section-face-id .faceid-sticky-container .faceid-device-zoom .faceid-device .device-hardware {
        background-image: url("hardware_faceid_gold_portrait_medium_2x.png")
    }
}

@media only screen and (max-width: 735px) {
    .section-face-id .faceid-sticky-container .faceid-device-zoom .faceid-device .device-hardware {
        width: 236px;
        height: 470px;
        background-size: 236px 470px;
        background-repeat: no-repeat;
        background-image: url("hardware_faceid_gold_portrait_small.png")
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi) {
    .section-face-id .faceid-sticky-container .faceid-device-zoom .faceid-device .device-hardware {
        background-image: url("hardware_faceid_gold_portrait_small_2x.png")
    }
}

.section-a12-bionic .chip-grid-asset-container {
    display: none
}

.section-a12-bionic .chip-grid-asset-container .screen-image-1 {
    background-repeat: no-repeat;
    background-image: url("a12/a12_screen_image_1_large.png")
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-a12-bionic .chip-grid-asset-container .screen-image-1 {
        background-image: url("a12/a12_screen_image_1_large_2x.png")
    }
}

@media only screen and (max-width: 1068px) {
    .section-a12-bionic .chip-grid-asset-container .screen-image-1 {
        background-repeat: no-repeat;
        background-image: url("a12/a12_screen_image_1_medium.png")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    .section-a12-bionic .chip-grid-asset-container .screen-image-1 {
        background-image: url("a12/a12_screen_image_1_medium_2x.png")
    }
}

@media only screen and (max-width: 735px) {
    .section-a12-bionic .chip-grid-asset-container .screen-image-1 {
        background-repeat: no-repeat;
        background-image: url("a12/a12_screen_image_1_small.png")
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi) {
    .section-a12-bionic .chip-grid-asset-container .screen-image-1 {
        background-image: url("a12/a12_screen_image_1_small_2x.png")
    }
}

.section-a12-bionic .chip-grid-asset-container .screen-image-2 {
    background-repeat: no-repeat;
    background-image: url("a12/a12_screen_image_2_large.jpg")
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-a12-bionic .chip-grid-asset-container .screen-image-2 {
        background-image: url("a12/a12_screen_image_2_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px) {
    .section-a12-bionic .chip-grid-asset-container .screen-image-2 {
        background-repeat: no-repeat;
        background-image: url("a12/a12_screen_image_2_medium.jpg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    .section-a12-bionic .chip-grid-asset-container .screen-image-2 {
        background-image: url("a12/a12_screen_image_2_medium_2x.jpg")
    }
}

@media only screen and (max-width: 735px) {
    .section-a12-bionic .chip-grid-asset-container .screen-image-2 {
        background-repeat: no-repeat;
        background-image: url("a12/a12_screen_image_2_small.jpg")
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi) {
    .section-a12-bionic .chip-grid-asset-container .screen-image-2 {
        background-image: url("a12/a12_screen_image_2_small_2x.jpg")
    }
}

.section-a12-bionic .chip-grid-asset-container .grid-image-1 {
    background-repeat: no-repeat;
    background-image: url("a12/a12_grid_1_large.png");
    width: 512px;
    height: 512px
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-a12-bionic .chip-grid-asset-container .grid-image-1 {
        background-image: url("a12/a12_grid_1_large_2x.png")
    }
}

@media only screen and (max-width: 1068px) {
    .section-a12-bionic .chip-grid-asset-container .grid-image-1 {
        background-repeat: no-repeat;
        background-image: url("a12/a12_grid_1_medium.png")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    .section-a12-bionic .chip-grid-asset-container .grid-image-1 {
        background-image: url("a12/a12_grid_1_medium_2x.png")
    }
}

@media only screen and (max-width: 1068px) {
    .section-a12-bionic .chip-grid-asset-container .grid-image-1 {
        width: 512px;
        height: 512px
    }
}

.section-a12-bionic .chip-grid-asset-container .text-overlay {
    background-repeat: no-repeat;
    background-image: url("a12/a12_intro_text_shadow_large.png");
    width: 500px;
    height: 500px
}

@media only screen and (max-width: 735px) {
    .section-a12-bionic .chip-grid-asset-container .text-overlay {
        background-repeat: no-repeat;
        background-image: url("a12/a12_intro_text_shadow_small.png")
    }
}

@media only screen and (max-width: 735px) {
    .section-a12-bionic .chip-grid-asset-container .text-overlay {
        width: 238px;
        height: 424px
    }
}

.section-a12-bionic .chip-grid-asset-container.progressive-image {
    background-image: none
}

.section-a12-bionic .section-content.small-copy-container {
    display: none
}

@media only screen and (max-width: 735px) {
    .section-a12-bionic .section-content.small-copy-container {
        display: block;
        overflow: hidden;
        height: auto;
        margin-top: calc(((100vh - 620px) / -2) - 80px);
        padding-bottom: 80px
    }
}

@media screen and (min-width: 736px) and (max-width: 1068px) and (max-height: 585px) {
    .section-a12-bionic .section-content.small-copy-container {
        display: block;
        width: 620px;
        height: 365px
    }
    .section-a12-bionic .section-content.small-copy-container .column-first {
        width: 50%;
        padding-right: 10px
    }
    .section-a12-bionic .section-content.small-copy-container .column-last {
        width: 50%;
        padding-left: 10px
    }
    .section-a12-bionic .section-content.small-copy-container .badge-caption {
        width: auto
    }
    .section-a12-bionic .section-content .chip-details .column-first,
    .section-a12-bionic .section-content .chip-details .column-last {
        display: none
    }
}

@media screen and (min-width: 1068px) and (max-height: 700px) {
    .section-a12-bionic .section-content.small-copy-container {
        display: block;
        width: 720px;
        height: 555px
    }
    .section-a12-bionic .section-content.small-copy-container .column-first {
        width: 50%;
        padding-right: 20px
    }
    .section-a12-bionic .section-content.small-copy-container .column-last {
        width: 50%;
        padding-left: 20px
    }
    .section-a12-bionic .section-content.small-copy-container .badge-caption {
        width: auto
    }
    .section-a12-bionic .section-content .chip-details .column-first,
    .section-a12-bionic .section-content .chip-details .column-last {
        display: none
    }
}

@media only screen and (max-width: 735px) {
    .section-a12-bionic .chip-details .column-first,
    .section-a12-bionic .chip-details .column-last {
        display: none
    }
}

.section-a12-bionic .chip-background-glow {
    position: absolute;
    top: 3px;
    left: 3px;
    opacity: 0;
    will-change: opacity;
    width: 424px;
    height: 424px;
    background-size: 424px 424px;
    background-repeat: no-repeat;
    background-image: url("a12/a12_glow_large.png")
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-a12-bionic .chip-background-glow {
        background-image: url("a12/a12_glow_large_2x.png")
    }
}

@media only screen and (max-width: 1068px) {
    .section-a12-bionic .chip-background-glow {
        width: 292px;
        height: 292px;
        background-size: 292px 292px;
        background-repeat: no-repeat;
        background-image: url("a12/a12_glow_medium.png")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    .section-a12-bionic .chip-background-glow {
        background-image: url("a12/a12_glow_medium_2x.png")
    }
}

@media only screen and (max-width: 1068px) {
    .section-a12-bionic .chip-background-glow {
        top: 1px;
        left: 1px
    }
}

.section-a12-bionic .chip-background {
    position: absolute;
    will-change: opacity;
    -webkit-transition-timing-function: ease-in;
    transition-timing-function: ease-in;
    -webkit-transition-duration: 0.5s;
    transition-duration: 0.5s;
    width: 900px;
    height: 900px;
    background-size: 900px 900px;
    background-repeat: no-repeat;
    background-image: url("a12/a12_chip_large.jpg")
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-a12-bionic .chip-background {
        background-image: url("a12/a12_chip_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px) {
    .section-a12-bionic .chip-background {
        width: 620px;
        height: 620px;
        background-size: 620px 620px;
        background-repeat: no-repeat;
        background-image: url("a12/a12_chip_medium.jpg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    .section-a12-bionic .chip-background {
        background-image: url("a12/a12_chip_medium_2x.jpg")
    }
}

.section-a12-bionic .components-grid {
    position: absolute;
    z-index: 1;
    top: 235px;
    left: 235px;
    width: 430px;
    height: 430px
}

@media only screen and (max-width: 1068px) {
    .section-a12-bionic .components-grid {
        top: 163px;
        left: 163px;
        width: 296px;
        height: 296px
    }
}

.section-a12-bionic .chip-headline-background-shadow {
    width: 242px;
    height: 188px;
    background-size: 242px 188px;
    background-repeat: no-repeat;
    background-image: url("a12/a12_label_shadow_large.png");
    position: absolute;
    z-index: 1;
    left: 11px;
    bottom: 11px;
    opacity: 0;
    will-change: opacity
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-a12-bionic .chip-headline-background-shadow {
        background-image: url("a12/a12_label_shadow_large_2x.png")
    }
}

@media only screen and (max-width: 1068px) {
    .section-a12-bionic .chip-headline-background-shadow {
        width: 166px;
        height: 130px;
        background-size: 166px 130px;
        background-repeat: no-repeat;
        background-image: url("a12/a12_label_shadow_medium.png")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    .section-a12-bionic .chip-headline-background-shadow {
        background-image: url("a12/a12_label_shadow_medium_2x.png")
    }
}

@media only screen and (max-width: 1068px) {
    .section-a12-bionic .chip-headline-background-shadow {
        left: 9px;
        bottom: 9px
    }
}

.section-a12-bionic .row-badge {
    -webkit-transform: translateY(10px);
    transform: translateY(10px)
}

.section-a12-bionic .chip-component,
.section-a12-bionic .chip-headline {
    opacity: 0
}

.section-a12-bionic .instant-hide {
    visibility: hidden
}

.section-a12-bionic .section-content {
    height: 100vh
}

.section-a12-bionic .section-content .manifesto-wrapper .stacking-context {
    z-index: 1
}

.section-a12-bionic {
    margin-top: -115vh
}

.section-a12-bionic .sticky-container {
    position: relative
}

.section-a12-bionic .sticky-container .sticky {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    overflow: hidden
}

.section-a12-bionic .chip-grid-container {
    height: 425vh;
    margin-bottom: -225vh;
    z-index: -1
}

.section-a12-bionic .chip-grid-container .chip-grid {
    width: 100%;
    height: 100vh
}

.section-a12-bionic .flex-center {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 100vh
}

.section-a12-bionic .chip-details-container {
    height: 125vh
}

.section-a12-bionic .chip-details {
    position: relative;
    z-index: 1;
    width: 100%
}

.section-a12-bionic .chip {
    display: block;
    position: absolute;
    z-index: 1;
    top: 50%;
    left: 50%;
    margin-top: -424px;
    margin-left: -450px;
    width: 900px;
    height: 900px
}

@media only screen and (max-width: 1068px) {
    .section-a12-bionic .chip {
        margin-top: -282px;
        margin-left: -310px;
        width: 620px;
        height: 620px
    }
}

@media only screen and (max-width: 735px) {
    .section-a12-bionic .chip {
        margin-top: -288px
    }
}

.section-a12-bionic .chip-headline {
    display: block;
    position: absolute;
    z-index: 1;
    color: #f5dfd3;
    width: 165px;
    left: 21px;
    bottom: 21px
}

@media only screen and (max-width: 1068px) {
    .section-a12-bionic .chip-headline {
        width: 145px;
        left: 16px;
        bottom: 16px
    }
}

.section-a12-bionic .chip-component {
    position: absolute;
    z-index: 1
}

.section-a12-bionic .chip-component-1 {
    top: 182px;
    left: 197px;
    width: 226px;
    height: 116px;
    background-size: 226px 116px;
    background-repeat: no-repeat;
    background-image: url("a12/a12_cpu_large.png")
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-a12-bionic .chip-component-1 {
        background-image: url("a12/a12_cpu_large_2x.png")
    }
}

@media only screen and (max-width: 1068px) {
    .section-a12-bionic .chip-component-1 {
        width: 156px;
        height: 80px;
        background-size: 156px 80px;
        background-repeat: no-repeat;
        background-image: url("a12/a12_cpu_medium.png")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    .section-a12-bionic .chip-component-1 {
        background-image: url("a12/a12_cpu_medium_2x.png")
    }
}

@media only screen and (max-width: 1068px) {
    .section-a12-bionic .chip-component-1 {
        top: 125px;
        left: 133px
    }
}

.section-a12-bionic .chip-component-2 {
    top: 8px;
    left: 117px;
    width: 306px;
    height: 110px;
    background-size: 306px 110px;
    background-repeat: no-repeat;
    background-image: url("a12/a12_gpu_large.png")
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-a12-bionic .chip-component-2 {
        background-image: url("a12/a12_gpu_large_2x.png")
    }
}

@media only screen and (max-width: 1068px) {
    .section-a12-bionic .chip-component-2 {
        width: 212px;
        height: 72px;
        background-size: 212px 72px;
        background-repeat: no-repeat;
        background-image: url("a12/a12_gpu_medium.png")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    .section-a12-bionic .chip-component-2 {
        background-image: url("a12/a12_gpu_medium_2x.png")
    }
}

@media only screen and (max-width: 1068px) {
    .section-a12-bionic .chip-component-2 {
        top: 5px;
        left: 77px
    }
}

.section-a12-bionic .chip-component-3 {
    top: 238px;
    left: 8px;
    width: 190px;
    height: 110px;
    background-size: 190px 110px;
    background-repeat: no-repeat;
    background-image: url("a12/a12_neural_engine_large.png")
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-a12-bionic .chip-component-3 {
        background-image: url("a12/a12_neural_engine_large_2x.png")
    }
}

@media only screen and (max-width: 1068px) {
    .section-a12-bionic .chip-component-3 {
        width: 128px;
        height: 76px;
        background-size: 128px 76px;
        background-repeat: no-repeat;
        background-image: url("a12/a12_neural_engine_medium.png")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    .section-a12-bionic .chip-component-3 {
        background-image: url("a12/a12_neural_engine_medium_2x.png")
    }
}

@media only screen and (max-width: 1068px) {
    .section-a12-bionic .chip-component-3 {
        top: 161px;
        left: 5px
    }
}

.section-a12-bionic .chip-component-4 {
    top: 347px;
    left: 8px;
    width: 190px;
    height: 76px;
    background-size: 190px 76px;
    background-repeat: no-repeat;
    background-image: url("a12/a12_isp_large.png")
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-a12-bionic .chip-component-4 {
        background-image: url("a12/a12_isp_large_2x.png")
    }
}

@media only screen and (max-width: 1068px) {
    .section-a12-bionic .chip-component-4 {
        width: 128px;
        height: 52px;
        background-size: 128px 52px;
        background-repeat: no-repeat;
        background-image: url("a12/a12_isp_medium.png")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    .section-a12-bionic .chip-component-4 {
        background-image: url("a12/a12_isp_medium_2x.png")
    }
}

@media only screen and (max-width: 1068px) {
    .section-a12-bionic .chip-component-4 {
        top: 237px;
        left: 6px
    }
}

.section-a12-bionic .chip-component-5 {
    top: 297px;
    left: 287px;
    width: 136px;
    height: 126px;
    background-size: 136px 126px;
    background-repeat: no-repeat;
    background-image: url("a12/a12_secure_enclave_large.png")
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-a12-bionic .chip-component-5 {
        background-image: url("a12/a12_secure_enclave_large_2x.png")
    }
}

@media only screen and (max-width: 1068px) {
    .section-a12-bionic .chip-component-5 {
        width: 92px;
        height: 84px;
        background-size: 92px 84px;
        background-repeat: no-repeat;
        background-image: url("a12/a12_secure_enclave_medium.png")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    .section-a12-bionic .chip-component-5 {
        background-image: url("a12/a12_secure_enclave_medium_2x.png")
    }
}

@media only screen and (max-width: 1068px) {
    .section-a12-bionic .chip-component-5 {
        top: 205px;
        left: 197px
    }
}

.section-a12-bionic .chip-component-6 {
    top: 8px;
    left: 8px;
    width: 110px;
    height: 230px;
    background-size: 110px 230px;
    background-repeat: no-repeat;
    background-image: url("a12/a12_part_a_large.png")
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-a12-bionic .chip-component-6 {
        background-image: url("a12/a12_part_a_large_2x.png")
    }
}

@media only screen and (max-width: 1068px) {
    .section-a12-bionic .chip-component-6 {
        width: 72px;
        height: 156px;
        background-size: 72px 156px;
        background-repeat: no-repeat;
        background-image: url("a12/a12_part_a_medium.png")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    .section-a12-bionic .chip-component-6 {
        background-image: url("a12/a12_part_a_medium_2x.png")
    }
}

@media only screen and (max-width: 1068px) {
    .section-a12-bionic .chip-component-6 {
        top: 5px;
        left: 5px
    }
}

.section-a12-bionic .chip-component-7 {
    top: 297px;
    left: 198px;
    width: 90px;
    height: 126px;
    background-size: 90px 126px;
    background-repeat: no-repeat;
    background-image: url("a12/a12_part_b_large.png")
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-a12-bionic .chip-component-7 {
        background-image: url("a12/a12_part_b_large_2x.png")
    }
}

@media only screen and (max-width: 1068px) {
    .section-a12-bionic .chip-component-7 {
        width: 64px;
        height: 84px;
        background-size: 64px 84px;
        background-repeat: no-repeat;
        background-image: url("a12/a12_part_b_medium.png")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    .section-a12-bionic .chip-component-7 {
        background-image: url("a12/a12_part_b_medium_2x.png")
    }
}

@media only screen and (max-width: 1068px) {
    .section-a12-bionic .chip-component-7 {
        top: 205px;
        left: 133px
    }
}

.section-a12-bionic .chip-component-8 {
    top: 117px;
    left: 197px;
    width: 226px;
    height: 66px;
    background-size: 226px 66px;
    background-repeat: no-repeat;
    background-image: url("a12/a12_part_c_large.png")
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-a12-bionic .chip-component-8 {
        background-image: url("a12/a12_part_c_large_2x.png")
    }
}

@media only screen and (max-width: 1068px) {
    .section-a12-bionic .chip-component-8 {
        width: 156px;
        height: 48px;
        background-size: 156px 48px;
        background-repeat: no-repeat;
        background-image: url("a12/a12_part_c_medium.png")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    .section-a12-bionic .chip-component-8 {
        background-image: url("a12/a12_part_c_medium_2x.png")
    }
}

@media only screen and (max-width: 1068px) {
    .section-a12-bionic .chip-component-8 {
        top: 77px;
        left: 133px
    }
}

.section-a12-bionic .chip-component-9 {
    top: 118px;
    left: 118px;
    width: 80px;
    height: 120px;
    background-size: 80px 120px;
    background-repeat: no-repeat;
    background-image: url("a12/a12_part_d_large.png")
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-a12-bionic .chip-component-9 {
        background-image: url("a12/a12_part_d_large_2x.png")
    }
}

@media only screen and (max-width: 1068px) {
    .section-a12-bionic .chip-component-9 {
        width: 56px;
        height: 84px;
        background-size: 56px 84px;
        background-repeat: no-repeat;
        background-image: url("a12/a12_part_d_medium.png")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    .section-a12-bionic .chip-component-9 {
        background-image: url("a12/a12_part_d_medium_2x.png")
    }
}

@media only screen and (max-width: 1068px) {
    .section-a12-bionic .chip-component-9 {
        top: 77px;
        left: 77px
    }
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-a12-bionic .chip-component-1 {
        width: 224px;
        height: 114px;
        background-size: 224px 114px;
        top: 183px;
        left: 198px
    }
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5) and (max-width: 1068px),
only screen and (min-resolution: 1.5dppx) and (max-width: 1068px),
only screen and (min-resolution: 144dpi) and (max-width: 1068px) {
    .section-a12-bionic .chip-component-1 {
        width: 154px;
        height: 81px;
        background-size: 154px 81px;
        top: 124px;
        left: 135px
    }
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-a12-bionic .chip-component-2 {
        width: 304px;
        height: 109px;
        background-size: 304px 109px;
        top: 8px;
        left: 118px
    }
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5) and (max-width: 1068px),
only screen and (min-resolution: 1.5dppx) and (max-width: 1068px),
only screen and (min-resolution: 144dpi) and (max-width: 1068px) {
    .section-a12-bionic .chip-component-2 {
        width: 210px;
        height: 74px;
        background-size: 210px 74px;
        top: 5px;
        left: 79px
    }
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-a12-bionic .chip-component-3 {
        width: 189px;
        height: 109px;
        background-size: 189px 109px;
        top: 238px;
        left: 8px
    }
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5) and (max-width: 1068px),
only screen and (min-resolution: 1.5dppx) and (max-width: 1068px),
only screen and (min-resolution: 144dpi) and (max-width: 1068px) {
    .section-a12-bionic .chip-component-3 {
        width: 130px;
        height: 74px;
        background-size: 130px 74px;
        top: 162px;
        left: 5px
    }
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-a12-bionic .chip-component-4 {
        width: 189px;
        height: 73px;
        background-size: 189px 73px;
        top: 348px;
        left: 8px
    }
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5) and (max-width: 1068px),
only screen and (min-resolution: 1.5dppx) and (max-width: 1068px),
only screen and (min-resolution: 144dpi) and (max-width: 1068px) {
    .section-a12-bionic .chip-component-4 {
        width: 130px;
        height: 53px;
        background-size: 130px 53px;
        top: 236px;
        left: 5px
    }
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-a12-bionic .chip-component-5 {
        width: 134px;
        height: 124px;
        background-size: 134px 124px;
        top: 298px;
        left: 288px
    }
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5) and (max-width: 1068px),
only screen and (min-resolution: 1.5dppx) and (max-width: 1068px),
only screen and (min-resolution: 144dpi) and (max-width: 1068px) {
    .section-a12-bionic .chip-component-5 {
        width: 91px;
        height: 84px;
        background-size: 91px 84px;
        top: 205px;
        left: 198px
    }
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-a12-bionic .chip-component-6 {
        width: 109px;
        height: 229px;
        background-size: 109px 229px;
        top: 8px;
        left: 8px
    }
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5) and (max-width: 1068px),
only screen and (min-resolution: 1.5dppx) and (max-width: 1068px),
only screen and (min-resolution: 144dpi) and (max-width: 1068px) {
    .section-a12-bionic .chip-component-6 {
        width: 74px;
        height: 158px;
        background-size: 74px 158px;
        top: 5px;
        left: 5px
    }
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-a12-bionic .chip-component-7 {
        width: 89px;
        height: 124px;
        background-size: 89px 124px;
        top: 298px;
        left: 198px
    }
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5) and (max-width: 1068px),
only screen and (min-resolution: 1.5dppx) and (max-width: 1068px),
only screen and (min-resolution: 144dpi) and (max-width: 1068px) {
    .section-a12-bionic .chip-component-7 {
        width: 63px;
        height: 84px;
        background-size: 63px 84px;
        top: 205px;
        left: 135px
    }
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-a12-bionic .chip-component-8 {
        width: 224px;
        height: 64px;
        background-size: 224px 64px;
        top: 118px;
        left: 198px
    }
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5) and (max-width: 1068px),
only screen and (min-resolution: 1.5dppx) and (max-width: 1068px),
only screen and (min-resolution: 144dpi) and (max-width: 1068px) {
    .section-a12-bionic .chip-component-8 {
        width: 154px;
        height: 46px;
        background-size: 154px 46px;
        top: 79px;
        left: 135px
    }
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-a12-bionic .chip-component-9 {
        width: 79px;
        height: 119px;
        background-size: 79px 119px;
        top: 118px;
        left: 118px
    }
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5) and (max-width: 1068px),
only screen and (min-resolution: 1.5dppx) and (max-width: 1068px),
only screen and (min-resolution: 144dpi) and (max-width: 1068px) {
    .section-a12-bionic .chip-component-9 {
        width: 56px;
        height: 84px;
        background-size: 56px 84px;
        top: 79px;
        left: 79px
    }
}

.section-a12-bionic .column-first {
    float: left;
    width: 245px;
    padding-top: 56px
}

@media only screen and (max-width: 1068px) {
    .section-a12-bionic .column-first {
        width: 173px;
        padding-top: 32px
    }
}

@media only screen and (max-width: 735px) {
    .section-a12-bionic .column-first {
        width: 50%;
        padding-top: 0;
        padding-right: 30px
    }
}

.section-a12-bionic .column-last {
    float: right;
    width: 198px;
    padding-top: 56px
}

@media only screen and (max-width: 1068px) {
    .section-a12-bionic .column-last {
        width: 152px;
        padding-top: 32px
    }
}

@media only screen and (max-width: 735px) {
    .section-a12-bionic .column-last {
        width: 50%;
        padding-top: 0
    }
}

.section-a12-bionic .badge {
    width: 100%
}

.section-a12-bionic .badge-content {
    margin: 24px 0
}

@media only screen and (max-width: 1068px) {
    .section-a12-bionic .badge-content {
        margin: 8px 0
    }
}

@media only screen and (max-width: 735px) {
    .section-a12-bionic .badge-content {
        margin: 14px 0
    }
}

.section-a12-bionic .badge-value {
    white-space: normal
}

@media only screen and (max-width: 735px) {
    .section-a12-bionic .badge-value {
        padding-left: 2px
    }
}

.section-a12-bionic .badge-caption {
    white-space: normal;
    position: relative;
    z-index: 1;
    width: 180px
}

@media only screen and (max-width: 1068px) {
    .section-a12-bionic .badge-caption {
        width: 150px
    }
}

@media only screen and (max-width: 735px) {
    .section-a12-bionic .badge-caption {
        width: auto
    }
}

.webgl .section-a12-bionic .chip-headline,
.webgl .section-a12-bionic .chip-background-glow,
.webgl .section-a12-bionic .chip-background,
.webgl .section-a12-bionic .row-badge[data-order] {
    opacity: 0;
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition-duration: 0.33s;
    transition-duration: 0.33s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out
}

.webgl .section-a12-bionic .chip-headline.show,
.webgl .section-a12-bionic .chip-background-glow.show,
.webgl .section-a12-bionic .chip-background.show,
.webgl .section-a12-bionic .row-badge[data-order].show {
    opacity: 1;
    -webkit-transform: none;
    transform: none
}

.webgl .section-a12-bionic .chip-headline {
    -webkit-transition-timing-function: ease-in;
    transition-timing-function: ease-in;
    -webkit-transition-duration: 1s;
    transition-duration: 1s
}

.webgl .section-a12-bionic .chip-background.show {
    -webkit-transition-timing-function: ease-in;
    transition-timing-function: ease-in;
    -webkit-transition-duration: 0.8s;
    transition-duration: 0.8s
}

html.static-interaction .section-a12-bionic,
html.no-js .section-a12-bionic,
html.reduced-motion .section-a12-bionic,
html.no-webgl .section-a12-bionic {
    margin: 0;
    padding: 200px 0 120px 0
}

@media only screen and (max-width: 1068px) {
    html.static-interaction .section-a12-bionic,
    html.no-js .section-a12-bionic,
    html.reduced-motion .section-a12-bionic,
    html.no-webgl .section-a12-bionic {
        padding: 125px 0 70px 0
    }
}

@media only screen and (max-width: 735px) {
    html.static-interaction .section-a12-bionic,
    html.no-js .section-a12-bionic,
    html.reduced-motion .section-a12-bionic,
    html.no-webgl .section-a12-bionic {
        padding: 80px 0
    }
}

html.static-interaction .section-a12-bionic .chip-headline,
html.static-interaction .section-a12-bionic .chip-component,
html.static-interaction .section-a12-bionic .chip-background-glow,
html.static-interaction .section-a12-bionic .chip-background,
html.static-interaction .section-a12-bionic .row-badge[data-order],
html.no-js .section-a12-bionic .chip-headline,
html.no-js .section-a12-bionic .chip-component,
html.no-js .section-a12-bionic .chip-background-glow,
html.no-js .section-a12-bionic .chip-background,
html.no-js .section-a12-bionic .row-badge[data-order],
html.reduced-motion .section-a12-bionic .chip-headline,
html.reduced-motion .section-a12-bionic .chip-component,
html.reduced-motion .section-a12-bionic .chip-background-glow,
html.reduced-motion .section-a12-bionic .chip-background,
html.reduced-motion .section-a12-bionic .row-badge[data-order],
html.no-webgl .section-a12-bionic .chip-headline,
html.no-webgl .section-a12-bionic .chip-component,
html.no-webgl .section-a12-bionic .chip-background-glow,
html.no-webgl .section-a12-bionic .chip-background,
html.no-webgl .section-a12-bionic .row-badge[data-order] {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
    -webkit-transition-property: none;
    transition-property: none;
    -webkit-transition-duration: 0s;
    transition-duration: 0s
}

html.static-interaction .section-a12-bionic .chip-grid-container,
html.no-js .section-a12-bionic .chip-grid-container,
html.reduced-motion .section-a12-bionic .chip-grid-container,
html.no-webgl .section-a12-bionic .chip-grid-container {
    display: none
}

html.static-interaction .section-a12-bionic .sticky,
html.no-js .section-a12-bionic .sticky,
html.reduced-motion .section-a12-bionic .sticky,
html.no-webgl .section-a12-bionic .sticky {
    position: relative
}

html.static-interaction .section-a12-bionic .flex-center,
html.static-interaction .section-a12-bionic .manifesto-container,
html.static-interaction .section-a12-bionic .chip-details-container,
html.no-js .section-a12-bionic .flex-center,
html.no-js .section-a12-bionic .manifesto-container,
html.no-js .section-a12-bionic .chip-details-container,
html.reduced-motion .section-a12-bionic .flex-center,
html.reduced-motion .section-a12-bionic .manifesto-container,
html.reduced-motion .section-a12-bionic .chip-details-container,
html.no-webgl .section-a12-bionic .flex-center,
html.no-webgl .section-a12-bionic .manifesto-container,
html.no-webgl .section-a12-bionic .chip-details-container {
    height: 100%
}

html.static-interaction .section-a12-bionic .chip-details-container,
html.no-js .section-a12-bionic .chip-details-container,
html.reduced-motion .section-a12-bionic .chip-details-container,
html.no-webgl .section-a12-bionic .chip-details-container {
    margin-top: 66px
}

@media only screen and (max-width: 1068px) {
    html.static-interaction .section-a12-bionic .chip-details-container,
    html.no-js .section-a12-bionic .chip-details-container,
    html.reduced-motion .section-a12-bionic .chip-details-container,
    html.no-webgl .section-a12-bionic .chip-details-container {
        margin-top: 16px
    }
}

@media only screen and (max-width: 735px) {
    html.static-interaction .section-a12-bionic .chip-details-container,
    html.no-js .section-a12-bionic .chip-details-container,
    html.reduced-motion .section-a12-bionic .chip-details-container,
    html.no-webgl .section-a12-bionic .chip-details-container {
        margin-top: 30px
    }
}

html.static-interaction .section-a12-bionic .chip-details-container .section-content,
html.no-js .section-a12-bionic .chip-details-container .section-content,
html.reduced-motion .section-a12-bionic .chip-details-container .section-content,
html.no-webgl .section-a12-bionic .chip-details-container .section-content {
    height: 100%
}

html.static-interaction .section-a12-bionic .small-copy-container,
html.no-js .section-a12-bionic .small-copy-container,
html.reduced-motion .section-a12-bionic .small-copy-container,
html.no-webgl .section-a12-bionic .small-copy-container {
    margin-top: 0px;
    padding-bottom: 0
}

@media screen and (min-width: 1068px) and (max-height: 700px) {
    html.static-interaction .section-a12-bionic .chip,
    html.no-js .section-a12-bionic .chip,
    html.reduced-motion .section-a12-bionic .chip,
    html.no-webgl .section-a12-bionic .chip {
        position: relative;
        height: 694px;
        margin-top: -142px
    }
}

@media screen and (min-width: 736px) and (max-width: 1068px) and (max-height: 585px) {
    html.static-interaction .section-a12-bionic .chip,
    html.no-js .section-a12-bionic .chip,
    html.reduced-motion .section-a12-bionic .chip,
    html.no-webgl .section-a12-bionic .chip {
        position: relative;
        height: 554px;
        margin-top: -90px
    }
}

@media only screen and (max-width: 735px) {
    html.static-interaction .section-a12-bionic .chip,
    html.no-js .section-a12-bionic .chip,
    html.reduced-motion .section-a12-bionic .chip,
    html.no-webgl .section-a12-bionic .chip {
        position: relative;
        height: 518px;
        margin-top: -100px
    }
}

.section-cameras::before,
.section-cameras::after {
    content: ' ';
    display: table
}

.section-cameras::after {
    clear: both
}

.section-cameras .will-change {
    will-change: transform
}

.section-cameras .sticky-container {
    position: relative
}

.section-cameras .sticky-item {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 0
}

html.no-js .section-cameras .sticky-item,
html.no-sticky .section-cameras .sticky-item,
html.reduced-motion .section-cameras .sticky-item,
html.no-js .section-cameras .sticky-item,
html.no-sticky .section-cameras .sticky-item,
html.reduced-motion .section-cameras .sticky-item,
html.no-js .section-cameras .sticky-item,
html.no-sticky .section-cameras .sticky-item,
html.reduced-motion .section-cameras .sticky-item {
    position: relative;
    z-index: 1
}

.section-cameras .gradient-background {
    background: #000;
    background: -webkit-linear-gradient(bottom, #121212, #000 600px);
    background: linear-gradient(to top, #121212, #000 600px)
}

.section-cameras .hero-container {
    margin-bottom: 100px
}

html.no-js .section-cameras .hero-container,
html.no-sticky .section-cameras .hero-container,
html.reduced-motion .section-cameras .hero-container,
html.no-js .section-cameras .hero-container,
html.no-sticky .section-cameras .hero-container,
html.reduced-motion .section-cameras .hero-container,
html.no-js .section-cameras .hero-container,
html.no-sticky .section-cameras .hero-container,
html.reduced-motion .section-cameras .hero-container {
    margin-bottom: 0
}

.section-cameras .hero-container .section-content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    min-height: calc(100vh - 52px)
}

@media only screen and (max-width: 735px) {
    .section-cameras .hero-container .section-content {
        min-height: calc(100vh - 48px)
    }
}

html.no-js .section-cameras .hero-container .section-content,
html.no-sticky .section-cameras .hero-container .section-content,
html.reduced-motion .section-cameras .hero-container .section-content,
html.no-js .section-cameras .hero-container .section-content,
html.no-sticky .section-cameras .hero-container .section-content,
html.reduced-motion .section-cameras .hero-container .section-content,
html.no-js .section-cameras .hero-container .section-content,
html.no-sticky .section-cameras .hero-container .section-content,
html.reduced-motion .section-cameras .hero-container .section-content {
    min-height: 0
}

.section-cameras .image-hero {
    background-repeat: no-repeat;
    background-image: url("camera_hero_large.jpg");
    width: auto;
    height: 100vh;
    background-size: cover;
    background-position: center center
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-cameras .image-hero {
        background-image: url("camera_hero_large_2x.jpg")
    }
}

.section-cameras .manifesto-wrapper {
    position: relative;
    padding-top: 160px;
    padding-bottom: 172px
}

@media only screen and (max-width: 1068px) {
    .section-cameras .manifesto-wrapper {
        padding-top: 130px;
        padding-bottom: 140px
    }
}

@media only screen and (max-width: 735px) {
    .section-cameras .manifesto-wrapper {
        padding-top: 94px;
        padding-bottom: 100px
    }
}

.section-cameras .features-content {
    padding-bottom: 125px
}

@media only screen and (max-width: 1068px) {
    .section-cameras .features-content {
        padding-bottom: 100px
    }
}

@media only screen and (max-width: 735px) {
    .section-cameras .features-content {
        padding-bottom: 70px
    }
}

html.no-js .section-cameras .features-content,
html.static-interaction .section-cameras .features-content,
html.reduced-motion .section-cameras .features-content,
html.no-js .section-cameras .features-content,
html.static-interaction .section-cameras .features-content,
html.reduced-motion .section-cameras .features-content,
html.no-js .section-cameras .features-content,
html.static-interaction .section-cameras .features-content,
html.reduced-motion .section-cameras .features-content {
    overflow: hidden
}

.section-cameras .features-content .image-smart-hdr {
    background-size: 980px 1312px;
    background-repeat: no-repeat;
    background-image: url("camera_1_large.jpg")
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-cameras .features-content .image-smart-hdr {
        background-image: url("camera_1_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px) {
    .section-cameras .features-content .image-smart-hdr {
        background-size: 692px 926px;
        background-repeat: no-repeat;
        background-image: url("camera_1_medium.jpg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    .section-cameras .features-content .image-smart-hdr {
        background-image: url("camera_1_medium_2x.jpg")
    }
}

@media only screen and (max-width: 735px) {
    .section-cameras .features-content .image-smart-hdr {
        background-size: 418px 559px;
        background-repeat: no-repeat;
        background-image: url("camera_1_small.jpg")
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi) {
    .section-cameras .features-content .image-smart-hdr {
        background-image: url("camera_1_small_2x.jpg")
    }
}

.section-cameras .features-content .image-low-light {
    background-size: 980px 1312px;
    background-repeat: no-repeat;
    background-image: url("camera_2_large.jpg")
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-cameras .features-content .image-low-light {
        background-image: url("camera_2_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px) {
    .section-cameras .features-content .image-low-light {
        background-size: 692px 926px;
        background-repeat: no-repeat;
        background-image: url("camera_2_medium.jpg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    .section-cameras .features-content .image-low-light {
        background-image: url("camera_2_medium_2x.jpg")
    }
}

@media only screen and (max-width: 735px) {
    .section-cameras .features-content .image-low-light {
        background-size: 418px 559px;
        background-repeat: no-repeat;
        background-image: url("camera_2_small.jpg")
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi) {
    .section-cameras .features-content .image-low-light {
        background-image: url("camera_2_small_2x.jpg")
    }
}

.section-cameras .features-content .image-bokeh {
    background-size: 980px 1312px;
    background-repeat: no-repeat;
    background-image: url("camera_3_large.jpg")
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-cameras .features-content .image-bokeh {
        background-image: url("camera_3_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px) {
    .section-cameras .features-content .image-bokeh {
        background-size: 692px 926px;
        background-repeat: no-repeat;
        background-image: url("camera_3_medium.jpg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    .section-cameras .features-content .image-bokeh {
        background-image: url("camera_3_medium_2x.jpg")
    }
}

@media only screen and (max-width: 735px) {
    .section-cameras .features-content .image-bokeh {
        background-size: 418px 559px;
        background-repeat: no-repeat;
        background-image: url("camera_3_small.jpg")
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi) {
    .section-cameras .features-content .image-bokeh {
        background-image: url("camera_3_small_2x.jpg")
    }
}

.section-cameras .features-content .image-depth-control {
    background-size: 980px 1312px;
    background-repeat: no-repeat;
    background-image: url("camera_4_large.jpg")
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-cameras .features-content .image-depth-control {
        background-image: url("camera_4_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px) {
    .section-cameras .features-content .image-depth-control {
        background-size: 692px 926px;
        background-repeat: no-repeat;
        background-image: url("camera_4_medium.jpg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    .section-cameras .features-content .image-depth-control {
        background-image: url("camera_4_medium_2x.jpg")
    }
}

@media only screen and (max-width: 735px) {
    .section-cameras .features-content .image-depth-control {
        background-size: 418px 559px;
        background-repeat: no-repeat;
        background-image: url("camera_4_small.jpg")
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi) {
    .section-cameras .features-content .image-depth-control {
        background-image: url("camera_4_small_2x.jpg")
    }
}

.section-cameras .features-content .sticky-item {
    height: 100vh;
    min-height: calc(724px + (50vh - (724px / 2)) + 22px);
    margin-bottom: calc(-1 * ((100vh - 724px) / 2) + 22px);
    overflow: hidden
}

@media only screen and (max-height: 768px) {
    .section-cameras .features-content .sticky-item {
        margin-bottom: 0
    }
}

@media only screen and (max-width: 1068px) {
    .section-cameras .features-content .sticky-item {
        min-height: calc(564px + (50vh - (564px / 2)) + 22px);
        margin-bottom: calc(-1 * ((100vh - 564px) / 2) + 22px)
    }
}

@media only screen and (max-width: 1068px) and (max-height: 608px) {
    .section-cameras .features-content .sticky-item {
        margin-bottom: 0
    }
}

@media only screen and (max-width: 735px) {
    .section-cameras .features-content .sticky-item {
        min-height: calc(564px + (50vh - (564px / 2)) + 24px);
        margin-bottom: calc(-1 * ((100vh - 564px) / 2) + 22px)
    }
}

@media only screen and (max-width: 735px) and (max-height: 612px) {
    .section-cameras .features-content .sticky-item {
        margin-bottom: 0
    }
}

html.no-js .section-cameras .features-content .sticky-item,
html.static-interaction .section-cameras .features-content .sticky-item,
html.reduced-motion .section-cameras .features-content .sticky-item,
html.no-js .section-cameras .features-content .sticky-item,
html.static-interaction .section-cameras .features-content .sticky-item,
html.reduced-motion .section-cameras .features-content .sticky-item,
html.no-js .section-cameras .features-content .sticky-item,
html.static-interaction .section-cameras .features-content .sticky-item,
html.reduced-motion .section-cameras .features-content .sticky-item {
    display: none
}

.section-cameras .features-content .image-container {
    margin-left: -568.022px;
    width: 1136.044px;
    height: 2259.604px;
    position: relative;
    left: 50%;
    -webkit-transform-origin: top center;
    transform-origin: top center;
    will-change: transform
}

@media only screen and (max-width: 1068px) {
    .section-cameras .features-content .image-container {
        margin-left: -415.474px;
        width: 830.948px;
        height: 1599.504px
    }
}

@media only screen and (max-width: 735px) {
    .section-cameras .features-content .image-container {
        margin-left: -250.9545px;
        width: 501.909px;
        height: 966.132px
    }
}

.section-cameras .features-content .image-container .image-feature {
    width: 980px;
    height: 1312px;
    position: absolute;
    left: 50%;
    margin-left: -490px;
    top: 474px;
    opacity: 0;
    -webkit-transform-origin: top center;
    transform-origin: top center;
    -webkit-transition: opacity .5s linear;
    transition: opacity .5s linear
}

@media only screen and (max-width: 1068px) {
    .section-cameras .features-content .image-container .image-feature {
        width: 692px;
        height: 926px
    }
}

@media only screen and (max-width: 735px) {
    .section-cameras .features-content .image-container .image-feature {
        width: 418px;
        height: 559px
    }
}

@media only screen and (max-width: 1068px) {
    .section-cameras .features-content .image-container .image-feature {
        left: 50%;
        margin-left: -346px
    }
}

@media only screen and (max-width: 735px) {
    .section-cameras .features-content .image-container .image-feature {
        left: 50%;
        margin-left: -209px
    }
}

@media only screen and (max-width: 1068px) {
    .section-cameras .features-content .image-container .image-feature {
        top: 335px
    }
}

@media only screen and (max-width: 735px) {
    .section-cameras .features-content .image-container .image-feature {
        top: 203px
    }
}

.section-cameras .features-content .image-container .image-feature.show {
    opacity: 1;
    -webkit-transition: opacity .5s linear;
    transition: opacity .5s linear
}

.section-cameras .features-content .hardware-wrapper {
    width: 364px;
    height: 724px;
    position: relative;
    left: 50%;
    margin-left: -182px;
    opacity: 0;
    -webkit-transform: scale(3.121);
    transform: scale(3.121);
    -webkit-transform-origin: top center;
    transform-origin: top center
}

@media only screen and (max-width: 1068px) {
    .section-cameras .features-content .hardware-wrapper {
        width: 293px;
        height: 564px
    }
}

@media only screen and (max-width: 735px) {
    .section-cameras .features-content .hardware-wrapper {
        width: 293px;
        height: 564px
    }
}

@media only screen and (max-width: 1068px) {
    .section-cameras .features-content .hardware-wrapper {
        left: 50%;
        margin-left: -146.5px
    }
}

@media only screen and (max-width: 735px) {
    .section-cameras .features-content .hardware-wrapper {
        left: 50%;
        margin-left: -146.5px
    }
}

@media only screen and (max-width: 1068px) {
    .section-cameras .features-content .hardware-wrapper {
        -webkit-transform: scale(2.836);
        transform: scale(2.836)
    }
}

@media only screen and (max-width: 735px) {
    .section-cameras .features-content .hardware-wrapper {
        -webkit-transform: scale(1.713);
        transform: scale(1.713)
    }
}

.section-cameras .features-content .hardware-wrapper .hardware-frame {
    width: 364px;
    height: 724px;
    background-size: 364px 724px;
    background-repeat: no-repeat;
    background-image: url("hardware_depthcontrol_gold_portrait_fallback_large.png");
    position: absolute;
    top: 0;
    z-index: 5
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-cameras .features-content .hardware-wrapper .hardware-frame {
        background-image: url("hardware_depthcontrol_gold_portrait_fallback_large_2x.png")
    }
}

html.css-mask .section-cameras .features-content .hardware-wrapper .hardware-frame {
    width: 364px;
    height: 724px;
    background-size: 364px 724px;
    background-repeat: no-repeat;
    background-image: url("hardware_depthcontrol_gold_portrait_large.jpg");
    -webkit-mask-size: 364px 724px;
    mask-size: 364px 724px;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-image: url("hardware_depthcontrol_gold_portrait_mask_large.svg");
    mask-image: url("hardware_depthcontrol_gold_portrait_mask_large.svg")
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    html.css-mask .section-cameras .features-content .hardware-wrapper .hardware-frame {
        background-image: url("hardware_depthcontrol_gold_portrait_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px) {
    .section-cameras .features-content .hardware-wrapper .hardware-frame {
        width: 293px;
        height: 564px;
        background-size: 293px 564px;
        background-repeat: no-repeat;
        background-image: url("hardware_depthcontrol_gold_portrait_fallback_medium.png")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    .section-cameras .features-content .hardware-wrapper .hardware-frame {
        background-image: url("hardware_depthcontrol_gold_portrait_fallback_medium_2x.png")
    }
}

@media only screen and (max-width: 1068px) {
    html.css-mask .section-cameras .features-content .hardware-wrapper .hardware-frame {
        width: 293px;
        height: 564px;
        background-size: 293px 564px;
        background-repeat: no-repeat;
        background-image: url("hardware_depthcontrol_gold_portrait_medium.jpg");
        -webkit-mask-size: 293px 564px;
        mask-size: 293px 564px;
        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;
        -webkit-mask-image: url("hardware_depthcontrol_gold_portrait_mask_medium.svg");
        mask-image: url("hardware_depthcontrol_gold_portrait_mask_medium.svg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    html.css-mask .section-cameras .features-content .hardware-wrapper .hardware-frame {
        background-image: url("hardware_depthcontrol_gold_portrait_medium_2x.jpg")
    }
}

@media only screen and (max-width: 735px) {
    .section-cameras .features-content .hardware-wrapper .hardware-frame {
        width: 293px;
        height: 564px;
        background-size: 293px 564px;
        background-repeat: no-repeat;
        background-image: url("hardware_depthcontrol_gold_portrait_fallback_small.png")
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi) {
    .section-cameras .features-content .hardware-wrapper .hardware-frame {
        background-image: url("hardware_depthcontrol_gold_portrait_fallback_small_2x.png")
    }
}

@media only screen and (max-width: 735px) {
    html.css-mask .section-cameras .features-content .hardware-wrapper .hardware-frame {
        width: 293px;
        height: 564px;
        background-size: 293px 564px;
        background-repeat: no-repeat;
        background-image: url("hardware_depthcontrol_gold_portrait_small.jpg");
        -webkit-mask-size: 293px 564px;
        mask-size: 293px 564px;
        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;
        -webkit-mask-image: url("hardware_depthcontrol_gold_portrait_mask_small.svg");
        mask-image: url("hardware_depthcontrol_gold_portrait_mask_small.svg")
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi) {
    html.css-mask .section-cameras .features-content .hardware-wrapper .hardware-frame {
        background-image: url("hardware_depthcontrol_gold_portrait_small_2x.jpg")
    }
}

.section-cameras .features-content .hardware-wrapper .hardware-screen {
    width: 314px;
    height: 680px;
    background-size: 314px 680px;
    background-repeat: no-repeat;
    background-image: url("screen_depthcontrol_startframe_large.jpg");
    top: 22px;
    left: 25px;
    position: relative
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-cameras .features-content .hardware-wrapper .hardware-screen {
        background-image: url("screen_depthcontrol_startframe_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px) {
    .section-cameras .features-content .hardware-wrapper .hardware-screen {
        width: 244px;
        height: 528px;
        background-size: 244px 528px;
        background-repeat: no-repeat;
        background-image: url("screen_depthcontrol_startframe_medium.jpg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    .section-cameras .features-content .hardware-wrapper .hardware-screen {
        background-image: url("screen_depthcontrol_startframe_medium_2x.jpg")
    }
}

@media only screen and (max-width: 735px) {
    .section-cameras .features-content .hardware-wrapper .hardware-screen {
        width: 244px;
        height: 528px;
        background-size: 244px 528px;
        background-repeat: no-repeat;
        background-image: url("screen_depthcontrol_startframe_small.jpg")
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi) {
    .section-cameras .features-content .hardware-wrapper .hardware-screen {
        background-image: url("screen_depthcontrol_startframe_small_2x.jpg")
    }
}

@media only screen and (max-width: 1068px) {
    .section-cameras .features-content .hardware-wrapper .hardware-screen {
        top: 18px;
        left: 24.5px
    }
}

@media only screen and (max-width: 735px) {
    .section-cameras .features-content .hardware-wrapper .hardware-screen {
        top: 18px;
        left: 24.5px
    }
}

.section-cameras .features-content .copy-container .column {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 100vh
}

.section-cameras .features-content .copy-container .column .copy-block {
    position: relative;
    z-index: 1
}

html.no-js .section-cameras .features-content .copy-container .column,
html.static-interaction .section-cameras .features-content .copy-container .column,
html.reduced-motion .section-cameras .features-content .copy-container .column,
html.no-js .section-cameras .features-content .copy-container .column,
html.static-interaction .section-cameras .features-content .copy-container .column,
html.reduced-motion .section-cameras .features-content .copy-container .column,
html.no-js .section-cameras .features-content .copy-container .column,
html.static-interaction .section-cameras .features-content .copy-container .column,
html.reduced-motion .section-cameras .features-content .copy-container .column {
    margin-left: auto;
    margin-right: auto;
    display: block;
    width: 614px;
    margin-bottom: 168px;
    height: auto;
    float: none
}

@media only screen and (max-width: 735px) {
    html.no-js .section-cameras .features-content .copy-container .column,
    html.static-interaction .section-cameras .features-content .copy-container .column,
    html.reduced-motion .section-cameras .features-content .copy-container .column,
    html.no-js .section-cameras .features-content .copy-container .column,
    html.static-interaction .section-cameras .features-content .copy-container .column,
    html.reduced-motion .section-cameras .features-content .copy-container .column,
    html.no-js .section-cameras .features-content .copy-container .column,
    html.static-interaction .section-cameras .features-content .copy-container .column,
    html.reduced-motion .section-cameras .features-content .copy-container .column {
        width: 100%;
        margin-bottom: 94px
    }
}

html.no-js .section-cameras .features-content .copy-container .column p,
html.static-interaction .section-cameras .features-content .copy-container .column p,
html.reduced-motion .section-cameras .features-content .copy-container .column p,
html.no-js .section-cameras .features-content .copy-container .column p,
html.static-interaction .section-cameras .features-content .copy-container .column p,
html.reduced-motion .section-cameras .features-content .copy-container .column p,
html.no-js .section-cameras .features-content .copy-container .column p,
html.static-interaction .section-cameras .features-content .copy-container .column p,
html.reduced-motion .section-cameras .features-content .copy-container .column p {
    width: 500px
}

@media only screen and (max-width: 735px) {
    html.no-js .section-cameras .features-content .copy-container .column p,
    html.static-interaction .section-cameras .features-content .copy-container .column p,
    html.reduced-motion .section-cameras .features-content .copy-container .column p,
    html.no-js .section-cameras .features-content .copy-container .column p,
    html.static-interaction .section-cameras .features-content .copy-container .column p,
    html.reduced-motion .section-cameras .features-content .copy-container .column p,
    html.no-js .section-cameras .features-content .copy-container .column p,
    html.static-interaction .section-cameras .features-content .copy-container .column p,
    html.reduced-motion .section-cameras .features-content .copy-container .column p {
        width: auto
    }
}

html.no-js .section-cameras .features-content .copy-container .row:last-child .column,
html.static-interaction .section-cameras .features-content .copy-container .row:last-child .column,
html.reduced-motion .section-cameras .features-content .copy-container .row:last-child .column,
html.no-js .section-cameras .features-content .copy-container .row:last-child .column,
html.static-interaction .section-cameras .features-content .copy-container .row:last-child .column,
html.reduced-motion .section-cameras .features-content .copy-container .row:last-child .column,
html.no-js .section-cameras .features-content .copy-container .row:last-child .column,
html.static-interaction .section-cameras .features-content .copy-container .row:last-child .column,
html.reduced-motion .section-cameras .features-content .copy-container .row:last-child .column {
    margin-bottom: 0
}

.section-cameras .features-content .copy-container .image-feature {
    display: none;
    width: 614px;
    height: 822.00816px;
    margin-bottom: 42px;
    background-size: cover
}

@media only screen and (max-width: 735px) {
    .section-cameras .features-content .copy-container .image-feature {
        width: 418px;
        height: 559px;
        left: 50%;
        margin-left: -209px;
        position: relative;
        margin-bottom: 38px
    }
}

html.no-js .section-cameras .features-content .copy-container .image-feature,
html.static-interaction .section-cameras .features-content .copy-container .image-feature,
html.reduced-motion .section-cameras .features-content .copy-container .image-feature,
html.no-js .section-cameras .features-content .copy-container .image-feature,
html.static-interaction .section-cameras .features-content .copy-container .image-feature,
html.reduced-motion .section-cameras .features-content .copy-container .image-feature,
html.no-js .section-cameras .features-content .copy-container .image-feature,
html.static-interaction .section-cameras .features-content .copy-container .image-feature,
html.reduced-motion .section-cameras .features-content .copy-container .image-feature {
    display: block
}

.section-cameras .features-content .hardware-placeholder {
    height: 470.6px
}

@media only screen and (max-width: 1068px) {
    .section-cameras .features-content .hardware-placeholder {
        height: 366.6px
    }
}

@media only screen and (max-width: 735px) {
    .section-cameras .features-content .hardware-placeholder {
        height: 366.6px
    }
}

html.no-js .section-cameras .features-content .hardware-placeholder,
html.static-interaction .section-cameras .features-content .hardware-placeholder,
html.reduced-motion .section-cameras .features-content .hardware-placeholder,
html.no-js .section-cameras .features-content .hardware-placeholder,
html.static-interaction .section-cameras .features-content .hardware-placeholder,
html.reduced-motion .section-cameras .features-content .hardware-placeholder,
html.no-js .section-cameras .features-content .hardware-placeholder,
html.static-interaction .section-cameras .features-content .hardware-placeholder,
html.reduced-motion .section-cameras .features-content .hardware-placeholder {
    display: none
}

.section-cameras .true-depth-content {
    padding-top: 125px
}

@media only screen and (max-width: 1068px) {
    .section-cameras .true-depth-content {
        padding-top: 100px
    }
}

@media only screen and (max-width: 735px) {
    .section-cameras .true-depth-content {
        padding-top: 75px
    }
}

html.no-js .section-cameras .true-depth-content,
html.reduced-motion .section-cameras .true-depth-content,
html.static-interaction .section-cameras .true-depth-content,
html.no-js .section-cameras .true-depth-content,
html.reduced-motion .section-cameras .true-depth-content,
html.static-interaction .section-cameras .true-depth-content,
html.no-js .section-cameras .true-depth-content,
html.reduced-motion .section-cameras .true-depth-content,
html.static-interaction .section-cameras .true-depth-content {
    background: -webkit-gradient(linear, left top, left bottom, from(#000), to(#111));
    background: -webkit-linear-gradient(#000, #111);
    background: linear-gradient(#000, #111);
    background-size: 100% 200px;
    background-repeat: no-repeat;
    background-position-y: bottom
}

@media only screen and (max-width: 1068px) {
    html.no-js .section-cameras .true-depth-content,
    html.reduced-motion .section-cameras .true-depth-content,
    html.static-interaction .section-cameras .true-depth-content,
    html.no-js .section-cameras .true-depth-content,
    html.reduced-motion .section-cameras .true-depth-content,
    html.static-interaction .section-cameras .true-depth-content,
    html.no-js .section-cameras .true-depth-content,
    html.reduced-motion .section-cameras .true-depth-content,
    html.static-interaction .section-cameras .true-depth-content {
        background: none
    }
}

.section-cameras .true-depth-content.section-content {
    width: 100%;
    background: #000
}

@media only screen and (max-width: 735px) {
    .section-cameras .true-depth-content.section-content {
        width: 87.5%;
        padding-left: calc((100% - 87.5%) / 2);
        padding-right: calc((100% - 87.5%) / 2)
    }
}

.section-cameras .true-depth-content.device-cropped {
    background: -webkit-gradient(linear, left top, left bottom, from(#000), to(#111));
    background: -webkit-linear-gradient(#000, #111);
    background: linear-gradient(#000, #111);
    background-size: 100% 200px;
    background-repeat: no-repeat;
    background-position-y: bottom
}

.section-cameras .true-depth-content .image-hardware.transform {
    will-change: transform, opacity
}

.section-cameras .true-depth-content .image-hardware-back {
    width: 650px;
    height: 2006px;
    background-size: 650px 2006px;
    background-repeat: no-repeat;
    background-image: url("true_depth_camera_large.jpg")
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-cameras .true-depth-content .image-hardware-back {
        background-image: url("true_depth_camera_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px) {
    .section-cameras .true-depth-content .image-hardware-back {
        width: 442px;
        height: 1772px;
        background-size: 442px 1772px;
        background-repeat: no-repeat;
        background-image: url("true_depth_camera_medium.jpg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    .section-cameras .true-depth-content .image-hardware-back {
        background-image: url("true_depth_camera_medium_2x.jpg")
    }
}

@media only screen and (max-width: 735px) {
    .section-cameras .true-depth-content .image-hardware-back {
        width: 297px;
        height: 280px;
        background-size: 297px 280px;
        background-repeat: no-repeat;
        background-image: url("true_depth_camera_small.png")
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi) {
    .section-cameras .true-depth-content .image-hardware-back {
        background-image: url("true_depth_camera_small_2x.png")
    }
}

.section-cameras .true-depth-content .image-hardware-back.static-hardware {
    position: relative;
    left: 50%;
    margin-left: -325px
}

@media only screen and (max-width: 1068px) {
    .section-cameras .true-depth-content .image-hardware-back.static-hardware {
        left: 50%;
        margin-left: -221px
    }
}

@media only screen and (max-width: 735px) {
    .section-cameras .true-depth-content .image-hardware-back.static-hardware {
        left: 50%;
        margin-left: -148.5px
    }
}

.section-cameras .true-depth-content .image-hardware-back:not(.static-hardware) {
    position: absolute;
    -webkit-transform-origin: top left;
    transform-origin: top left;
    z-index: 1;
    opacity: 0.5;
    left: 81px
}

@media only screen and (max-width: 1068px) {
    .section-cameras .true-depth-content .image-hardware-back:not(.static-hardware) {
        left: 101px
    }
}

html.no-js .section-cameras .true-depth-content .image-hardware-back:not(.static-hardware),
html.reduced-motion .section-cameras .true-depth-content .image-hardware-back:not(.static-hardware),
html.static-interaction .section-cameras .true-depth-content .image-hardware-back:not(.static-hardware),
html.no-js .section-cameras .true-depth-content .image-hardware-back:not(.static-hardware),
html.reduced-motion .section-cameras .true-depth-content .image-hardware-back:not(.static-hardware),
html.static-interaction .section-cameras .true-depth-content .image-hardware-back:not(.static-hardware),
html.no-js .section-cameras .true-depth-content .image-hardware-back:not(.static-hardware),
html.reduced-motion .section-cameras .true-depth-content .image-hardware-back:not(.static-hardware),
html.static-interaction .section-cameras .true-depth-content .image-hardware-back:not(.static-hardware) {
    opacity: 1;
    -webkit-transform: scale(.71);
    transform: scale(.71)
}

.section-cameras .true-depth-content .image-hardware-reflection {
    width: 465px;
    height: 1420px;
    background-size: 465px 1420px;
    background-repeat: no-repeat;
    background-image: url("true_depth_intro_reflection_large.jpg");
    position: absolute;
    -webkit-transform-origin: top left;
    transform-origin: top left;
    z-index: 2;
    opacity: 0.01;
    top: 0;
    left: 80px
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-cameras .true-depth-content .image-hardware-reflection {
        background-image: url("true_depth_intro_reflection_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px) {
    .section-cameras .true-depth-content .image-hardware-reflection {
        width: 317px;
        height: 1260px;
        background-size: 317px 1260px;
        background-repeat: no-repeat;
        background-image: url("true_depth_intro_reflection_medium.jpg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    .section-cameras .true-depth-content .image-hardware-reflection {
        background-image: url("true_depth_intro_reflection_medium_2x.jpg")
    }
}

@media only screen and (max-width: 1068px) {
    .section-cameras .true-depth-content .image-hardware-reflection {
        top: -1px;
        left: 100px
    }
}

html.no-js .section-cameras .true-depth-content .image-hardware-reflection,
html.reduced-motion .section-cameras .true-depth-content .image-hardware-reflection,
html.static-interaction .section-cameras .true-depth-content .image-hardware-reflection,
html.no-js .section-cameras .true-depth-content .image-hardware-reflection,
html.reduced-motion .section-cameras .true-depth-content .image-hardware-reflection,
html.static-interaction .section-cameras .true-depth-content .image-hardware-reflection,
html.no-js .section-cameras .true-depth-content .image-hardware-reflection,
html.reduced-motion .section-cameras .true-depth-content .image-hardware-reflection,
html.static-interaction .section-cameras .true-depth-content .image-hardware-reflection {
    opacity: 1
}

.section-cameras .true-depth-content .image-hardware-front {
    width: 465px;
    height: 1420px;
    background-size: 465px 1420px;
    background-repeat: no-repeat;
    background-image: url("true_depth_screen_large.jpg")
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-cameras .true-depth-content .image-hardware-front {
        background-image: url("true_depth_screen_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px) {
    .section-cameras .true-depth-content .image-hardware-front {
        width: 317px;
        height: 1260px;
        background-size: 317px 1260px;
        background-repeat: no-repeat;
        background-image: url("true_depth_screen_medium.jpg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    .section-cameras .true-depth-content .image-hardware-front {
        background-image: url("true_depth_screen_medium_2x.jpg")
    }
}

@media only screen and (max-width: 735px) {
    .section-cameras .true-depth-content .image-hardware-front {
        width: 298px;
        height: 430px;
        background-size: 298px 430px;
        background-repeat: no-repeat;
        background-image: url("true_depth_screen_small.png")
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi) {
    .section-cameras .true-depth-content .image-hardware-front {
        background-image: url("true_depth_screen_small_2x.png")
    }
}

.section-cameras .true-depth-content .image-hardware-front.static-hardware {
    position: relative;
    left: 50%;
    margin-left: -232.5px
}

@media only screen and (max-width: 1068px) {
    .section-cameras .true-depth-content .image-hardware-front.static-hardware {
        left: 50%;
        margin-left: -158.5px
    }
}

@media only screen and (max-width: 735px) {
    .section-cameras .true-depth-content .image-hardware-front.static-hardware {
        left: 50%;
        margin-left: -149px
    }
}

.section-cameras .true-depth-content .image-hardware-front:not(.static-hardware) {
    width: 465px;
    height: 1420px;
    background-size: 465px 1420px;
    background-repeat: no-repeat;
    background-image: url("true_depth_screen_fallback_large.png");
    position: absolute;
    -webkit-transform-origin: top left;
    transform-origin: top left;
    z-index: 3;
    opacity: 0.01;
    top: 32px;
    left: 278px
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-cameras .true-depth-content .image-hardware-front:not(.static-hardware) {
        background-image: url("true_depth_screen_fallback_large_2x.png")
    }
}

html.css-mask .section-cameras .true-depth-content .image-hardware-front:not(.static-hardware) {
    width: 465px;
    height: 1420px;
    background-size: 465px 1420px;
    background-repeat: no-repeat;
    background-image: url("true_depth_screen_large.jpg");
    -webkit-mask-size: 465px 1420px;
    mask-size: 465px 1420px;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-image: url("true_depth_screen_mask_large.svg");
    mask-image: url("true_depth_screen_mask_large.svg")
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    html.css-mask .section-cameras .true-depth-content .image-hardware-front:not(.static-hardware) {
        background-image: url("true_depth_screen_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px) {
    .section-cameras .true-depth-content .image-hardware-front:not(.static-hardware) {
        width: 317px;
        height: 1260px;
        background-size: 317px 1260px;
        background-repeat: no-repeat;
        background-image: url("true_depth_screen_fallback_medium.png")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    .section-cameras .true-depth-content .image-hardware-front:not(.static-hardware) {
        background-image: url("true_depth_screen_fallback_medium_2x.png")
    }
}

@media only screen and (max-width: 1068px) {
    html.css-mask .section-cameras .true-depth-content .image-hardware-front:not(.static-hardware) {
        width: 317px;
        height: 1260px;
        background-size: 317px 1260px;
        background-repeat: no-repeat;
        background-image: url("true_depth_screen_medium.jpg");
        -webkit-mask-size: 317px 1260px;
        mask-size: 317px 1260px;
        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;
        -webkit-mask-image: url("true_depth_screen_mask_medium.svg");
        mask-image: url("true_depth_screen_mask_medium.svg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    html.css-mask .section-cameras .true-depth-content .image-hardware-front:not(.static-hardware) {
        background-image: url("true_depth_screen_medium_2x.jpg")
    }
}

@media only screen and (max-width: 735px) {
    .section-cameras .true-depth-content .image-hardware-front:not(.static-hardware) {
        width: 298px;
        height: 430px;
        background-size: 298px 430px;
        background-repeat: no-repeat;
        background-image: url("true_depth_screen_small.png")
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi) {
    .section-cameras .true-depth-content .image-hardware-front:not(.static-hardware) {
        background-image: url("true_depth_screen_small_2x.png")
    }
}

@media only screen and (max-width: 735px) {
    html.css-mask .section-cameras .true-depth-content .image-hardware-front:not(.static-hardware) {
        width: 298px;
        height: 430px;
        background-size: 298px 430px;
        background-repeat: no-repeat;
        background-image: url("true_depth_screen_small.png");
        -webkit-mask-size: 298px 430px;
        mask-size: 298px 430px
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi) {
    html.css-mask .section-cameras .true-depth-content .image-hardware-front:not(.static-hardware) {
        background-image: url("true_depth_screen_small_2x.png")
    }
}

@media only screen and (max-width: 1068px) {
    .section-cameras .true-depth-content .image-hardware-front:not(.static-hardware) {
        top: 17px;
        left: 233px
    }
}

html.no-js .section-cameras .true-depth-content .image-hardware-front:not(.static-hardware),
html.reduced-motion .section-cameras .true-depth-content .image-hardware-front:not(.static-hardware),
html.static-interaction .section-cameras .true-depth-content .image-hardware-front:not(.static-hardware),
html.no-js .section-cameras .true-depth-content .image-hardware-front:not(.static-hardware),
html.reduced-motion .section-cameras .true-depth-content .image-hardware-front:not(.static-hardware),
html.static-interaction .section-cameras .true-depth-content .image-hardware-front:not(.static-hardware),
html.no-js .section-cameras .true-depth-content .image-hardware-front:not(.static-hardware),
html.reduced-motion .section-cameras .true-depth-content .image-hardware-front:not(.static-hardware),
html.static-interaction .section-cameras .true-depth-content .image-hardware-front:not(.static-hardware) {
    opacity: 1
}

.section-cameras .true-depth-content .image-hardware-front-reflection {
    width: 40px;
    height: 341px;
    background-size: 40px 341px;
    background-repeat: no-repeat;
    background-image: url("true_depth_front_reflection_large.png");
    position: absolute;
    -webkit-transform-origin: top left;
    transform-origin: top left;
    z-index: 1;
    opacity: 0.01
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-cameras .true-depth-content .image-hardware-front-reflection {
        background-image: url("true_depth_front_reflection_large_2x.png")
    }
}

@media only screen and (max-width: 1068px) {
    .section-cameras .true-depth-content .image-hardware-front-reflection {
        width: 27px;
        height: 233px;
        background-size: 27px 233px;
        background-repeat: no-repeat;
        background-image: url("true_depth_front_reflection_medium.png")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    .section-cameras .true-depth-content .image-hardware-front-reflection {
        background-image: url("true_depth_front_reflection_medium_2x.png")
    }
}

html.no-js .section-cameras .true-depth-content .image-hardware-front-reflection,
html.reduced-motion .section-cameras .true-depth-content .image-hardware-front-reflection,
html.static-interaction .section-cameras .true-depth-content .image-hardware-front-reflection,
html.no-js .section-cameras .true-depth-content .image-hardware-front-reflection,
html.reduced-motion .section-cameras .true-depth-content .image-hardware-front-reflection,
html.static-interaction .section-cameras .true-depth-content .image-hardware-front-reflection,
html.no-js .section-cameras .true-depth-content .image-hardware-front-reflection,
html.reduced-motion .section-cameras .true-depth-content .image-hardware-front-reflection,
html.static-interaction .section-cameras .true-depth-content .image-hardware-front-reflection {
    opacity: 1
}

.section-cameras .true-depth-content.sticky-container {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row
}

@media only screen and (max-width: 735px) {
    .section-cameras .true-depth-content.sticky-container {
        min-height: auto
    }
}

html.no-js .section-cameras .true-depth-content.sticky-container,
html.reduced-motion .section-cameras .true-depth-content.sticky-container,
html.static-interaction .section-cameras .true-depth-content.sticky-container,
html.no-js .section-cameras .true-depth-content.sticky-container,
html.reduced-motion .section-cameras .true-depth-content.sticky-container,
html.static-interaction .section-cameras .true-depth-content.sticky-container,
html.no-js .section-cameras .true-depth-content.sticky-container,
html.reduced-motion .section-cameras .true-depth-content.sticky-container,
html.static-interaction .section-cameras .true-depth-content.sticky-container {
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch
}

.section-cameras .true-depth-content .sticky-item {
    top: 130px;
    z-index: auto;
    height: calc(100vh - 130px);
    max-height: 1410px
}

@media only screen and (max-width: 1068px) {
    .section-cameras .true-depth-content .sticky-item {
        max-height: auto
    }
}

html.no-js .section-cameras .true-depth-content .sticky-item,
html.reduced-motion .section-cameras .true-depth-content .sticky-item,
html.static-interaction .section-cameras .true-depth-content .sticky-item,
html.no-js .section-cameras .true-depth-content .sticky-item,
html.reduced-motion .section-cameras .true-depth-content .sticky-item,
html.static-interaction .section-cameras .true-depth-content .sticky-item,
html.no-js .section-cameras .true-depth-content .sticky-item,
html.reduced-motion .section-cameras .true-depth-content .sticky-item,
html.static-interaction .section-cameras .true-depth-content .sticky-item {
    top: 0;
    height: 100%;
    width: 100%;
    max-height: 1420px
}

@media only screen and (max-width: 1068px) {
    html.no-js .section-cameras .true-depth-content .sticky-item,
    html.reduced-motion .section-cameras .true-depth-content .sticky-item,
    html.static-interaction .section-cameras .true-depth-content .sticky-item,
    html.no-js .section-cameras .true-depth-content .sticky-item,
    html.reduced-motion .section-cameras .true-depth-content .sticky-item,
    html.static-interaction .section-cameras .true-depth-content .sticky-item,
    html.no-js .section-cameras .true-depth-content .sticky-item,
    html.reduced-motion .section-cameras .true-depth-content .sticky-item,
    html.static-interaction .section-cameras .true-depth-content .sticky-item {
        height: 1420px
    }
}

.section-cameras .true-depth-content .sticky-item .crop {
    position: absolute;
    width: 100%;
    height: 100%;
    overflow: hidden
}

.section-cameras .true-depth-content .static-hardware {
    display: none
}

@media only screen and (max-width: 735px) {
    .section-cameras .true-depth-content .static-hardware {
        position: relative;
        display: block;
        margin-bottom: 50px
    }
}

.section-cameras .true-depth-content .true-depth-hardware-container {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

html.no-js .section-cameras .true-depth-content .true-depth-hardware-container,
html.reduced-motion .section-cameras .true-depth-content .true-depth-hardware-container,
html.static-interaction .section-cameras .true-depth-content .true-depth-hardware-container,
html.no-js .section-cameras .true-depth-content .true-depth-hardware-container,
html.reduced-motion .section-cameras .true-depth-content .true-depth-hardware-container,
html.static-interaction .section-cameras .true-depth-content .true-depth-hardware-container,
html.no-js .section-cameras .true-depth-content .true-depth-hardware-container,
html.reduced-motion .section-cameras .true-depth-content .true-depth-hardware-container,
html.static-interaction .section-cameras .true-depth-content .true-depth-hardware-container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end
}

@media only screen and (max-width: 1068px) {
    html.no-js .section-cameras .true-depth-content .true-depth-hardware-container,
    html.reduced-motion .section-cameras .true-depth-content .true-depth-hardware-container,
    html.static-interaction .section-cameras .true-depth-content .true-depth-hardware-container,
    html.no-js .section-cameras .true-depth-content .true-depth-hardware-container,
    html.reduced-motion .section-cameras .true-depth-content .true-depth-hardware-container,
    html.static-interaction .section-cameras .true-depth-content .true-depth-hardware-container,
    html.no-js .section-cameras .true-depth-content .true-depth-hardware-container,
    html.reduced-motion .section-cameras .true-depth-content .true-depth-hardware-container,
    html.static-interaction .section-cameras .true-depth-content .true-depth-hardware-container {
        display: block
    }
}

@media only screen and (max-width: 735px) {
    .section-cameras .true-depth-content .true-depth-hardware-container {
        display: none
    }
}

.section-cameras .true-depth-content .true-depth-copy-content {
    margin-top: 200px;
    width: 245px;
    margin-left: calc((50% - 980px/2))
}

@media only screen and (max-width: 1068px) {
    .section-cameras .true-depth-content .true-depth-copy-content {
        margin-top: 150px;
        width: 230.66667px;
        margin-left: calc((50% - 692px/2))
    }
}

@media only screen and (max-width: 735px) {
    .section-cameras .true-depth-content .true-depth-copy-content {
        margin-top: 0;
        width: 100%;
        margin-left: 0
    }
}

html.no-js .section-cameras .true-depth-content .true-depth-copy-content,
html.reduced-motion .section-cameras .true-depth-content .true-depth-copy-content,
html.static-interaction .section-cameras .true-depth-content .true-depth-copy-content,
html.no-js .section-cameras .true-depth-content .true-depth-copy-content,
html.reduced-motion .section-cameras .true-depth-content .true-depth-copy-content,
html.static-interaction .section-cameras .true-depth-content .true-depth-copy-content,
html.no-js .section-cameras .true-depth-content .true-depth-copy-content,
html.reduced-motion .section-cameras .true-depth-content .true-depth-copy-content,
html.static-interaction .section-cameras .true-depth-content .true-depth-copy-content {
    margin-top: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

@media only screen and (max-width: 1068px) {
    html.no-js .section-cameras .true-depth-content .true-depth-copy-content,
    html.reduced-motion .section-cameras .true-depth-content .true-depth-copy-content,
    html.static-interaction .section-cameras .true-depth-content .true-depth-copy-content,
    html.no-js .section-cameras .true-depth-content .true-depth-copy-content,
    html.reduced-motion .section-cameras .true-depth-content .true-depth-copy-content,
    html.static-interaction .section-cameras .true-depth-content .true-depth-copy-content,
    html.no-js .section-cameras .true-depth-content .true-depth-copy-content,
    html.reduced-motion .section-cameras .true-depth-content .true-depth-copy-content,
    html.static-interaction .section-cameras .true-depth-content .true-depth-copy-content {
        display: block
    }
}

.section-cameras .true-depth-content .true-depth-copy-container {
    margin-bottom: 80px
}

@media only screen and (max-width: 735px) {
    .section-cameras .true-depth-content .true-depth-copy-container {
        margin-bottom: 65px
    }
}

.section-cameras .true-depth-content .badge {
    width: 100%;
    max-width: 245px;
    margin-left: auto
}

@media only screen and (max-width: 1068px) {
    .section-cameras .true-depth-content .badge {
        max-width: 230.66667px
    }
}

@media only screen and (max-width: 735px) {
    .section-cameras .true-depth-content .badge {
        max-width: 100%;
        margin-left: auto
    }
}

@media only screen and (max-width: 735px) {
    .section-cameras .true-depth-content .badge {
        margin-right: 0
    }
}

.section-cameras .true-depth-content .badge-value {
    white-space: normal
}

.section-cameras .true-depth-content .badge-caption {
    position: relative;
    margin-top: 0.2em
}

.section-cameras .true-depth-content .badge-content {
    margin: 0.9em 0
}

@media only screen and (max-width: 1068px) {
    .section-cameras .true-depth-content .badge-content {
        margin: 0.65em 0;
        margin-right: 1em
    }
}

.section-wireless {
    overflow: hidden
}

.section-wireless .manifesto-wrapper {
    padding-top: 190px;
    padding-bottom: 66px
}

@media only screen and (max-width: 1068px) {
    .section-wireless .manifesto-wrapper {
        padding-top: 132px;
        padding-bottom: 53px
    }
}

@media only screen and (max-width: 735px) {
    .section-wireless .manifesto-wrapper {
        padding-top: 75px;
        padding-bottom: 40px
    }
}

.section-wireless .image-wireless {
    width: 1395px;
    height: 688px;
    background-size: 1395px 688px;
    background-repeat: no-repeat;
    background-image: url("gigabit_lte_large.jpg")
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-wireless .image-wireless {
        background-image: url("gigabit_lte_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px) {
    .section-wireless .image-wireless {
        width: 885px;
        height: 473px;
        background-size: 885px 473px;
        background-repeat: no-repeat;
        background-image: url("gigabit_lte_medium.jpg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    .section-wireless .image-wireless {
        background-image: url("gigabit_lte_medium_2x.jpg")
    }
}

@media only screen and (max-width: 735px) {
    .section-wireless .image-wireless {
        width: 411px;
        height: 203px;
        background-size: 411px 203px;
        background-repeat: no-repeat;
        background-image: url("gigabit_lte_small.jpg")
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi) {
    .section-wireless .image-wireless {
        background-image: url("gigabit_lte_small_2x.jpg")
    }
}

@media only screen and (max-width: 735px) {
    .section-wireless .image-wireless {
        margin: 0 auto
    }
}

.section-only-iphone {
    overflow: hidden
}

.section-only-iphone .manifesto-wrapper {
    padding-top: 124px;
    padding-bottom: 175px
}

@media only screen and (max-width: 1068px) {
    .section-only-iphone .manifesto-wrapper {
        padding-top: 37px;
        padding-bottom: 125px
    }
}

@media only screen and (max-width: 735px) {
    .section-only-iphone .manifesto-wrapper {
        padding-top: 58px;
        padding-bottom: 90px
    }
}

.section-compare {
    text-align: center;
    padding-top: 111px;
    padding-bottom: 124px
}

@media only screen and (max-width: 1068px) {
    .section-compare {
        padding-top: 81px;
        padding-bottom: 107px
    }
}

@media only screen and (max-width: 735px) {
    .section-compare {
        padding-top: 71px;
        padding-bottom: 71px
    }
}

.section-compare .image-compare {
    width: 599px;
    height: 432px;
    background-size: 599px 432px;
    background-repeat: no-repeat;
    background-image: url("compare_large.jpg");
    margin-left: auto;
    margin-right: auto;
    margin-top: 50px
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-compare .image-compare {
        background-image: url("compare_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px) {
    .section-compare .image-compare {
        width: 529px;
        height: 385px;
        background-size: 529px 385px;
        background-repeat: no-repeat;
        background-image: url("compare_medium.jpg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    .section-compare .image-compare {
        background-image: url("compare_medium_2x.jpg")
    }
}

@media only screen and (max-width: 735px) {
    .section-compare .image-compare {
        width: 262px;
        height: 193px;
        background-size: 262px 193px;
        background-repeat: no-repeat;
        background-image: url("compare_small.jpg")
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi) {
    .section-compare .image-compare {
        background-image: url("compare_small_2x.jpg")
    }
}

@media only screen and (max-width: 1068px) {
    .section-compare .image-compare {
        margin-top: 61px
    }
}

@media only screen and (max-width: 735px) {
    .section-compare .image-compare {
        margin-top: 43px
    }
}

.section-accessories {
    background-color: #111;
    padding-top: 108px;
    text-align: center
}

@media only screen and (max-width: 1068px) {
    .section-accessories {
        padding-top: 76px
    }
}

@media only screen and (max-width: 735px) {
    .section-accessories {
        padding-top: 72px
    }
}

.section-accessories .image-accessories {
    width: 876px;
    height: 342px;
    background-size: 876px 342px;
    background-repeat: no-repeat;
    background-image: url("accessories_large.jpg");
    position: relative;
    left: 50%;
    margin-left: -438px;
    margin-top: 54px
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx),
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .section-accessories .image-accessories {
        background-image: url("accessories_large_2x.jpg")
    }
}

@media only screen and (max-width: 1068px) {
    .section-accessories .image-accessories {
        width: 640px;
        height: 266px;
        background-size: 640px 266px;
        background-repeat: no-repeat;
        background-image: url("accessories_medium.jpg")
    }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
    .section-accessories .image-accessories {
        background-image: url("accessories_medium_2x.jpg")
    }
}

@media only screen and (max-width: 735px) {
    .section-accessories .image-accessories {
        width: 318px;
        height: 201px;
        background-size: 318px 201px;
        background-repeat: no-repeat;
        background-image: url("accessories_small.jpg")
    }
}

@media only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 735px) and (min-resolution: 1.5dppx),
only screen and (max-width: 735px) and (min-resolution: 144dpi) {
    .section-accessories .image-accessories {
        background-image: url("accessories_small_2x.jpg")
    }
}

@media only screen and (max-width: 1068px) {
    .section-accessories .image-accessories {
        left: 50%;
        margin-left: -320px
    }
}

@media only screen and (max-width: 735px) {
    .section-accessories .image-accessories {
        left: 50%;
        margin-left: -159px
    }
}

@media only screen and (max-width: 1068px) {
    .section-accessories .image-accessories {
        margin-top: 50px
    }
}

@media only screen and (max-width: 735px) {
    .section-accessories .image-accessories {
        margin-top: 42px
    }
}

.section-accessories a {
    text-align: center
}

.section-accessories .typography-overview-body {
    display: inline-block;
    margin-top: 17px
}

@media only screen and (max-width: 735px) {
    .section-accessories .typography-overview-body {
        margin-top: 15px
    }
}

.section-buystrip-hero {
    overflow: hidden;
    padding: 0
}

.section-buystrip-hero .section-content {
    padding-top: 97px;
    padding-bottom: 90px
}

@media only screen and (max-width: 1068px) {
    .section-buystrip-hero .section-content {
        padding-top: 80px;
        padding-bottom: 86px
    }
}

@media only screen and (max-width: 735px) {
    .section-buystrip-hero .section-content {
        padding-top: 70px;
        padding-bottom: 73px
    }
}

.section-buystrip-hero .block-link {
    margin: 0 auto;
    max-width: 100%
}

.section-buystrip-hero .block-link:hover .more {
    text-decoration: underline
}

.section-buystrip-hero .block-link.icon-wrapper:hover .more {
    text-decoration: none
}

.section-buystrip-hero .buystrip-hero-intro {
    margin-top: 10px;
    color: #ccc
}

.section-buystrip-hero .buystrip-hero-cta {
    margin-top: 6px;
    display: inline-block;
    color: #6bf
}

.section-buystrip-hero .copy-wrapper {
    position: relative;
    z-index: 2;
    text-align: center;
    margin-left: auto;
    margin-right: auto
}

@media only screen and (max-width: 735px) {
    .section-buystrip-hero .trade {
        margin-top: 60px
    }
}