#aem-app picture {
    line-height: 0;
    height: 0;
    font-size: 0
}

#aem-app img,
#aem-app video {
    width: 100%
}

#aem-app {
    --height-nav: 76px;
    --height-full: calc(100vh - var(--height-nav));
    --black: #000;
    --red: #CE0E2D;
    --gray: #F4F3F3;
    background-color: #fff;
    letter-spacing: calc(-.037em + .526px);
    padding: 0;
    margin: 0;
    font-weight: 500;
    color: var(--black);
    font-feature-settings: 'calt' 1, 'liga' 1
}

@media (max-width:1200px) and (max-aspect-ratio:1 / 1) {
    #aem-app {
        --height-nav: 60px;
        --height-full: calc(100vh - var(--height-nav))
    }
}

#aem-app ::-moz-selection {
    background: rgba(210, 10, 44, .8)
}

#aem-app ::selection {
    background: rgba(210, 10, 44, .8)
}

#aem-app ::-moz-selection {
    background: rgba(210, 10, 44, .8)
}

#aem-app ::-webkit-selection {
    background: rgba(210, 10, 44, .8)
}

[class^=space-] {
    display: block;
    position: relative
}

#aem-app .container {
    position: relative;
    width: calc(82.05128vw + 4.61538px);
    margin: 0 auto;
    font-size: 0;
    line-height: 0
}

#aem-app .space-7 {
    height: calc(6.41026vw + 76.92308px)
}

#aem-app .space-6 {
    height: calc(3.84615vw + 46.15385px)
}

@media (max-width:1200px) and (max-aspect-ratio:1 / 1),
(max-width:1023px) {
    #aem-app .space-6 {
        height: 21.34vw
    }
}

#aem-app .space-5 {
    height: calc(1.92308vw + 43.07692px)
}

#aem-app .space-4 {
    height: calc(1.28205vw + 35.38462px)
}

#aem-app .space-3 {
    height: calc(.64103vw + 27.69231px)
}

#aem-app .space-2 {
    height: calc(.96154vw + 11.53846px)
}

#aem-app .space-1 {
    height: 10px
}

#aem-app .sticky {
    position: -webkit-sticky;
    position: sticky
}

#aem-app .row {
    display: flex;
    font-size: 0
}

#aem-app .h1,
#aem-app h1 {
    font-size: calc(4.61538vw + 31.38462px);
    font-weight: 700
}

#aem-app .h2,
#aem-app h2 {
    font-size: calc(2.05128vw + 40.61538px);
    font-weight: 700
}

#aem-app .h3,
#aem-app h3 {
    font-weight: 700;
    margin-top: .3em;
    font-size: calc(1.53846vw + 18.46154px)
}

#aem-app .h4,
#aem-app h4 {
    font-size: calc(1.53846vw + 18.46154px);
    font-weight: 700
}

#aem-app .h5,
#aem-app h5 {
    font-size: calc(1.02564vw + 12.30769px);
    font-weight: 700
}

#aem-app h1,
#aem-app h2,
#aem-app h3,
#aem-app h4,
#aem-app h5 {
    line-height: 1.25em
}

#aem-app h3 {
    color: #1e2022
}

#aem-app p,
#aem-app span {
    line-height: 1.6em;
    color: #000
}

#aem-app * {
    letter-spacing: calc(-.037em + .526px)
}

#aem-app p.text-large {
    font-size: calc(1.02564vw + 12.30769px)
}

#aem-app p {
    font-size: calc(.38462vw + 14.61538px)
}

#aem-app .text-small,
#aem-app span.text-small {
    font-size: calc(.19231vw + 12.30769px)
}

#aem-app span.text-tiny {
    font-size: calc(.12821vw + 10.53846px)
}

#aem-app .col-3 {
    width: 30%
}

#aem-app .col-35 {
    width: 35%
}

#aem-app .col-4 {
    width: 40%
}

#aem-app .col-45 {
    width: 45%
}

#aem-app .col-5 {
    width: 50%
}

#aem-app .col-55 {
    width: 55%
}

#aem-app .col-6 {
    width: 60%
}

#aem-app .col-65 {
    width: 65%
}

#aem-app .col-7 {
    width: 70%
}

.blur-up {
    -webkit-filter: blur(20px);
    filter: blur(20px);
    transition: -webkit-filter .2s;
    transition: filter .2s;
    transition: filter .2s, -webkit-filter .2s
}

.blur-up.lazyloaded {
    -webkit-filter: blur(0);
    filter: blur(0)
}

#aem-app sup {
    font-size: .6em;
    font-weight: 700;
    vertical-align: baseline;
    position: relative;
    top: -.5em;
    z-index: 1
}

#aem-app sup a:link,
#aem-app sup a:visited {
    color: #211d1e;
    text-decoration: none
}

#aem-app .peppa-disclaimer {
    list-style-type: decimal;
    font-size: 13px;
    color: #afafaf;
    padding: 0 0 0 1.3em;
    margin-bottom: 300px;
    margin-top: -180px
}

#aem-app .peppa-disclaimer li {
    margin-bottom: .5em;
    line-height: 1.6em;
    padding-top: 300px;
    margin-bottom: -300px
}

#aem-app .peppa-disclaimer li:target {
    color: #000
}

#aem-app [class^=peppa-button] {
    border-radius: 3.5em;
    min-height: 3em;
    line-height: 1.2em;
    border: 2px solid rgba(0, 0, 0, .3);
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    padding: 0 1.75em;
    width: auto;
    font-weight: 700;
    font-family: inherit;
    text-align: center;
    user-select: none;
    -webkit-user-select: none;
    overflow: hidden;
    text-decoration: none!important;
    display: inline-block;
    vertical-align: middle;
    background: 0 0;
    transition: color .2s ease-out, background .2s ease-out, box-shadow .2s ease-out
}

#aem-app [class^=peppa-button]:focus {
    outline: 0
}

#aem-app [class^=peppa-button],
#aem-app [class^=peppa-button]:link,
#aem-app [class^=peppa-button]:visited {
    color: #ce0e2d
}

#aem-app [class^=peppa-button]:hover:not(:disabled) {
    cursor: pointer;
    color: #211d1e;
    border-color: #211d1e
}

#aem-app .peppa-button-outline,
#aem-app .peppa-button-outline:link,
#aem-app .peppa-button-outline:visited {
    color: #211d1e
}

@media (max-width:1200px) and (max-aspect-ratio:1 / 1),
(max-width:1023px) {
    #aem-app .col-3,
    #aem-app .col-35,
    #aem-app .col-4,
    #aem-app .col-45,
    #aem-app .col-5,
    #aem-app .col-55,
    #aem-app .col-6,
    #aem-app .col-65,
    #aem-app .col-7 {
        width: 100%
    }
    #aem-app .row {
        display: block
    }
    #aem-app .h3,
    #aem-app h3 {
        margin-bottom: 1.26em;
        margin-top: .42em
    }
}

.cbg-backtotop {
    position: fixed;
    z-index: 800;
    bottom: 50px;
    right: 50px
}

.cbg-backtotop a {
    display: block;
    width: 40px;
    height: 40px;
    margin: 5px 0;
    text-indent: -9999px;
    background: url(/content/dam/huawei-cbg-site/common/mkt/pdp/phones/y7a/img/sprites_cbg_icon.png) no-repeat;
    opacity: .6;
    transition: all linear .2s
}

.cbg-backtotop a:hover {
    opacity: 1
}

.cbg-backtotop a.hidden {
    opacity: 0;
    cursor: default
}

.cbg-backtotop a.cbg-icon-backtotop {
    background-position: -549px -188px
}

.cbg-backtotop a.cbg-icon-backtohome {
    background-position: -549px -148px
}

.peppa-disclaimer .current {
    color: #000
}

.smooth-scroll {
    transition: transform .5s cubic-bezier(0, .6, .3, 1);
    transform-style: preserve-3d;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    will-change: transform
}