﻿/* Carousel backgrounds */
html { font-family: "Montserrat",sans-serif; line-height: 1.15; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; overflow: hidden; height: 100vh; height: 100dvh; virtual-keyboard: overlays-content; }

body { margin: 0; font-size: 1rem; font-weight: 300; line-height: 1; color: #44476a; text-align: left; height: 100vh; height: 100dvh; z-index: 0; overflow: hidden; }

a.notAvailable { pointer-events: none; /*touch-action: manipulation;*/ }

.panpan { min-width: 100vw; min-height: 115vh; -webkit-animation: mymove 35s infinite; -webkit-animation-delay: 1.5s; animation: mymove 35s infinite; animation-delay: 1.5s; will-change: background-position; }

.loadin { background-image: url(/cover/portrait-of-a-master.avif); background-position: 50% 50%; background-size: cover; background-repeat: no-repeat; overflow: hidden; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 105%; position: fixed; width: 110%; z-index: 16; }

@media all and (orientation:portrait) {


        .landscAdjust { -webkit-transform: translate(-8dvh,-4dvh); transform: translate(-8dvh,-4dvh); }

        .portrAdjust { -webkit-transform: translate(-6dvh,0dvh); transform: translate(-6dvh,0dvh); }

        .landsc { min-height: 111vh !important; min-width: 120vw !important; top: -4vh !important;  left: -8vh !important;  }
        /*.landsc { min-height: 111vh; min-width: 120vw; top: -4vh;  left: -8vh;  }*/

        .landscRot { transform: rotate(90deg) !important; min-height: 111vh !important; min-width: 120vw !important; top: -4vh !important; top: -4dvh !important; left: -8vh !important; left: -8dvh !important; }

        .portr { min-height: 120vh !important; min-width: 114vw !important; top: -6vh !important; top: -6dvh !important; }
        /*.portr { min-height: 120vh; min-width: 114vw; top: -6vh; }*/

        /*PORT*/

        @-webkit-keyframes mymove {
            33% { background-position: 20% 50%; }

            66% { background-position: 90% 50%; }

            100% { background-position: 50% 50%; }
        }

        @keyframes mymove {
            33% { background-position: 20% 50%; }

            66% { background-position: 90% 50%; }

            100% { background-position: 50% 50%; }
        }
    }

@media all and (orientation:landscape) {
    .landscAdjust { -webkit-transform: translate(-8vh,-4vh); transform: translate(-8dvh,-4dvh); }

    .portrAdjust { -webkit-transform: translate(-16dvh,0dvh); transform: translate(-16dvh,0dvh); }

    .portr { min-height: 108vh !important; min-width: 120vw !important; left: -16vh !important; left: -16dvh !important; top: -6vh; /*transform: scale(100%);*/ }
    /*.portr { min-height: 108vh; min-width: 120vw; left: -16vh; top: -6vh; }*/

    .portrRot { transform: rotate(-90deg) !important; min-height: 108vh !important; min-width: 120vw !important; left: -16vh !important; left: -16dvh !important; }

    .landsc { min-height: 106vh !important; min-width: 108vw !important; top: -4vh !important;  left: -8vh !important;  }
    /*.landsc { min-height: 106vh; min-width: 108vw; top: -4vh;  left: -8vh;  }*/

        /*LAND*/

        @-webkit-keyframes mymove {
            33% { background-position: 50% 20%; }

            66% { background-position: 50% 90%; }

            100% { background-position: 50% 50%; }
        }

        @keyframes mymove {
            33% { background-position: 50% 20%; }

            66% { background-position: 50% 90%; }

            100% { background-position: 50% 50%; }
        }
    }

/* Main responsive */
#carousel, #carousel ul, #carousel li { min-height: 100%; height: 100vh; height: 100dvh; padding: 0; margin: 0; position: relative; opacity: 1; }

#carousel { /*background: silver; background: transparent;*/ overflow: hidden; width: 100%; -webkit-backface-visibility: hidden; -webkit-transform: translate(0,0); backface-visibility: hidden; }

    #carousel ul.animate { transition: all .45s cubic-bezier(.4, 0.1, 0.15, 1); }

.animateSlowly { transition: all 1s cubic-bezier(.4, 0.1, 0.15, 1); }

.animateSlower { transition: all .5s cubic-bezier(.4, 0.1, 0.15, 1); }

.anim55 { transition: all .55s linear; }

.anim45 { transition: all .45s cubic-bezier(.4, 0.1, 0.15, 1); }

.anim35 { transition: all .35s cubic-bezier(.4, 0.1, 0.15, 1); }

.anim25 { transition: all .25s cubic-bezier(.4, 0.1, 0.15, 1); }

.anim15 { transition: all .15s cubic-bezier(.4, 0.1, 0.15, 1); }

#carousel ul { -webkit-transform: translate(0,0); transform: translate(0,0); overflow: hidden; -webkit-backface-visibility: hidden; backface-visibility: hidden; position: relative; }

/*#carousel ul { -webkit-box-shadow: 0 0 20px rgba(0,0,0,.2); box-shadow: 0 0 20px rgba(0,0,0,.2);*/ /*position: relative;*/ /*position: relative; }*/

#carousel li { float: left; overflow: hidden; /*-webkit-transform-style: preserve-3d;*/ -webkit-transform: translate(0,0); transform: translate(0,0); position: relative; }

    #carousel li h2 { color: #fff; text-align: center; position: relative; top: 40%; left: 0; width: 100%; text-shadow: -1px -1px 0 rgba(0,0,0,.2); }

#carouselQ, #carouselQ ul, #carouselQ li { min-height: 100%; height: 100%; padding: 0; margin: 0; position: relative; opacity: 1; }

#carouselQ { background: silver; overflow: hidden; width: 100%; -webkit-backface-visibility: hidden; -webkit-transform: translate(0,0); backface-visibility: hidden; transform: translate(0,0); }

    #carouselQ ul.animate { transition: all .3s; }

.animateSlowly { transition: all 1s; }

.animateSlower { transition: all .5s; }

#carouselQ ul { -webkit-transform: translate(0,0); transform: translate(0,0); overflow: hidden; -webkit-backface-visibility: hidden; backface-visibility: hidden; opacity: 1; }

#carouselQ ul { -webkit-box-shadow: 0 0 20px rgba(0,0,0,.2); box-shadow: 0 0 20px rgba(0,0,0,.2); position: relative; }

#carouselQ li { float: left; overflow: hidden; -webkit-transform: translate(0,0); transform: translate(0,0); }

    #carouselQ li h2 { color: #fff; text-align: center; position: absolute; top: 40%; left: 0; width: 100%; text-shadow: -1px -1px 0 rgba(0,0,0,.2); }

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block }

ol, ul { list-style: none; opacity: 1; }

blockquote, q { quotes: none }

    blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none }

table { border-collapse: collapse; border-spacing: 0 }

.background { background-size: cover; background-repeat: no-repeat; background-position: 50% 50%; overflow: hidden; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 120vh; height: 120dvh; position: fixed; width: 100%; will-change: transform; }

.backgroundO, .backgroundL, .backgroundP { background-size: cover; background-repeat: no-repeat; background-position: 50% 50%; position: absolute; overflow: hidden; min-height: 120vh; left: -5%; right: -5%; min-width: 120vw; min-width: 120dvw; will-change: transform; }

.transformNow { will-change: transform; -webkit-transform: translateY(0vh); transform: translateY(0vh); }

.background:before { content: ""; position: absolute; width: 100%; height: 100%; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(0, 0, 0, 0); }

.backgroundO, .backgroundL, .backgroundP:before { position: absolute; min-width: 100%; min-height: 100%; }

.backgroundq:before { content: ""; position: absolute; width: 100%; height: 100%; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(0, 0, 0, 0); }

.backgroundq { background-size: cover; background-repeat: no-repeat; background-position: 50% 50%; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; position: fixed; width: 100%; transition: all 1.1s cubic-bezier(0.26, 0.81, 0, 1); }

.background, .backgroundO, .backgroundL, .backgroundP:first-child { -webkit-transform: translateY(0vh); transform: translateY(0vh); }

.content-wrapperF { position: relative; position: fixed; height: 100vh; height: 100dvh; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; text-align: center; -webkit-flex-flow: column nowrap; -ms-flex-flow: column nowrap; flex-flow: column nowrap; color: #222; font-family: Montserrat !important; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; text-transform: uppercase; filter: opacity(0); }

.addF { -webkit-transform: translateY(-25vh); transform: translateY(-25vh); transition: all .4s cubic-bezier(0.16, -.6, 0.26, 1.4); }

.content-wrapper { position: relative; height: 100vh; height: 100dvh; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; text-align: center; -webkit-flex-flow: column nowrap; -ms-flex-flow: column nowrap; flex-flow: column nowrap; color: #222; font-family: Montserrat !important; text-transform: uppercase; -webkit-transform: translateY(-25vh); -ms-transform: translateY(-25vh); transform: translateY(-25vh); will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; transition: all .5s cubic-bezier(0.46, -.6, 0.36, 1.5); filter: opacity(0); }

.polinaMain { position: relative !important; bottom: -25%; padding: 1rem 0rem 1rem 0rem; height: auto; width: 100vw; font-weight: 100; color: #222; margin-left: 0rem; margin-right: 0rem; font-size: 100%; }

.polinaMainF { position: relative !important; bottom: -25%; padding: 1rem 0rem 1rem 0rem; height: auto; width: 100vw; font-weight: 100; color: #222; margin-left: 0rem; margin-right: 0rem; font-size: 100%; }

.goingRight { margin: 0; position: absolute; transform: rotate(-180deg); z-index: 22; }

#shoppingRight { margin: 0; position: fixed; z-index: 206; }

.NotFirstPolina { background: linear-gradient(rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 0.4)), url(/icons/paper-texture.avif) center center fixed no-repeat; }

.fadeAway { }

.backgroundq:nth-child(1) { z-index: 12; }

.backgroundq:nth-child(2) { z-index: 11; }

.backgroundq:nth-child(3) { z-index: 10; }

.backgroundq:nth-child(4) { z-index: 9; }

.backgroundq:nth-child(5) { z-index: 8; }

/* story */

.norm { padding: 0; text-align: center !important; }

.sml, .smr { width: 100px }

video { position: fixed; top: 50%; left: 50%; min-width: 100vw; min-height: 100vh; min-width: 100dvw; min-height: 100dvh; width: auto; max-height: Calc(100vh - 160px); max-height: Calc(100dvh - 160px); z-index: -100; -webkit-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); background-size: cover; transition: opacity .6s; border: 0; will-change: transform; }

#gallery, #polina1, #polina2, #polina3, #polina4, #polina5, #polina6 { font-weight: 100; padding: 0; width: 100vw; border-radius: 0px !important; position: fixed; left: 0; bottom: 0; display: none; color: #fff; background: rgba(0,0,0,.5); margin: 0; }

    #polina1 button, #polina2 button, #polina3 button, #polina4 button { text-align: center; padding: 5px; margin: 0 auto; font-size: 1rem; border-radius: 4px !important; border-style: none; cursor: pointer; transition: background .3s; width: 130px; font-family: 'Lato', sans-serif; text-transform: uppercase !important; }

.stopfade { opacity: .5 }

#polina1, #polina2, #polina3, #polina4, #polina5, #polina6 { margin: 0; }

#gallery { margin: 0 0 0; height: 80px; opacity: 0 }

#polina1 button, #polina2 button, #polina4 button { background: rgba(255,255,255,.23); color: #fff; transition: background .3s }

#polina3 button { background: rgba(255,255,255,.77); color: #000; transition: background .3s }

#polina5 button, #polina6 button { padding: 5px; transition: background .3s; font-size: 1rem; background: rgba(255,255,255,.23); border-radius: 4px !important; border-style: none; cursor: pointer; text-align: center; color: #fff; font-family: 'Lato', sans-serif; text-transform: uppercase !important; }

#polina5 button { width: 130px; transition: background .3s }

#polina6 button { transition: background .3s }

#gallery button { text-align: center; padding: 5px; font-size: 1rem; background: rgba(255,255,255,.23); color: #fff; border-radius: 4px !important; border-style: none; cursor: pointer; transition: background .3s; font-family: 'Lato', sans-serif; text-transform: uppercase !important; }

.lemo { text-align: center; margin: 20px 0 0 }

@media screen and (min-width:768px) {
    #gallery, #polina1, #polina2, #polina3, #polina4, #polina5, #polina6 { font-weight: 100; background: rgba(0,0,0,.5); padding: 0; border-radius: 0px !important; position: fixed; bottom: 0; right: 3.5vh; display: none; color: #fff }

        #gallery button, #polina1 button, #polina2 button, #polina3 button, #polina4 button, #polina5 button, #polina6 button { padding: 10px; font-size: 1.2rem; border-radius: 4px !important; border-style: none; cursor: pointer; font-family: 'Lato', sans-serif; text-transform: uppercase !important; }

    #polina1, #polina2, #polina3, #polina4, #polina5, #polina6 { margin: 0; height: 240px }

    #gallery { margin: 0 0 0; height: 80px; opacity: 0 }

    #polina1 button, #polina2 button, #polina4 button { text-align: center; width: 130px; margin: 0 auto; background: rgba(255,255,255,.23); color: #fff; transition: background .3s }

    #polina3 button { text-align: center; width: 130px; margin: 0 auto; background: rgba(255,255,255,.77); color: #000; transition: background .3s }

    #gallery button, #polina5 button, #polina6 button { text-align: center; background: rgba(255,255,255,.23); color: #fff; transition: background .3s }

    .lemo { text-align: center; margin: 10px 0 0 }
}

.lemon { text-align: center; margin: 0 }

#gallery button:hover, #polina1 button:hover, #polina2 button:hover, #polina4 button:hover, #polina5 button:hover, #polina6 button:hover { background: rgba(0,0,0,.5) }

#polina3 button:hover { background: rgba(255,255,255,.5); color: #fff }

.sml { margin-left: 21vw; }

.smr { margin-right: 21vw; }

.smx { width: 58vw }

.pcla { padding-top: 18px; padding-bottom: 8px }

p.art { font-size: .85rem; }

.genius { font-size: calc(1.45rem + 1.5vw) !important; padding-bottom: 15px; }

/* landscape - portrait */

.shareBtn { height: 1.7rem; }

.sharePos { top: 5.3vh; top: 5.3dvh; left: 86.5vw; position: fixed; }

.polinaQuiz { background: rgba(0,0,0,.62); color: white; padding: 1rem 0rem 1rem 0rem; width: auto; margin: 0; position: fixed; bottom: 65vh; bottom: 65dvh; z-index: 20; width: 75vw; left: 12.5vw; border-radius: 5px; }

.polinaAnswer { background: rgba(255, 255, 255,.7); color: white; padding: .75rem; width: auto; margin: 0; position: fixed; z-index: 20; width: 75vw; left: 12.5vw; border-radius: 5px; text-align: left; }

.que { font-size: 1.4rem; line-height: 1.4; color: #eee; text-align: center; text-transform: uppercase; font-weight: 500; margin: 0; padding: 0 0.4rem 0 0.5rem; letter-spacing: 0.2px; }

.quea { font-size: 1.1rem; line-height: 1.4; color: #000; text-align: center; text-transform: uppercase; font-weight: 400; margin: 0; letter-spacing: 0.1px; margin-bottom: 0 !important; }

.queab { font-size: 1.1rem; line-height: 1.4; color: #000; text-align: center; text-transform: uppercase; font-weight: 400; margin: 0; letter-spacing: 0.1px; margin-bottom: 0 !important; background: rgba(255,255,255,.2); }

.queaa { font-size: 1.1rem; line-height: 1.4; color: #eee; text-align: center; text-transform: uppercase; font-weight: 400; margin: 0; letter-spacing: 0.1px; margin-bottom: 0 !important; background: rgba(0, 0, 0, 0.8); }

.aaaau { /*transform: rotate(-180deg);*/ /*left: 87.5vw;*/ right: 4vw; position: fixed; }

.desci { width: 83vw; left: 8.5vw; bottom: 25vh; }

.disco { width: 83vw; left: 8.5vw }

.fs { font-size: 0.9rem }

.fsh { font-size: 1.3rem }

.timelineVOld{ width: .75vw; color: #fff; border: 1px solid #888; border-radius: 1px; float: none; box-sizing: border-box; background: #888; }

.timelineVO { width: .75vw; border: .5px solid #666; border-radius: 1px; float: none; box-sizing: border-box; background: #888; }

.fixedTimeLineV, .fixedTimeLineVO { position: fixed; float: none; top: 40%; left: 5vw; z-index: 20; margin: 0; }

.currentVOld{ float: none; border: 0.75px solid #888; background: #fff; width: .75vw; }

.currentVO { float: none; border: 0.5px solid #888; background: #fff; width: .75vw; }

/*LANDSCAPE*/
@media all and (orientation:landscape) {
    .backgroundO, .backgroundL, .backgroundP { background-size: cover; background-repeat: no-repeat; background-position: 50% 50%; overflow: hidden; -webkit-backface-visibility: hidden; backface-visibility: hidden; min-height: 120vh; min-height: 120dvh; min-width: 100vh; min-width: 100dvh; position: fixed; z-index: 100; }

        .backgroundO, .backgroundL, .backgroundP:before { content: ""; position: absolute; min-width: 100%; min-height: 100%; background-color: rgba(0, 0, 0, 0); }

    /* main arrow */
    .porland { height: 1.4rem; }

    .pola { position: fixed; left: 91vw; margin-bottom: 0; }
    /* story arrows */
    .porlandl { height: 2rem; }

    .polal { position: fixed; top: 2vh; left: 2vw; z-index: 20; transform: rotate(-180deg); }

    .polarr { position: fixed; bottom: 110px; /*left: 88vw; */ right: 4vmin; z-index: 20; }
    /* story text */
    .poph1 { text-shadow: -0.65px -0.65px 0 #000, 0.65px -0.65px 0 #000, -0.65px 0.65px 0 #000, 0.65px 0.65px 0 #000; font-size: 1.55rem; font-weight: bolder; padding: 1rem 0 0 2rem; color: #fff; text-align: left; text-transform: uppercase; }

    .popp { text-shadow: -0.65px -0.65px 0 #000, 0.65px -0.65px 0 #000, -0.65px 0.65px 0 #000, 0.65px 0.65px 0 #000; font-size: 1.2rem; padding: .6rem 3.2rem 1rem 2rem; text-align: left; color: #fff; }
    /* story bcg */

    .mmm { display: none; }

    .genius { color: #000; font-weight: bolder; }

    p.art { padding: 1rem; }

    .p { padding: 1rem }

    #polina1, #polina2, #polina3, #polina4, #polina5, #polina6 { height: 10rem; margin-bottom: 0; }

    #ori1 { background-position: 50% 16%; }

    #kepQ { background-position: 50% 16%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; min-height: 100%; position: fixed; min-width: 100%; will-change: background-position; }

    .addToKepQ { -webkit-transform: translateY(0vh); transform: translateY(0vh); }

    .polinaMain { position: relative !important; bottom: -25%; padding: .3rem 0rem .3rem 0rem; height: auto; width: 100vw; font-weight: 100; /*background: rgba(0,0,0,0.5); background: linear-gradient(rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 0.4)), /*url(/icons/paper-texture.avif) center center fixed no-repeat;*/ color: #222; margin-left: 0rem; margin-right: 0rem; font-size: 100%; }

    .polinaMainF { position: relative !important; bottom: -25%; padding: .3rem 0rem .3rem 0rem; height: auto; width: 100vw; font-weight: 100; /*background: rgba(0,0,0,0.5); background: linear-gradient(rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 0.4)), /*url(/icons/paper-texture.avif) */center center fixed no-repeat; margin-left: 0rem; margin-right: 0rem; font-size: 100%; }

    #kepL { background-position: 50% 50%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 111vh; position: fixed; width: 100%; -webkit-transform: translateY(15vh); transform: translateY(15vh); }

    #kep3 { background-position: 50% 50%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; position: fixed; width: 100%; -webkit-transform: translateY(15vh); transform: translateY(15vh); }

    #kep4 { background-position: 50% 16%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; position: fixed; width: 100%; -webkit-transform: translateY(15vh); transform: translateY(15vh); }

    #kep5 { background-position: 50% 16%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; position: fixed; width: 100%; -webkit-transform: translateY(15vh); transform: translateY(15vh); }

    #kepQQ { }

    .polinaQuiz { background: rgba(0,0,0,.62); color: white; padding: 1rem 0rem 1rem 0rem; width: auto; margin: 0; position: fixed; bottom: 65vh; bottom: 65dvh; z-index: 20; width: 60vw; left: 20vw; border-radius: 5px; }

    .polinaAnswer { background: rgba(255, 255, 255,.7); color: white; padding: .75rem; width: auto; margin: 0; position: fixed; z-index: 20; width: 60vw; left: 20vw; border-radius: 5px; text-align: left; }



    #x1 { background-position: 50% 50%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; position: fixed; width: 100%; }

/*    #x2 { background-image: url(/50img/quiz-bcg/c/2l-Child-Genius-bw.avif); background-position: 50% 50%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; position: fixed; width: 100%; }

    #x3 { background-image: url(/50img/quiz-bcg/c/3l-USA-bw.avif); background-position: 50% 12%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; position: fixed; width: 100%; }

    #x4 { background-image: url(/50img/quiz-bcg/c/8.avif); background-position: 50% 10%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; position: fixed; width: 100%; }

    #x5 { background-image: url(/50img/quiz-bcg/c/1l-Stephen-and-King-Charles-III.avif); background-position: 50% 75%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; position: fixed; width: 100%; }

    #x6 { background-image: url(/50img/quiz-bcg/c/7.avif); background-position: 50% 7%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; position: fixed; width: 100%; }

    #x7 { background-image: url(/50img/quiz-bcg/c/5-getty.avif); background-position: 50% 30%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; position: fixed; width: 100%; }

    #x8 { background-image: url(/50img/quiz-bcg/c/6.avif); background-position: 45% 50%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; position: fixed; width: 100%; }

    #x9 { background-image: url(/50img/quiz-bcg/c/9.avif); background-position: 50% 50%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; position: fixed; width: 100%; }

    #x10 { background-image: url(/50img/quiz-bcg/c/10.avif); background-position: 50% 10%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; position: fixed; width: 100%; }

    #x11 { background-image: url(/50img/quiz-bcg/c/10.avif); background-position: 50% 10%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; position: fixed; width: 100%; }*/





/*    #x2 {  background-position: 50% 50%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; position: fixed; width: 100%; }

    #x3 { background-position: 50% 12%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; position: fixed; width: 100%; }

    #x4 {  background-position: 50% 10%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; position: fixed; width: 100%; }

    #x5 {  background-position: 50% 75%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; position: fixed; width: 100%; }

    #x6 { background-position: 50% 7%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; position: fixed; width: 100%; }

    #x7 { background-position: 50% 30%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; position: fixed; width: 100%; }

    #x8 {  background-position: 45% 50%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; position: fixed; width: 100%; }

    #x9 {  background-position: 50% 50%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; position: fixed; width: 100%; }

    #x10 {  background-position: 50% 10%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; position: fixed; width: 100%; }

    #x11 {  background-position: 50% 10%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; position: fixed; width: 100%; }*/

    .bbbb { height: 1.8rem; }

    .shareBtn { height: 1.7rem; }

    .sharePos { top: 5.3vh; left: 86.5vw; position: fixed; }

    .bbbbu { top: 5vh; left: 6.5vw; position: fixed; }

    .bbbbur { top: 5vh; left: 88.5vw; position: fixed; }

    .bbbburr { top: 5vh; left: 7.5vw !important; position: fixed; }

    .shopHere { height: 3.4rem; }

    .shopHerePos { position: fixed; bottom: 38vh; left: 47.3vw; }

    .timelineVOld{ width: .4vh; }

    .timelineVO { width: .4vh; }

    .fixedTimeLineV, .fixedTimeLineVO { top: 40%; left: 3vw; }

    .currentVOld{ width: .45vh; }

    .currentVO { float: none; border: 0.5px solid #888; background: #fff; width: .4vh; }

    @media all and (min-height:220px) and (max-height:375.99px) and (orientation:landscape) {
        .content-title { font-size: 1.55rem; line-height: 1.3; padding-bottom: 1vh; letter-spacing: 0.1vw; }

        .content-subtitle { font-size: 0.95rem; line-height: 1.4; margin-bottom: .25rem; }

        /* main arrow */
        .porland { height: 1.4rem; }

        .pola { position: fixed; left: 91vw; margin-bottom: 0; transform: rotate(-180deg); }
        /* story arrows */
        .porlandl { height: 1.6rem; }

        .polal { position: fixed; top: 2vh; left: 1.5vw; z-index: 20; transform: rotate(-180deg); }

        .polarr { position: fixed; bottom: 101px; /*left: 93vw;*/ right: 4vmin; z-index: 20; }
        /* story text */
        .poph1 { font-size: 1.6rem; font-weight: bolder; padding: 1.8rem 0 0 2rem; color: #fff; text-align: left; }

        .popp { font-size: 1rem; padding: .5rem 3.2rem 1rem 2rem; text-align: left; color: #fff; }
        /* story bcg */

        .polia1 { bottom: 41vh; bottom: 41dvh; min-height: 90px; }

        .polia2 { bottom: 25vh; bottom: 25dvh; min-height: 90px; }

        .polia3 { bottom: 9vh; bottom: 9dvh; min-height: 90px; }

        .poliaLong { bottom: 9vh; bottom: 9dvh; }

        .shortA { padding: 1rem 0.6rem 1rem 0rem; }

        .longA { padding: 0.4rem 2rem 0.4rem 2rem; }

        .polinaQuiz { bottom: 57vh; bottom: 57dvh; }

        .polinaAnswer { padding: 0; min-height: 48px; }

        .que { font-size: 1.3rem; line-height: 0.8; color: #eee; text-align: center; text-transform: uppercase; font-weight: 500; margin: 0; padding: 0 0.4rem 0 0.5rem; letter-spacing: 0.2px; }

        .quea { font-size: 1.1rem; line-height: 0.8; color: #000; text-align: center; text-transform: uppercase; font-weight: 400; margin: 0; letter-spacing: 0.1px; margin-bottom: 0 !important; }

        .queab { font-size: 1.1rem; line-height: 1; color: #000; text-align: center; text-transform: uppercase; font-weight: 400; margin: 0; letter-spacing: 0.1px; margin-bottom: 0 !important; background: rgba(255,255,255,.2); }

        .queaa { font-size: 1.1rem; line-height: 1; color: #fff; text-align: center; text-transform: uppercase; font-weight: 400; margin: 0; letter-spacing: 0.1px; margin-bottom: 0 !important; background: rgba(0, 0, 0, 0.8); }

        .desci { width: 82vw; left: 9vw; bottom: 8vh; bottom: 8dvh; }

        .disco { width: 82vw; left: 9vw; }

        .fs { font-size: 0.8rem !important; line-height: 1 !important; }

        .fsh { font-size: 1rem !important; line-height: 1 !important; }

        .bbbb { height: 1.5rem; }

        .bbbbur { left: 90.5vw; }

        .bbbbu { left: 6.5vw; }

        .shareBtn { height: 1.7rem; }

        .sharePos { top: 5.5vh; }

        .shopHere { height: 2.1rem; }

        .shopHerePos { position: fixed; bottom: 45vh; bottom: 45dvh; left: 4vw; }
    }

    @media all and (min-height:360px) and (max-height:374.99px) and (orientation:landscape) {
        .bbbb { height: 1.65rem; margin-top: 1vh; }
    }

    @media all and (min-height:375px) and (max-height:375.99px) and (orientation:landscape) {
        .bbbb { height: 1.8rem; }
    }

    @media all and (min-height:376px) and (max-height:399.99px) and (orientation:landscape) {
        .content-title { font-size: 1.85rem; line-height: 1.3; padding-bottom: 1vh; letter-spacing: 0.1vw; }

        .content-subtitle { font-size: 1.1rem; line-height: 1.4; margin-bottom: .25rem; }

        /* main arrow */
        .porland { height: 1.4rem; }

        .pola { position: fixed; left: 91vw; margin-bottom: 0; }
        /* story arrows */
        .porlandl { height: 1.6rem; }

        .polal { position: fixed; top: 2vh; left: 1.5vw; z-index: 20; transform: rotate(-180deg); }

        .polarr { position: fixed; bottom: 101px; /*left: 93vw;*/ right: 4vmin; z-index: 20; }
        /* story text */
        .poph1 { font-size: 1.6rem; font-weight: bolder; padding: 1.8rem 2rem 1rem 2rem; color: #fff; text-align: left; }

        .popp { font-size: 1.3rem; padding: .2rem 3.2rem 1rem 2rem; text-align: left; color: #fff; }
        /* story bcg */

        .polia1 { bottom: 45vh; bottom: 45dvh; min-height: 90px; }

        .polia2 { bottom: 30vh; bottom: 30dvh; min-height: 90px; }

        .polia3 { bottom: 15vh; bottom: 15dvh; min-height: 90px; }

        .poliaLong { bottom: 12vh; bottom: 12dvh; }

        .shortA { padding: 0.75rem 0.6rem 0.75rem 0rem; }

        .longA { padding: 0.4rem 7rem 0.4rem 7rem; }

        .polinaQuiz { bottom: 60vh; bottom: 60dvh; }

        .polinaAnswer { padding: 0; min-height: 48px; }

        .que { font-size: 1.3rem; line-height: 1.3; color: #eee; text-align: center; text-transform: uppercase; font-weight: 500; margin: 0; padding: 0 0.4rem 0 0.5rem; letter-spacing: 0.2px; }

        .quea { font-size: 1.1rem; line-height: 1.3; color: #000; text-align: center; text-transform: uppercase; font-weight: 400; margin: 0; letter-spacing: 0.1px; margin-bottom: 0 !important; }

        .queab { font-size: 1.1rem; line-height: 1.3; color: #000; text-align: center; text-transform: uppercase; font-weight: 400; margin: 0; letter-spacing: 0.1px; margin-bottom: 0 !important; background: rgba(255,255,255,.2); }

        .queaa { font-size: 1.1rem; line-height: 1.3; color: #fff; text-align: center; text-transform: uppercase; font-weight: 400; margin: 0; letter-spacing: 0.1px; margin-bottom: 0 !important; background: rgba(0, 0, 0, 0.8); }

        .bbbb { height: 2.2rem; }

        .bbbbur { left: 90.5vw; }

        .bbbbu { left: 6.5vw; }

        .shareBtn { height: 1.8rem; }

        .sharePos { /*top: 5.8vh;*/ top: 7.1vh; }

        .desci { width: 74vw; left: 13vw; bottom: 8vh; bottom: 8dvh; }

        .disco { width: 74vw; left: 13vw; }

        .fs { font-size: 0.9rem !important; line-height: 1 !important; }

        .fsh { font-size: 1rem !important; line-height: 1 !important; }

        .shopHere { height: 2.1rem; }

        .shopHerePos { position: fixed; bottom: 45vh; bottom: 45dvh; left: 4vw; }
    }

    @media all and (min-height:400px) and (max-height:599.99px) and (orientation:landscape) {
        .timelineVOld{ width: 2px !important; }

        .currentVOld{ width: 2px !important; }

        .timelineVO { width: .5vw; }

        .currentVO { width: .5vw; }

        .content-title { font-size: 1.75rem; line-height: 1.3; padding-bottom: 1vh; letter-spacing: 0.1vw; }

        .content-subtitle { font-size: 1.1rem; line-height: 1.4; margin-bottom: .25rem; }

        /* main arrow */
        .porland { height: 1.4rem; }

        .pola { position: fixed; left: 91vw; margin-bottom: 0; }
        /* story arrows */
        .porlandl { height: 1.6rem; }

        .polal { position: fixed; top: 2vh; left: 1.5vw; z-index: 20; transform: rotate(-180deg); }

        .polarr { position: fixed; bottom: 93px; /*left: 93vw;*/ right: 4vmin; z-index: 20; }
        /* story text */
        .poph1 { font-size: 1.8rem; font-weight: bolder; padding: 1.8rem 2rem 1rem 2rem; color: #fff; text-align: left; }

        .popp { font-size: 1rem; padding: 0rem 8rem 1rem 2rem; text-align: left; color: #fff; }
        /* story bcg */

        .polia1 { bottom: 40vh; bottom: 40dvh; min-height: 90px; }

        .polia2 { bottom: 26vh; bottom: 26dvh; min-height: 90px; }

        .polia3 { bottom: 12vh; bottom: 12dvh; min-height: 90px; }

        .poliaLong { bottom: 9.5vh; bottom: 9.5dvh; }

        .shortA { padding: 0.75rem 0.6rem 0.75rem 0rem; }

        .longA { padding: 0.4rem 8rem 0.4rem 8rem; }

        .polinaQuiz { bottom: 54vh; bottom: 54dvh; }

        .polinaAnswer { padding: 0; min-height: 48px; }

        .que { font-size: 1.4rem; line-height: 1.3; color: #eee; text-align: center; text-transform: uppercase; font-weight: 500; margin: 0; padding: 0 0.4rem 0 0.5rem; letter-spacing: 0.2px; }

        .quea { font-size: 1.1rem; line-height: 1.3; color: #000; text-align: center; text-transform: uppercase; font-weight: 400; margin: 0; letter-spacing: 0.1px; margin-bottom: 0 !important; }

        .queab { font-size: 1.1rem; line-height: 1.3; color: #000; text-align: center; text-transform: uppercase; font-weight: 400; margin: 0; letter-spacing: 0.1px; margin-bottom: 0 !important; background: rgba(255,255,255,.2); }

        .queaa { font-size: 1.1rem; line-height: 1.3; color: #fff; text-align: center; text-transform: uppercase; font-weight: 400; margin: 0; letter-spacing: 0.1px; margin-bottom: 0 !important; background: rgba(0, 0, 0, 0.8); }

        .bbbb { height: 2.1rem; }

        .bbbbur { top: 7.5vh; top: 7.5dvh; left: 90.5vw; }

        .bbbbu { top: 7.5vh; top: 7.5dvh; }

        .shareBtn { height: 1.8rem; }

        .sharePos { top: 8vh; top: 8dvh; }

        .desci { width: 66vw; left: 17vw; bottom: 8vh; bottom: 8dvh; }

        .disco { width: 66vw; left: 17vw; }

        .fs { font-size: 0.9rem !important; line-height: 1.1 !important; }

        .fsh { font-size: 1rem !important; line-height: 1 !important; }

        .shopHere { height: 2.1rem; }

        .shopHerePos { position: fixed; bottom: 45vh; bottom: 45dvh; left: 4vw; }
    }

    @media all and (min-height:600px) and (max-height:849.99px) and (orientation:landscape) {
        .content-title { font-size: 2.3em; line-height: 1.3; padding-bottom: 1vh; letter-spacing: 0.1vw; }

        .content-subtitle { font-size: 1.4rem; line-height: 1.4; margin-bottom: .25rem; }

        .btn-End, a.btn-End { font-size: 3vmin; margin: 1.3vmin 3.25vmin 3.25vmin 3.25vmin; padding: .7vmin 3.4vmin .7vmin 3.4vmin; /*background-color: rgba(0,0,0,0);*/}
        /* main arrow */
        .porland { height: 1.8rem; }

        .pola { position: fixed; left: 91vw; margin-bottom: 0; }
        /* story arrows */
        .porlandl { height: 1.6rem; }

        .polal { position: fixed; top: 2vh; left: 1.5vw; z-index: 20; transform: rotate(-180deg); }

        .polarr { position: fixed; bottom: 81px; /*left: 92vw;*/ right: 4.4vmin; z-index: 20; }
        /* story text */
        .poph1 { font-size: 2rem; font-weight: bolder; padding: 2rem 2rem 1rem 2rem; color: #fff; text-align: left; }

        .popp { font-size: 1.25rem; padding: .6rem 10rem 1rem 2rem; text-align: left; color: #fff; }
        /* story bcg */

        .polia1 { bottom: 40vh; bottom: 40dvh; min-height: 90px; }

        .polia2 { bottom: 28.7vh; bottom: 28.7dvh; min-height: 90px; }

        .polia3 { bottom: 17.4vh; bottom: 17.4dvh; min-height: 90px; }

        .poliaLong { bottom: 14vh; bottom: 14dvh; }

        .shortA { padding: 0.75rem 0.6rem 0.75rem 0rem; }

        .longA { padding: .4rem 1rem .4rem 1rem; }

        .polinaQuiz { bottom: 52vh; bottom: 52dvh; }

        .polinaAnswer { padding: 0; min-height: 48px; }

        .que { font-size: 2.3rem; line-height: 1.3; color: #eee; text-align: center; text-transform: uppercase; font-weight: 500; margin: 0; padding: 0 0.4rem 0 0.5rem; letter-spacing: 0.1px; }

        .quea { font-size: 1.8rem; line-height: 1.34; color: #000; text-align: center; text-transform: uppercase; font-weight: 400; margin: 0; letter-spacing: 0.1px; margin-bottom: 0 !important; }

        .queab { font-size: 1.8rem; line-height: 1.34; color: #000; text-align: center; text-transform: uppercase; font-weight: 400; margin: 0; letter-spacing: 0.1px; margin-bottom: 0 !important; background: rgba(255,255,255,.2); }

        .queaa { font-size: 1.8rem; line-height: 1.34; color: #fff; text-align: center; text-transform: uppercase; font-weight: 400; margin: 0; letter-spacing: 0.1px; margin-bottom: 0 !important; background: rgba(0, 0, 0, 0.8); }

        .bbbb { height: 3.2rem; }

        .bbbbur { left: 89.5vw; }

        .aaaau { /*transform: rotate(-180deg);*/ right: 4.5vw; position: fixed; }

        .bbbbu { left: 6.5vw; }

        .shareBtn { height: 2.4rem; }

        .sharePos { top: 5.5vh; top: 5.5dvh; }

        .desci { width: 66vw; left: 17vw; bottom: 8vh; bottom: 8dvh; }

        .disco { width: 66vw; left: 17vw; }

        .fs { font-size: 1.1rem !important; line-height: 1.3 !important; }

        .fsh { font-size: 1.6rem !important; line-height: 1 !important; }

        .shopHere { height: 3rem; }

        .shopHerePos { position: fixed; bottom: 46vh; bottom: 46dvh; left: 4vw; }
    }

    @media all and (min-height:850px) and (max-height:1023.99px) and (orientation:landscape) {
        .content-title { font-size: 2.8rem; line-height: 1.3; padding-bottom: 1vh; letter-spacing: 0.1vw; }

        .content-subtitle { font-size: 1.8rem; line-height: 1.4; margin-bottom: .25rem; }

        /* main arrow */
        .porland { height: 1.8rem; }

        .pola { position: fixed; left: 91vw; margin-bottom: 0; }
        /* story arrows */
        .porlandl { height: 1.8rem; }

        .polal { position: fixed; top: 2vh; left: 1.5vw; z-index: 20; transform: rotate(-180deg); }

        .polarr { position: fixed; bottom: 80px; /* left: 93vw;*/ right: 4vmin; z-index: 20; }
        /* story text */
        .poph1 { font-size: 1.9rem; font-weight: bolder; padding: 1.8rem 2rem 1rem 2rem; color: #fff; text-align: left; }

        .popp { font-size: 1.3rem; padding: .2rem 10rem 1rem 4rem; text-align: left; color: #fff; }
        /* story bcg */

        .polia1 { bottom: 40vh; bottom: 40dvh; min-height: 90px; }

        .polia2 { bottom: 28vh; bottom: 28dvh; min-height: 90px; }

        .polia3 { bottom: 16vh; bottom: 16dvh; min-height: 90px; }

        .poliaLong { bottom: 12vh; bottom: 12dvh; }

        .shortA { padding: 0.75rem 0.6rem 0.75rem 0rem; }

        .longA { padding: 0.4rem 7rem 0.4rem 7rem; }

        .polinaQuiz { bottom: 52vh; bottom: 52dvh; }

        .polinaAnswer { padding: 0; min-height: 48px; }

        .que { font-size: 2.8rem; line-height: 1.3; color: #eee; text-align: center; text-transform: uppercase; font-weight: 500; margin: 0; padding: 0 0.4rem 0 0.5rem; letter-spacing: 0.2px; }

        .quea { font-size: 2.3rem; line-height: 1.34; color: #000; text-align: center; text-transform: uppercase; font-weight: 400; margin: 0; letter-spacing: 0.1px; margin-bottom: 0 !important; }

        .queab { font-size: 2.3rem; line-height: 1.34; color: #000; text-align: center; text-transform: uppercase; font-weight: 400; margin: 0; letter-spacing: 0.1px; margin-bottom: 0 !important; background: rgba(255,255,255,.2); }

        .queaa { font-size: 2.3rem; line-height: 1.34; color: #fff; text-align: center; text-transform: uppercase; font-weight: 400; margin: 0; letter-spacing: 0.1px; margin-bottom: 0 !important; background: rgba(0, 0, 0, 0.8); }

        .aaaau { /*transform: rotate(-180deg);*/ right: 4.5vw; position: fixed; }

        .bbbb { height: 2.65rem; }

        .bbbbur { left: 90.5vw; }

        .bbbbu { left: 6.5vw; }

        .shareBtn { height: 2.5rem; }

        .sharePos { top: 5.1vh; top: 5.1dvh; }

        .desci { width: 64vw; left: 18vw; bottom: 8vh; bottom: 8dvh; }

        .disco { width: 64vw; left: 18vw; }

        .fs { font-size: 1.3rem !important; line-height: 1.3 !important; }

        .fsh { font-size: 1.7rem !important; line-height: 1 !important; }

        .shopHere { height: 3rem; }

        .shopHerePos { position: fixed; bottom: 47vh; bottom: 47dvh; left: 4vw; }
    }

    @media all and (min-height:1024px) and (orientation:landscape) {
        .content-title { font-size: 2.8rem; line-height: 1.25; padding-bottom: 1vh; letter-spacing: 0.1vw; }

        .content-subtitle { font-size: 1.6rem; line-height: 1.2; margin-bottom: .25rem; }

        /* main arrow */
        .porland { height: 2rem; }

        .pola { position: fixed; left: 91vw; margin-bottom: 0; }
        /* story arrows */
        .porlandl { height: 1.8rem; }

        .polal { position: fixed; top: 2vh; left: 1.5vw; z-index: 20; transform: rotate(-180deg); }

        .polarr { position: fixed; bottom: 76px; /*left: 95vw;*/ right: 4vmin; z-index: 20; }
        /* story text */
        .poph1 { font-size: 2.1rem; font-weight: bolder; padding: 1.5rem 2rem 1rem 2rem; color: #fff; text-align: left; }

        .popp { font-size: 1.5rem; padding: .5rem 8rem 1rem 4rem; text-align: left; color: #fff; }
        /* story bcg */

        .polia1 { bottom: 40vh; bottom: 40dvh; min-height: 90px; }

        .polia2 { bottom: 28vh; bottom: 28dvh; min-height: 90px; }

        .polia3 { bottom: 16vh; bottom: 16dvh; min-height: 90px; }

        .poliaLong { bottom: 11.4vh; bottom: 11.4dvh; }

        .shortA { padding: 0.75rem 0.6rem 0.75rem 0rem; }

        .longA { padding: 0.4rem 9rem 0.4rem 9rem; }

        .polinaQuiz { bottom: 52vh; bottom: 52dvh; }

        .polinaAnswer { padding: 0; min-height: 48px; }

        .que { font-size: 2.8rem; line-height: 1.3; color: #eee; text-align: center; text-transform: uppercase; font-weight: 500; margin: 0; padding: 0 0.4rem 0 0.5rem; letter-spacing: 0.2px; }

        .quea { font-size: 2.3rem; line-height: 1.34; color: #000; text-align: center; text-transform: uppercase; font-weight: 400; margin: 0; letter-spacing: 0.1px; margin-bottom: 0 !important; }

        .queab { font-size: 2.3rem; line-height: 1.34; color: #000; text-align: center; text-transform: uppercase; font-weight: 400; margin: 0; letter-spacing: 0.1px; margin-bottom: 0 !important; background: rgba(255,255,255,.2); }

        .queaa { font-size: 2.3rem; line-height: 1.34; color: #fff; text-align: center; text-transform: uppercase; font-weight: 400; margin: 0; letter-spacing: 0.1px; margin-bottom: 0 !important; background: rgba(0, 0, 0, 0.8); }

        .bbbb { height: 3.4rem; }

        .bbbbu { left: 6.5vw; }

        .bbbbur { left: 90.5vw; }

        .shareBtn { height: 2.4rem; }

        .sharePos { top: 5.5vh; top: 5.5dvh; }

        .aaaau { /*transform: rotate(-180deg);*/ right: 4.5vw; position: fixed; }

        .desci { width: 45vw !important; left: 27.5vw !important; bottom: 15vh !important; }

        .disco { width: 45vw !important; left: 27.5vw !important }

        .shopHere { height: 3.2rem; }

        .shopHerePos { position: fixed; bottom: 46.5vh; bottom: 46.5dvh; left: 4vw; }
    }
}

@media all and (min-height:1024px) and (min-width:1280px) and (orientation:landscape) {
    .shortA { padding: 1.25rem 0.6rem 1.25rem 0rem }
    .longA { padding: 1.5rem; }
}

    /*PORTRAIT*/
    @media all and (orientation:portrait) {
        .fixedTimeLineV, .fixedTimeLineVO { width: 0.75vw; /*width: 3.6px;*/ position: fixed; float: none; top: 40%; left: 5vw; z-index: 20; margin: 0; }

        .currentVOld{ float: none; border: 0.5px solid #888; background: #fff; width: 2.6px; }

        /* main arrow */
        .porland { height: 1.4rem; }

        .pola { position: fixed; left: 91vw; margin-bottom: 0; }
        /* story arrows */
        .porlandl { height: 2rem; }

        .polal { position: fixed; top: 2vh; left: 2vw; z-index: 20; transform: rotate(-180deg); }

        .polarr { position: fixed; bottom: 110px; /* left: 88vw;*/ right: 5.5vmin; z-index: 20; }


        /* story text */
        .poph1 { text-shadow: -0.65px -0.65px 0 #000, 0.65px -0.65px 0 #000, -0.65px 0.65px 0 #000, 0.65px 0.65px 0 #000; font-size: 1.55rem; font-weight: bolder; padding: 1rem 0 0 2rem; color: #fff; text-align: left; text-transform: uppercase; }

        .popp { text-shadow: -0.65px -0.65px 0 #000, 0.65px -0.65px 0 #000, -0.65px 0.65px 0 #000, 0.65px 0.65px 0 #000; font-size: 1.05rem; padding: .8rem 2.2rem 1rem 2rem; text-align: left; color: #fff; }
        /*    .popp { text-shadow: -0.65px -0.65px 0 #000, 0.65px -0.65px 0 #000, -0.65px 0.65px 0 #000, 0.65px 0.65px 0 #000; font-size: 1.18rem; padding: .8rem 8.2rem 1rem 2rem; text-align: left; color: #fff; line-height:1.4; }*/


        /* story bcg */

        .mmm { display: none; }

        .genius { color: #000; font-weight: bolder; }

        p.art { padding: 1rem; }

        .p { padding: 1rem }
        /* long bio */

        #polina1, #polina2, #polina3, #polina4, #polina5, #polina6 { height: 10rem; margin-bottom: 0; }

        #ori1 { }

        #kepQ { background-position: 25% 50%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100vh; height: 100dvh; position: fixed; width: 100%; }

        .addToKepQ { -webkit-transform: translateY(0vh); transform: translateY(0vh); }

        #kepL { background-position: 59% 18%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; position: fixed; width: 100%; -webkit-transform: translateY(15vh); transform: translateY(15vh); }

        #kep3 { background-position: 70% 50%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; position: fixed; width: 100%; -webkit-transform: translateY(15vh); transform: translateY(15vh); }

        #kep33 { }

        #kep4 { background-position: 69% 50%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; position: fixed; width: 100%; -webkit-transform: translateY(15vh); transform: translateY(15vh); }

        #kep5 { background-position: 48% center; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; position: fixed; width: 100%; -webkit-transform: translateY(15vh); transform: translateY(15vh); }

        #kepQQ { }

        #x1 { background-position: 50% 50%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; position: fixed; width: 100%; }

        /*    #x2 { background-image: url(/cover/Child-Genius-Portrait.avif); background-position: 50% 50%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; position: fixed; width: 100%; }

    #x3 { background-image: url(/50img/quiz-bcg/c/3p-USA-bw.avif); background-position: 50% 50%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; position: fixed; width: 100%; }

    #x4 { background-image: url(/50img/quiz-bcg/c/8.avif); background-position: 50% 50%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; position: fixed; width: 100%; }

    #x5 { background-image: url(/50img/quiz-bcg/c/5.avif); background-position: 20% 50%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; position: fixed; width: 100%; }

    #x6 { background-image: url(/50img/quiz-bcg/c/7.avif); background-position: 22% 50%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; position: fixed; width: 100%; }

    #x7 { background-image: url(/50img/quiz-bcg/c/5-getty.avif); background-position: 50% 50%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; position: fixed; width: 100%; }

    #x8 { background-image: url(/50img/quiz-bcg/c/6.avif); background-position: 65% 50%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; position: fixed; width: 100%; }

    #x9 { background-image: url(/50img/quiz-bcg/c/9.avif); background-position: 50% 50%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; position: fixed; width: 100%; }

    #x10 { background-image: url(/50img/quiz-bcg/c/10.avif); background-position: 22% 50%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; position: fixed; width: 100%; }
*/


        /*    #vx1p { video[poster]}


    #x2 { background-position: 50% 50%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; position: fixed; width: 100%; }

    #x3 {  background-position: 50% 50%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; position: fixed; width: 100%; }

    #x4 {  background-position: 50% 50%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; position: fixed; width: 100%; }

    #x5 {  background-position: 20% 50%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; position: fixed; width: 100%; }

    #x6 {  background-position: 22% 50%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; position: fixed; width: 100%; }

    #x7 {  background-position: 50% 50%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; position: fixed; width: 100%; }

    #x8 { background-position: 65% 50%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; position: fixed; width: 100%; }

    #x9 {  background-position: 50% 50%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; position: fixed; width: 100%; }

    #x10 {  background-position: 22% 50%; background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; position: fixed; width: 100%; }
*/


        .polinaQuiz { background: rgba(0,0,0,.62); color: white; padding: 1rem 0rem 1rem 0rem; width: auto; margin: 0; position: fixed; bottom: 50vh; bottom: 5dvh; z-index: 20; width: 75vw; left: 12.5vw; border-radius: 5px; }

        .polinaAnswer { background: rgba(255, 255, 255,.7); color: white; padding: .75rem; width: auto; margin: 0; position: fixed; z-index: 20; width: 75vw; left: 12.5vw; border-radius: 5px; text-align: left; }

        .bbbb { height: 1.8rem; }

        .shareBtn { height: 1.7rem; }

        .sharePos { top: 7.1vh; top: 7.1dvh; left: 86.5vw; position: fixed; }

        .bbbbu { top: 5vh; top: 5dvh; left: 4.5vw; position: fixed; }

        .bbbbur { top: 5vh; top: 5dvh; left: 88.5vw; position: fixed; }

        .bbbburr { top: 6.9vh; top: 6.9dvh; left: 3vw !important; position: fixed; }

        .shopHere { height: 2.2rem; }

        .shopHerePos { position: fixed; bottom: 46.5vh; bottom: 46.5dvh; left: 4vw; }

        @media all and (min-width:220px) and (max-width:375.99px) and (orientation:portrait) {
            .content-title { font-size: 1.2rem; line-height: 1.2; padding-bottom: 1vh; letter-spacing: 0.1vw; }

            .content-subtitle { font-size: 0.84rem; line-height: 1.4; margin-bottom: .25rem; }

            .bbbb { height: 1.75rem; }

            /* main arrow */
            .porland { height: 1.4rem; }

            .pola { position: fixed; bottom: 22.9vh; left: 91vw; margin-bottom: 0; }
            /* story arrows */
            .porlandl { height: 2rem; }

            .polal { position: fixed; top: 2vh; left: 2vw; z-index: 20; transform: rotate(-180deg); }

            .polarr { position: fixed; bottom: 111px; /*left: 88vw;*/ right: 5.5vmin; z-index: 20; }
            /* story text */
            .poph1 { font-size: 1.45rem; font-weight: bolder; padding: 1.1rem 0 0 2rem; color: #fff; text-align: left; }

            .popp { font-size: 1rem; padding: .8rem 2.2rem 1rem 2rem; text-align: left; color: #fff; }
            /* story bcg */

            .aaaau { /*transform: rotate(-180deg);*/ /*left: 87.5vw;*/ position: fixed; right: 4vw; }

            .bbbb { font-size: 1.8rem; }

            .shareBtn { height: 1.7rem; }

            .sharePos { top: 7.1vh; top: 7.1dvh; left: 86.5vw; position: fixed; }

            .bbbbu { top: 5vh; top: 5dvh; left: 4.5vw; position: fixed; }

            .bbbbur { top: 5vh; top: 5dvh; left: 87.5vw; position: fixed; }

            .polia1 { bottom: 35vh; bottom: 35dvh; min-height: 48px; }

            .polia2 { bottom: 26vh; bottom: 26dvh; min-height: 48px; }

            .polia3 { bottom: 17vh; bottom: 17dvh; min-height: 48px; }

            .poliaLong { bottom: 15vh; bottom: 15dvh; }

            .shortA { padding: 0.75rem 0.5rem 0.75rem .5rem; }

            .longA { padding: 0.65rem 0.4rem 0.65rem 0.4rem; line-height: 1.3; }

            .polinaQuiz { bottom: 44vh; bottom: 44dvh; }

            .polinaAnswer { padding: 0; min-height: 44px; }

            .que { font-size: 1.2rem; line-height: 0.9; color: #eee; text-align: center; text-transform: uppercase; font-weight: 500; margin: 0; padding: 0 0.4rem 0 0.5rem; letter-spacing: 0.2px; }

            .quea { font-size: 1rem; line-height: 0.9; color: #000; text-align: center; text-transform: uppercase; font-weight: 400; margin: 0; letter-spacing: 0.1px; margin-bottom: 0 !important; }

            .queab { font-size: 1rem; line-height: 1.4; color: #000; text-align: center; text-transform: uppercase; font-weight: 400; margin: 0; letter-spacing: 0.1px; margin-bottom: 0 !important; background: rgba(255,255,255,.2); }

            .queaa { font-size: 1rem; line-height: 1.4; color: #fff; text-align: center; text-transform: uppercase; font-weight: 400; margin: 0; letter-spacing: 0.1px; margin-bottom: 0 !important; background: rgba(0, 0, 0, 0.8); }

            .desci { width: 94vw; left: 3vw; bottom: 12vh; bottom: 12dvh; }

            .disco { width: 94vw; left: 3vw; }

            .fs { font-size: .9rem !important; line-height: 1.1 !important; }

            .fsh { font-size: 1.1rem !important; line-height: 1.1 !important; }
        }

        @media all and (min-width:376px) and (max-width:399.99px) and (orientation:portrait) {
            .content-title { font-size: 1.35rem; line-height: 1.3; padding-bottom: 1vh; letter-spacing: 0.1vw; }

            .content-subtitle { font-size: 0.85rem; line-height: 1.4; margin-bottom: .25rem; }

            /* main arrow */
            .porland { height: 1.6rem; }

            .pola { position: fixed; left: 92.5vw; margin-bottom: 0; }
            /* story arrows */
            .porlandl { height: 1.7rem; }

            .polal { position: fixed; top: 2.2vh; left: 4vw; z-index: 20; transform: rotate(-180deg); }

            .polarr { position: fixed; bottom: 109px; /*left: 90vw;*/ right: 4.6vmin; z-index: 20; }
            /* story text */
            .poph1 { font-size: 1.6rem; font-weight: bolder; padding: 1rem 0 0 2rem; color: #fff; text-align: left; }

            .popp { font-size: 1.1rem; padding: .8rem 2.2rem 1rem 2rem; text-align: left; color: #fff; }

            .aaaau { /*transform: rotate(-180deg);*/ /*left: 87.5vw;*/ right: 4vw; position: fixed; }

            .bbbb { font-size: 1.8rem; }

            .shareBtn { height: 1.7rem; }

            .sharePos { top: 7.1vh; top: 7.1dvh; left: 86.5vw; position: fixed; }

            .bbbbu { top: 5vh; top: 5dvh; left: 4.5vw; position: fixed; }

            .bbbbur { top: 5vh; top: 5dvh; left: 87.5vw; position: fixed; }

            .polia1 { bottom: 39vh; bottom: 39dvh; min-height: 48px; }

            .polia2 { bottom: 31vh; bottom: 31dvh; min-height: 48px; }

            .polia3 { bottom: 23vh; bottom: 23dvh; min-height: 48px; }

            .poliaLong { bottom: 21.5vh; bottom: 21.5dvh; }

            .shortA { padding: 0.75rem 0.6rem 0.75rem 0rem; }

            .longA { padding: 0.4rem .4rem 0.4rem 0.4rem; }

            .polinaQuiz { bottom: 47vh; bottom: 47dvh; }

            .polinaAnswer { padding: 0; min-height: 48px; }

            .que { font-size: 1.3rem; line-height: 1.4; color: #eee; text-align: center; text-transform: uppercase; font-weight: 500; margin: 0; padding: 0 0.4rem 0 0.5rem; letter-spacing: 0.2px; }

            .quea { font-size: 1.05rem; line-height: 1.4; color: #000; text-align: center; text-transform: uppercase; font-weight: 400; margin: 0; letter-spacing: 0.1px; margin-bottom: 0 !important; }

            .queab { font-size: 1.05rem; line-height: 1.4; color: #000; text-align: center; text-transform: uppercase; font-weight: 400; margin: 0; letter-spacing: 0.1px; margin-bottom: 0 !important; background: rgba(255,255,255,.2); }

            .queaa { font-size: 1.05rem; line-height: 1.4; color: #fff; text-align: center; text-transform: uppercase; font-weight: 400; margin: 0; letter-spacing: 0.1px; margin-bottom: 0 !important; background: rgba(0, 0, 0, 0.8); }

            .desci { width: 88vw; left: 6vw; bottom: 16vh; bottom: 16dvh; }

            .disco { width: 88vw; left: 6vw; }

            .fs { font-size: 1rem !important; line-height: 1.1 !important; }

            .fsh { font-size: 1.4rem !important; line-height: 1.2 !important; }

            .shopHere { height: 2.1rem; }

            .shopHerePos { position: fixed; bottom: 47.4vh; bottom: 47.4dvh; left: 3.6vw; }
        }

        @media all and (min-width:400px) and (max-width:599.99px) and (orientation:portrait) {
            .content-title { font-size: 1.45rem; line-height: 1.2; padding-bottom: 0.5vh; letter-spacing: 0.1vw; }

            .content-subtitle { font-size: 0.98rem; line-height: 1.4; margin-bottom: .2rem; }

            /* main arrow */
            .porland { height: 1.6rem; }

            .pola { position: fixed; left: 87.5vw; margin-bottom: 0; }
            /* story arrows */
            .porlandl { height: 1.7rem; }

            .polal { position: fixed; top: 2.2vh; left: 4vw; z-index: 20; transform: rotate(-180deg); }

            .polarr { position: fixed; bottom: 106px; /*left: 88vw;*/ right: 5.2vmin; z-index: 20; }
            /* story text */
            .poph1 { font-size: 1.6rem; font-weight: bolder; padding: 1rem 0 0 2rem; color: #fff; text-align: left; }

            .popp { font-size: 1.12rem; padding: .4rem 2.2rem 1rem 2rem; text-align: left; color: #fff; }

            .aaaau { /*transform: rotate(-180deg); */ /*left: 87.5vw;*/ right: 4.5vw; position: fixed; }

            .bbbb { font-size: 1.8rem; }

            .shareBtn { padding: 3px 0 0 6px; height: 1.5rem; }

            .sharePos { top: 7.1vh; top: 7.1dvh; left: 88.5vw; position: fixed; }

            .bbbbu { top: 5vh; top: 5dvh; left: 4.5vw; position: fixed; }

            .bbbbur { top: 5vh; top: 5dvh; left: 88.5vw; position: fixed; }

            .polia1 { bottom: 34vh; bottom: 34dvh; min-height: 48px; }

            .polia2 { bottom: 27vh; bottom: 27dvh; min-height: 48px; }

            .polia3 { bottom: 20vh; bottom: 20dvh; min-height: 48px; }

            .poliaLong { bottom: 18.7vh; bottom: 18.7dvh; }

            .shortA { padding: 0.75rem 0.6rem 0.75rem 0rem; }

            .longA { padding: 0.5rem 0.4rem 0.6rem 0.4rem; }

            .polinaQuiz { bottom: 41vh; bottom: 41dvh; }

            .polinaAnswer { padding: 0; min-height: 48px; }

            .que { font-size: 1.4rem; line-height: 1.2; color: #eee; text-align: center; text-transform: uppercase; font-weight: 500; margin: 0; padding: 0 0.4rem 0 0.5rem; letter-spacing: 0.2px; }

            .quea { font-size: 1.1rem; line-height: 1.2; color: #000; text-align: center; text-transform: uppercase; font-weight: 400; margin: 0; letter-spacing: 0.1px; margin-bottom: 0 !important; }

            .queab { font-size: 1.2rem; line-height: 1.2; color: #000; text-align: center; text-transform: uppercase; font-weight: 400; margin: 0; letter-spacing: 0.1px; margin-bottom: 0 !important; background: rgba(255,255,255,.2); }

            .queaa { font-size: 1.2rem; line-height: 1.2; color: #fff; text-align: center; text-transform: uppercase; font-weight: 400; margin: 0; letter-spacing: 0.1px; margin-bottom: 0 !important; background: rgba(0, 0, 0, 0.8); }

            .desci { width: 88vw; left: 6vw; bottom: 16vh; bottom: 16dvh; }

            .disco { width: 88vw; left: 6vw; }

            .fs { font-size: 1.1rem !important; line-height: 1.2 !important; }

            .fsh { font-size: 1.5rem !important; line-height: 1.2 !important; }

            .shopHere { height: 2.1rem; }

            .shopHerePos { position: fixed; bottom: 47.6vh; bottom: 47.6dvh; left: 3.8vw; }
        }

        @media all and (min-width:600px) and (max-width:849.99px) and (orientation:portrait) {
            .content-title { font-size: 2.3rem; line-height: 1.3; padding-bottom: 0.5vh; letter-spacing: 0.1vw; }

            .content-subtitle { font-size: 1.3rem; line-height: 1.6; margin-bottom: .2rem; }

            /* main arrow */
            .porland { height: 1.9rem; }

            .pola { position: fixed; left: 92.5vw; margin-bottom: 0; }
            /* story arrows */
            .porlandl { height: 1.7rem; }

            .polal { position: fixed; top: 2.2vh; left: 4vw; z-index: 20; transform: rotate(-180deg); }

            .polarr { position: fixed; bottom: 90px; /* left: 90vw;*/ right: 4.5vmin; z-index: 20; }
            /* story text */
            .poph1 { font-size: 1.8rem; font-weight: bolder; padding: 1.75rem 0 0 2rem; color: #fff; text-align: left; }

            .popp { text-shadow: -0.65px -0.65px 0 #000, 0.65px -0.65px 0 #000, -0.65px 0.65px 0 #000, 0.65px 0.65px 0 #000; font-size: 1.18rem; padding: .8rem 8.2rem 1rem 2rem; text-align: left; color: #fff; line-height: 1.4; }

            .polia1 { bottom: 33vh; bottom: 33dvh; min-height: 50px; }

            .polia2 { bottom: 25vh; bottom: 25dvh; min-height: 50px; }

            .polia3 { bottom: 17vh; bottom: 17dvh; min-height: 50px; }

            .poliaLong { bottom: 14vh; bottom: 14dvh; }

            .shortA { padding: 0.75rem 0.6rem 0.75rem 0rem; }

            .longA { padding: 0.4rem 0.4rem 0.4rem 0.4rem; }

            .polinaQuiz { bottom: 41vh; bottom: 41dvh; width: 60vw; left: 20vw; }

            .polinaAnswer { padding: 0; min-height: 50px; width: 60vw; left: 20vw; }

            .que { font-size: 2.2rem; line-height: 1.3; color: #eee; text-align: center; text-transform: uppercase; font-weight: 500; margin: 0; padding: 0 0.4rem 0 0.5rem; letter-spacing: 0.2px; }

            .quea { font-size: 1.8rem; line-height: 1.4; color: #000; text-align: center; text-transform: uppercase; font-weight: 400; margin: 0; letter-spacing: 0.1px; margin-bottom: 0 !important; }

            .queab { font-size: 1.8rem; line-height: 1.4; color: #000; text-align: center; text-transform: uppercase; font-weight: 400; margin: 0; letter-spacing: 0.1px; margin-bottom: 0 !important; background: rgba(255,255,255,.2); }

            .queaa { font-size: 1.8rem; line-height: 1.4; color: #fff; text-align: center; text-transform: uppercase; font-weight: 400; margin: 0; letter-spacing: 0.1px; margin-bottom: 0 !important; background: rgba(0, 0, 0, 0.8); }

            .bbbb { height: 2.55rem; }

            .zozo { /*            zoom: .80;
            margin: 2vmin;*/ }

            .shareBtn { height: 1.7rem; }

            .sharePos { top: 5.3vh; top: 5.3dvh; left: 86.5vw; position: fixed; }

            .aaaau { /*transform: rotate(-180deg);*/ right: 4.5vw; position: fixed; }

            .bbbbu { top: 5vh; top: 5dvh; left: 4.5vw; position: fixed; }

            .bbbbur { top: 5vh; top: 5dvh; left: 91.5vw; position: fixed; }

            .desci { width: 86vw; left: 7vw; bottom: 16vh; bottom: 16dvh; }

            .disco { width: 86vw; left: 7vw; }

            .fs { font-size: 1.6rem !important; line-height: 1.2 !important; }

            .fsh { font-size: 2.1rem !important; line-height: 1.4 !important; }

            .shopHere { height: 2.7rem; }

            .shopHerePos { position: fixed; bottom: 47.7vh; bottom: 47.7dvh; left: 4vw; }
        }

        @media all and (min-width:850px) and (orientation:portrait) {
            .content-title { font-size: 2.8rem; line-height: 1.3; padding-bottom: 0.5vh; letter-spacing: 0.1vw; }

            .content-subtitle { font-size: 1.6rem; line-height: 1.4; margin-bottom: .5rem; }

            /* main arrow */
            .porland { height: 2rem; }

            .pola { position: fixed; left: 92.5vw; margin-bottom: 0; }
            /* story arrows */
            .porlandl { height: 1.7rem; }

            .polal { position: fixed; top: 2.2vh; left: 4vw; z-index: 20; transform: rotate(-180deg); }

            .polarr { position: fixed; bottom: 75px; /*left: 90vw;*/ right: 4vmin; z-index: 20; }
            /* story text */
            .poph1 { font-size: 1.8rem; font-weight: bolder; padding: 1.5rem 0 0 2rem; color: #fff; text-align: left; }

            .popp { font-size: 1.25rem; padding: .9rem 4rem 1rem 2rem; text-align: left; color: #fff; }

            .polia1 { bottom: 33vh; bottom: 33dvh; min-height: 50px; }

            .polia2 { bottom: 25vh; bottom: 25dvh; min-height: 50px; }

            .polia3 { bottom: 17vh; bottom: 17dvh; min-height: 50px; }

            .poliaLong { bottom: 14vh; bottom: 14dvh; }

            .shortA { padding: 0.75rem 0.6rem 0.75rem 0rem; }

            .longA { padding: 0.4rem 0.4rem 0.4rem 0.4rem; }

            .polinaQuiz { bottom: 41vh; bottom: 41dvh; border-radius: 8px; width: 60vw; left: 20vw; }

            .polinaAnswer { padding: 0; min-height: 50px; border-radius: 8px; width: 60vw; left: 20vw; }

            .que { font-size: 2.6rem; line-height: 1.4; color: #eee; text-align: center; text-transform: uppercase; font-weight: 500; margin: 0; padding: 0 0.4rem 0 0.5rem; letter-spacing: 0.2px; }

            .quea { font-size: 2.1rem; line-height: 1.4; color: #000; text-align: center; text-transform: uppercase; font-weight: 400; margin: 0; letter-spacing: 0.1px; margin-bottom: 0 !important; }

            .queab { font-size: 2.1rem; line-height: 1.4; color: #000; text-align: center; text-transform: uppercase; font-weight: 400; margin: 0; letter-spacing: 0.1px; margin-bottom: 0 !important; background: rgba(255,255,255,.2); }

            .queaa { font-size: 2.1rem; line-height: 1.4; color: #fff; text-align: center; text-transform: uppercase; font-weight: 400; margin: 0; letter-spacing: 0.1px; margin-bottom: 0 !important; background: rgba(0, 0, 0, 0.8); }

            .bbbb { height: 3rem; }

            .shareBtn { height: 1.7rem; }

            .sharePos { top: 5.3vh; top: 5.3dvh; left: 86.5vw; position: fixed; }

            .aaaau { /*transform: rotate(-180deg);*/ /*left: 87.5vw;*/ right: 4.5vw; position: fixed; }

            .bbbbu { top: 5vh; top: 5dvh; left: 4.5vw; position: fixed; }

            .bbbbur { top: 5vh; top: 5dvh; left: 90.5vw; position: fixed; }

            .desci { width: 86vw; left: 7vw; bottom: 16vh; bottom: 16dvh; }

            .disco { width: 86vw; left: 7vw; }

            .fs { font-size: 1.7rem !important; line-height: 1.4 !important; }

            .fsh { font-size: 2rem !important; line-height: 1.7 !important; }

            .shopHere { height: 2.7rem; }

            .shopHerePos { position: fixed; bottom: 47.7vh; bottom: 47.7dvh; left: 4vw; }
        }

        @media all and (min-width:1024px) and (orientation:portrait) {
            .content-title { font-size: 2.8rem; line-height: 1.4; padding-bottom: 0.5vh; letter-spacing: 0.1vw; }

            .content-subtitle { font-size: 1.8rem; line-height: 1.4; }

            /* main arrow */
            .porland { height: 2.6rem; }

            .pola { position: fixed; left: 92.5vw; margin-bottom: 0; }
            /* story arrows */
            .porlandl { height: 2.3rem; }

            .polal { position: fixed; top: 2.2vh; left: 4vw; z-index: 20; transform: rotate(-180deg); }

            .polarr { position: fixed; bottom: 73px; /* left: 90vw;*/ right: 4vmin; z-index: 20; }
            /* story text */
            .poph1 { font-size: 1.8rem; font-weight: bolder; padding: 1.5rem 0 0 2rem; color: #fff; text-align: left; }

            .popp { font-size: 1.5rem; padding: 1.1rem 6rem 1rem 2rem; text-align: left; color: #fff; line-height: 1.3; }

            .polia1 { bottom: 33vh; bottom: 33dvh; min-height: 50px; }

            .polia2 { bottom: 25vh; bottom: 25dvh; min-height: 50px; }

            .polia3 { bottom: 17vh; bottom: 17dvh; min-height: 50px; }

            .poliaLong { bottom: 14vh; bottom: 14dvh; }

            .shortA { padding: 0.75rem 0.6rem 0.75rem 0rem; }

            .longA { padding: 0.4rem 0.4rem 0.4rem 0.4rem; }

            .polinaQuiz { bottom: 41vh; bottom: 41dvh; border-radius: 8px; width: 60vw; left: 20vw; }

            .polinaAnswer { padding: 0; min-height: 50px; border-radius: 8px; width: 60vw; left: 20vw; }

            .que { font-size: 2.4rem; line-height: 1.4; color: #eee; text-align: center; text-transform: uppercase; font-weight: 500; margin: 0; padding: 0 0.4rem 0 0.5rem; letter-spacing: 0.2px; }

            .quea { font-size: 2.1rem; line-height: 1.4; color: #000; text-align: center; text-transform: uppercase; font-weight: 400; margin: 0; letter-spacing: 0.1px; margin-bottom: 0 !important; }

            .queab { font-size: 2.1rem; line-height: 1.4; color: #000; text-align: center; text-transform: uppercase; font-weight: 400; margin: 0; letter-spacing: 0.1px; margin-bottom: 0 !important; background: rgba(255,255,255,.2); }

            .queaa { font-size: 2.1rem; line-height: 1.4; color: #fff; text-align: center; text-transform: uppercase; font-weight: 400; margin: 0; letter-spacing: 0.1px; margin-bottom: 0 !important; background: rgba(0, 0, 0, 0.8); }

            .bbbb { height: 3.65rem; margin-right: -2vw; }

            .shareBtn { height: 1.7rem; }

            .sharePos { top: 5.3vh; top: 5.3dvh; left: 86.5vw; position: fixed; }

            .desci { width: 86vw; left: 7vw; bottom: 16vh; bottom: 16dvh; }

            .disco { width: 86vw; left: 7vw; }

            .fs { font-size: 1.8rem !important; line-height: 1.3 !important; }

            .fsh { font-size: 2rem !important; line-height: 1 !important; }
        }
    }

    .simpleBcg { background-size: cover; background-repeat: no-repeat; overflow: hidden; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100vh; height: 100dvh; position: fixed; width: 100%; }

    .stretch { z-index: 20; }

.container { margin: 0; padding: 0; max-width: 100vw !important; height: 100vh; height: 100dvh; min-width: 100%; }

    .sz100 { width: 100%; }

    .hihi1 { position: fixed; top: 101vh; top: 101dvh; left: 0vw; height: 0.5px; color: transparent; text-align: left; }

    .hihi2 { position: fixed; top: 101vh; top: 101dvh; left: 0vw; height: 0.5px; color: transparent; text-align: right; }

    /*.fixedTimeLineC { width: auto; z-index: 200; margin-top: 2.5vh; margin-left:-14%; }*/

    .fixedTimeLine { position: fixed; top: 2.5vh; left: 0; width: auto; z-index: 200; }

    .fixedTimeLineQ { position: fixed; top: 2.5vh; left: 0; width: auto; z-index: 200; }

    .gen { font-family: Montserrat !important; }

    .timeline { width: 8.7vw; height: 3px; color: #fff; border: 1px solid #888; border-radius: 1px; float: left; margin-left: .6vw; box-sizing: border-box; background-color: #888; }

    .current { border: 0.5px solid #000; background: #fff; height: 3px; }

    .currentb { border: 0.5px solid #000; background: #fff; height: 3px; }

    .polinaAnswer:hover { background: rgba(0, 0, 0, 1); transition: .25s linear; color: #fff; }

    .polinaAnswer:active { background: rgba(0, 0, 0, 0.7) }

    queab :active { background: rgba(255, 255, 255,0.8); color: #fff }

    .polinaAnswer:not(.nohover):hover { background: rgba(255, 255, 255,0.8); color: #fff; }

    .vavavoom { height: 0; width: 0; color: transparent; font-size: 0px; }

    .slip-swiping-container { overflow-x: hidden; }

    .totallyHidden { display: none !important; }

    .content-price-title { font-size: 4.25vmin; line-height: 1.2; font-weight: 400; padding-bottom: 0; letter-spacing: 0.1vw; }

    .content-title { font-family: Montserrat; padding-bottom: 0px; margin-bottom: 0px; color: #222; font-weight: 600; text-shadow: none; }

    .content-subtitle .content-subtitle-wider { font-family: Montserrat; color: #222; font-weight: 600; text-shadow: none; }
