body {
    margin: 0;
    font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

code {
    font-family: source-code-pro, Menlo, Monaco, Consolas, Courier New, monospace
}

.swiper-container-class {
    height: 100%
}

.characterButtons {
    background-color: transparent;
    border: none;
    cursor: pointer;
    outline: none;
    background-size: cover;
    background-repeat: no-repeat
}

.returnButton {
    width: 48px;
    height: 50px;
    background-image: url(/static/media/arrow-up.271c3530.svg);
    background-position: 100%;
    margin-left: -4px;
    top: 27%;
    position: absolute
}

@media (min-width:766px) {
    .returnButton {
        width: 96px;
        height: 81px;
        margin-left: -16px
    }
}

.backButton {
    width: 72px;
    height: 50px;
    background-image: url(/static/media/scroll_left.63aa982a.svg);
    background-position: 100%;
    margin-left: -24px;
    margin-top: 25%
}

@media (min-width:766px) {
    .backButton {
        width: 96px;
        height: 81px;
        margin-left: -28px;
        margin-top: 40%
    }
}

.nextButton {
    width: 72px;
    height: 50px;
    background-image: url(/static/media/scroll_right.2e750f8c.svg);
    background-position: 0;
    margin-right: -18px;
    margin-top: 25%
}

@media (min-width:766px) {
    .nextButton {
        width: 96px;
        height: 81px;
        margin-right: -6px;
        margin-top: 40%
    }
}

.characterButtons:hover {
    -webkit-transform: scale(1.05);
    transform: scale(1.05)
}

.title {
    font-family: marvin, sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 32px;
    line-height: 40px;
    text-shadow: 4px 4px 0 #662a71
}

.text {
    font-size: 14px
}

@media (max-width:766px) {
    .title {
        font-size: 18px;
        line-height: 18px;
        text-shadow: 2px 2px 0 #662a71
    }

    .text {
        font-size: 10px
    }
}

.character-icon {
    -webkit-transition: -webkit-transform .25s ease-in-out;
    transition: -webkit-transform .25s ease-in-out;
    transition: transform .25s ease-in-out;
    transition: transform .25s ease-in-out, -webkit-transform .25s ease-in-out;
    cursor: pointer
}

.character-icon:hover {
    -webkit-transform: scale(1.05);
    transform: scale(1.05)
}

.characters {
    height: 60%;
    width: 60%
}

@media (min-width:766px) and (orientation:portrait) {
    .characters {
        height: 45%;
        width: 75%
    }
}

.container {
    background-size: cover
}

@media (max-width:766px) {
    .container {
        background-image: url(/static/media/BG_mobile.04635769.jpg)
    }
}

@media (min-width:766px) {
    .container {
        background-image: url(/static/media/BG.c98457c2.jpg)
    }
}

@media (min-width:766px) and (orientation:portrait) {
    .container {
        background-size: auto 140%
    }
}

.containerChar {
    background-size: cover;
    background-image: url(/static/media/bg_characters.3c165c3c.jpg)
}

.characterOverlayText {
    flex: 1.4 1;
    padding-right: 10px;
    padding-left: 8%
}

@media (min-width:766px) and (max-width:850px) and (max-height:450px) {
    .characterOverlayText {
        flex: 2.2 1;
        padding-left: 10%
    }
}

.scooby {
    -webkit-transition: margin-right .2s;
    transition: margin-right .2s;
    width: 45% !important
}

@media (min-width:766px) and (max-width:1366px) and (orientation:landscape) {
    .scooby {
        width: 52% !important
    }
}

.overlayImageScooby {
    width: 45%;
    display: flex;
    justify-content: center;
    pointer-events: none;
    position: absolute;
    height: 75%;
    bottom: -5%;
    right: 0
}

.pImageScooby {
    flex: 1 1;
    background-position: 50%
}

.layer-scooby,
.pImageScooby {
    background-size: contain;
    background-repeat: no-repeat
}

.layer-scooby {
    color: #fff;
    position: absolute;
    top: 0;
    display: inline;
    height: 65%;
    width: 75%
}

@media (min-width:766px) and (max-height:450px) {
    .layer-scooby {
        width: 50%;
        left: 25%
    }
}

@media (min-aspect-ratio:9/4) and (min-height:500px) {
    .layer-scooby {
        width: 50%;
        left: 22%
    }
}

.layer-image-scooby {
    width: 100%;
    position: absolute
}

@media (min-width:766px) and (orientation:portrait) {
    .layer-image-scooby {
        height: auto
    }
}

.textContainerScooby {
    margin-top: 11%;
    margin-left: 7%;
    width: 86%;
    height: 45%;
    -webkit-transform: rotate(-6deg);
    transform: rotate(-6deg);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center
}

@media (max-width:766px) {
    .textContainerScooby {
        -webkit-transform: rotate(-5.5deg);
        transform: rotate(-5.5deg)
    }
}

@media (min-width:766px) and (orientation:portrait) {
    .textContainerScooby {
        height: 40%
    }
}

.textContainerScooby>:first-child {
    font-family: marvin, sans-serif;
    font-weight: 700;
    font-size: 4.2vmin
}

.textContainerScooby>:first-child span {
    white-space: nowrap
}

@media (min-width:766px) and (orientation:portrait) {
    .textContainerScooby>:first-child {
        font-size: 5vmin
    }
}

@media (max-width:766px) {
    .textContainerScooby>:first-child {
        font-size: 4vmin
    }
}

.textContainerScooby>:last-child {
    font-size: 2.7vmin;
    line-height: 2.7vmin
}

.close-scooby {
    position: absolute;
    right: 6%;
    top: 8%;
    z-index: 1;
    cursor: pointer;
    width: 14px;
    height: 14px
}

@media (min-width:766px) and (min-height:450px) {
    .close-scooby {
        width: 20px;
        height: 20px
    }
}

@media (min-width:1921px) and (min-height:450px) {
    .close-scooby {
        width: 2.5vmin;
        height: 2.5vmin
    }
}

.close-scooby:hover {
    -webkit-transform: scale(1.08);
    transform: scale(1.08)
}

.video-slide-wrapper.hidden {
    display: none
}

.video-slide-container {
    height: 100%;
    overflow: hidden;
    display: flex;
    flex-direction: column
}

.video-slide-content {
    flex: 1 1;
    margin: 10px 32.8125px 0;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    background-color: transparent;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: 50%;
    cursor: pointer
}

.video-slide-content:hover {
    -webkit-transform: scale(1.05);
    transform: scale(1.05)
}

.video-slide-play-button {
    width: 16%;
    height: 27%;
    background-image: url(/static/media/play.a2af0faf.svg);
    background-position: 50%;
    background-color: transparent;
    background-size: contain;
    background-repeat: no-repeat;
    border: none;
    outline: none;
    cursor: pointer
}

.video-slide-play-button:hover {
    background-image: url(/static/media/play_hover.1be0492e.svg)
}

.video-slide-title {
    font-size: 10px;
    line-height: 22px;
    overflow: hidden;
    color: #fff;
    font-family: Roboto, sans-serif;
    letter-spacing: 0;
    text-decoration: none;
    cursor: pointer;
    white-space: nowrap;
    text-overflow: ellipsis
}

@media (min-width:766px) {
    .video-slide-title {
        font-size: 14px;
        bottom: 17px;
        line-height: 30px
    }
}

.header {
    width: 50vw;
    font-size: 24px;
    line-height: 20px;
    color: #fff;
    font-family: corn-dog, sans-serif;
    text-shadow: 4px 4px 0 #662a71;
    margin-left: 32.8125px
}

@media (min-width:766px) {
    .header {
        font-size: 30px;
        line-height: 28px
    }
}

.download {
    background-image: url(/static/media/icon-download.5b480a82.svg);
    width: 20px;
    height: 12px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: 50%
}

@media (min-width:766px) {
    .download {
        height: 16px
    }
}

.play {
    background-image: url(/static/media/icon-play.9ec8b025.svg);
    width: 20px;
    height: 12px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: 50%
}

@media (min-width:766px) {
    .play {
        height: 16px
    }
}

.new-title {
    margin-left: 28px;
    text-decoration: none
}

@media (min-width:766px) {
    .new-title {
        margin-left: 32px
    }
}

.carousel-button {
    background-color: transparent;
    border: none;
    cursor: pointer;
    outline: none;
    width: 72px;
    height: 50px
}

@media (min-width:766px) {
    .carousel-button {
        width: 96px;
        height: 81px
    }
}

.carousel-button:hover {
    -webkit-transform: scale(1.05);
    transform: scale(1.05)
}

.carousel-button:after {
    content: none
}

.carousel-next {
    background-position: 0;
    background-size: cover;
    background-repeat: no-repeat;
    background-image: url(/static/media/scroll_right.2e750f8c.svg);
    right: -18px
}

@media (min-width:766px) {
    .carousel-next {
        right: -6px
    }
}

.carousel-prev {
    background-position: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    background-image: url(/static/media/scroll_left.63aa982a.svg);
    left: -28px
}

@media (min-width:766px) {
    .carousel-prev {
        left: -24px
    }
}

.carousel-button-disabled {
    display: none
}

.swiper-pagination-bullet {
    background: transparent;
    margin-bottom: 4% !important;
    border: solid #fff;
    opacity: .6
}

@media (max-width:766px) {
    .swiper-pagination-bullet {
        width: 6px;
        height: 6px
    }
}

.swiper-pagination-bullet-active {
    background: #fff;
    opacity: 1
}

@media (min-width:766px) {
    .swiper-pagination-bullet {
        margin-bottom: 5% !important
    }
}

.overlay {
    position: absolute;
    z-index: 101;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: rgba(0, 0, 0, .87);
    display: flex;
    justify-content: center;
    align-items: center
}

.video-react-big-play-button {
    display: none !important
}

.video-react,
.video-react-video {
    outline: none !important
}

.product-slide-container {
    height: 100%;
    overflow: hidden;
    display: flex;
    max-width: 100vw
}

.product-slide-container>div>div>svg>g {
    cursor: pointer
}

.product-slide-content1,
.product-slide-content2,
.product-slide-content3 {
    flex: 1 1;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    background: transparent
}

.lottie1 {
    height: 65vh !important;
    margin-left: -10%;
    margin-top: 5%
}

@media (orientation:portrait) {
    .lottie1 {
        height: 40% !important
    }
}

.lottie2 {
    height: 70vh !important;
    margin-top: 10%;
    margin-left: 3%
}

@media (min-width:991px) {
    .lottie2 {
        height: 78vh !important;
        margin-left: 4%;
        margin-top: 4%
    }
}

@media (orientation:portrait) {
    .lottie2 {
        height: 87vh !important;
        margin-left: 4%;
        margin-top: 10%
    }
}

.lottie3 {
    margin-left: 15%
}

@media (orientation:portrait) {
    .lottie3 {
        height: 80vh !important
    }
}

@media (orientation:portrait) {
    .lottie3>svg {
        width: 130% !important;
        height: 90% !important;
        margin-left: -20%
    }
}

.lottie3iOs {
    margin-left: 10%;
    height: 85vh !important;
    margin-top: -15vh
}

@media (orientation:portrait) {
    .lottie3iOs {
        margin-top: 0
    }
}

@media (orientation:portrait) {
    .lottie3iOs>svg {
        width: 130% !important;
        height: 90% !important;
        margin-left: -20%
    }
}

.signContainer1 {
    left: 10%
}

@media (max-width:991px) and (orientation:landscape) {
    .signContainer1 {
        height: 60% !important;
        bottom: -19% !important
    }
}

@media (max-width:991px) and (orientation:portrait) {
    .signContainer1 {
        height: 50% !important;
        bottom: -19% !important
    }
}

.signContainer2 {
    left: 4%
}

@media (max-width:991px) and (orientation:landscape) {
    .signContainer2 {
        height: 55% !important;
        bottom: -20% !important
    }
}

@media (max-width:991px) and (orientation:portrait) {
    .signContainer2 {
        height: 48% !important;
        bottom: -17% !important
    }
}

.signContainer3 {
    left: 22%
}

@media (max-width:991px) and (orientation:landscape) {
    .signContainer3 {
        height: 55% !important;
        bottom: -23% !important
    }
}

@media (max-width:991px) and (orientation:portrait) {
    .signContainer3 {
        height: 50% !important;
        bottom: -20% !important;
        left: 10%
    }
}

.textContainer1 {
    position: absolute;
    top: 14%;
    left: 4%;
    height: 17%;
    -webkit-transform: rotate(-11deg);
    transform: rotate(-11deg);
    display: flex;
    align-items: center
}

.text1,
.textContainer1 {
    width: 90%;
    pointer-events: none
}

.text1 {
    color: #cee6e6;
    font-family: corn-dog, sans-serif;
    font-style: normal;
    font-weight: 400;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    text-align: center;
    text-shadow: 0 -2px 0 rgba(0, 0, 0, .5);
    text-transform: uppercase
}

.text1>div:first-child {
    font-size: 1.8vmin
}

.text1>div:first-child span {
    white-space: nowrap
}

@media (max-width:766px) {
    .text1>div:first-child {
        font-size: 2.2vmin
    }
}

@media (min-width:766px) and (orientation:portrait) {
    .text1>div:first-child {
        font-size: 2.4vmin
    }
}

.text1>div:last-child {
    font-size: 1.8vmin;
    font-family: corn-dog, sans-serif
}

@media (max-width:766px) {
    .text1>div:last-child {
        font-size: 2vmin
    }
}

@media (min-width:766px) and (orientation:portrait) {
    .text1>div:last-child {
        font-size: 2.2vmin
    }
}

.textContainer2 {
    position: absolute;
    width: 84%;
    top: 16%;
    left: 5%;
    height: 20%;
    -webkit-transform: rotate(-11deg);
    transform: rotate(-11deg);
    display: flex;
    align-items: center;
    pointer-events: none
}

.text2 {
    color: #cee6e6;
    font-family: corn-dog, sans-serif;
    font-style: normal;
    font-weight: 400;
    width: 90%;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    text-align: center;
    text-shadow: 0 -2px 0 rgba(0, 0, 0, .5);
    text-transform: uppercase;
    pointer-events: none
}

.text2>div:first-child {
    font-size: 2.1vmin
}

.text2>div:first-child span {
    white-space: nowrap
}

@media (min-width:766px) and (max-width:991px) {
    .text2>div:first-child {
        font-size: 2.7vmin
    }
}

@media (max-width:766px) {
    .text2>div:first-child {
        font-size: 2.3vmin
    }
}

.text2>div:last-child {
    font-size: 1.9vmin;
    font-family: corn-dog, sans-serif
}

@media (min-width:766px) and (max-width:991px) {
    .text2>div:last-child {
        font-size: 2.5vmin
    }
}

@media (max-width:766px) {
    .text2>div:last-child {
        font-size: 2.1vmin
    }
}

.textContainer3 {
    position: absolute;
    width: 87%;
    top: 13%;
    left: 5%;
    height: 19%;
    -webkit-transform: rotate(-11deg);
    transform: rotate(-11deg);
    display: flex;
    align-items: center;
    pointer-events: none
}

.text3 {
    color: #cee6e6;
    font-family: corn-dog, sans-serif;
    font-style: normal;
    font-weight: 400;
    width: 90%;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    text-align: center;
    text-shadow: 0 -2px 0 rgba(0, 0, 0, .5);
    text-transform: uppercase;
    pointer-events: none
}

.text3>div:first-child {
    font-size: 1.8vmin
}

.text3>div:first-child span {
    white-space: nowrap
}

@media (min-width:766px) and (orientation:portrait) {
    .text3>div:first-child {
        font-size: 2.5vmin
    }
}

@media (max-width:766px) {
    .text3>div:first-child {
        font-size: 2.2vmin
    }
}

.text3>div:last-child {
    font-size: 1.7vmin;
    font-family: corn-dog, sans-serif
}

@media (min-width:766px) and (orientation:portrait) {
    .text3>div:last-child {
        font-size: 2.2vmin
    }
}

@media (max-width:766px) {
    .text3>div:last-child {
        font-size: 2vmin
    }
}

.product-sign {
    cursor: pointer
}

.product-sign:hover {
    -webkit-filter: drop-shadow(0 0 .75rem #9de4e1);
    filter: drop-shadow(0 0 .75rem #9de4e1)
}

.arrow {
    height: 100%;
    width: 5%;
    -webkit-filter: drop-shadow(0 -2px 0 rgba(0, 0, 0, .501961));
    filter: drop-shadow(0 -2px 0 rgba(0, 0, 0, .501961));
    display: flex;
    justify-content: center;
    align-items: center;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg)
}

.arrow>div>svg {
    width: 1.4vmin;
    height: 1.4vmin;
    stroke: #cee6e6
}

.PNG {
    width: 80vw;
    height: 80vh;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: 50% !important;
    cursor: pointer
}

.top-main-menu {
    z-index: 99;
    position: absolute;
    background-repeat: no-repeat;
    display: flex;
    left: 0;
    background-size: 60%;
    padding: 15px 20px 0;
    align-items: center;
    top: 0;
    right: 0
}

@media (min-width:766px) and (max-width:991px) and (min-height:450px) {
    .top-main-menu {
        background-image: url(/static/media/logo_layer.e7ad3e3c.png);
        height: 30%;
        align-items: flex-start;
        padding: 0;
        top: 0;
        right: 0
    }
}

@media (min-width:766px) and (max-width:991px) and (orientation:portrait) {
    .top-main-menu {
        background-image: url(/static/media/logo_layer.e7ad3e3c.png);
        background-size: 150%;
        height: 20%;
        background-position: -100px -75px;
        right: 25px
    }
}

@media (min-width:991px) and (min-height:450px) {
    .top-main-menu {
        background-image: url(/static/media/logo_layer.e7ad3e3c.png);
        height: 20%;
        align-items: flex-start;
        padding: 0;
        right: 15px;
        top: -5px
    }
}

.top-main-menu-logo-container {
    width: 130px;
    height: 57px;
    flex-shrink: 0;
    margin-top: -5px
}

.top-main-menu-logo-container>img {
    width: 100%;
    height: auto
}

@media (max-width:766px) and (min-height:450px) {
    .top-main-menu-logo-container>img {
        margin-left: 7px
    }
}

@media (min-width:766px) and (min-height:450px) {
    .top-main-menu-logo-container {
        margin: 3% 0 0 3vw;
        width: 15vw;
        height: auto
    }
}

@media (min-width:766px) and (max-width:991px) and (orientation:portrait) {
    .top-main-menu-logo-container {
        margin: 0;
        position: absolute;
        top: 15px;
        left: 15px;
        width: 20%;
        height: auto
    }
}

.top-main-menu-button-container {
    flex: 1 1;
    display: flex;
    align-items: center;
    align-self: flex-start;
    justify-content: flex-end
}

@media (min-width:766px) and (min-height:450px) {
    .top-main-menu-button-container {
        justify-content: flex-end;
        margin-top: 3.5vh;
        padding-left: 25px;
        height: 3.5vmin;
        margin-right: 15px
    }
}

@media (min-width:766px) and (min-height:450px) and (max-width:1280px) {
    .top-main-menu-button-container {
        height: 4vmin;
        margin-right: 10px
    }
}

@media (min-width:766px) and (max-width:991px) and (orientation:portrait) {
    .top-main-menu-button-container {
        margin-right: 0
    }
}

.top-menu-button-bar-spacer {
    flex: 0 1;
    display: none
}

@media (min-width:766px) and (max-width:991px) and (orientation:portrait) {
    .top-menu-button-bar-spacer {
        flex: 1 1;
        display: block
    }
}

.top-main-menu-button {
    cursor: pointer;
    position: relative
}

.top-main-menu-button>img {
    width: auto;
    height: 100%;
    max-height: calc(100% + 9px)
}

@media (min-width:766px) and (min-height:450px) {
    .top-main-menu-button {
        height: 32px !important;
        display: block;
        margin-top: 4px
    }
}

.top-main-menu-button-interim-new-languages img {
    height: calc(100% + 9px);
    margin-top: -4.5px
}

@media (min-width:766px) and (min-height:450px) {
    .top-main-menu-button-interim-new-languages:not(:first-child) {
        margin-left: 10px !important
    }
}

.top-main-menu-button-interim-new-languages.top-main-menu-products-en-es-fr {
    margin-bottom: -2px
}

.top-main-menu-button-interim-new-languages.top-main-menu-products-en-es-fr img {
    height: calc(100% + 11px);
    max-height: calc(100% + 11px)
}

.top-main-menu-button:hover {
    -webkit-transform: scale(1.05);
    transform: scale(1.05)
}

.top-main-menu-products {
    height: 22px
}

@media (max-width:650px) {
    .top-main-menu-products {
        height: 18px
    }
}

@media (max-width:650px) and (max-width:610px) {
    .top-main-menu-products {
        height: 15px
    }
}

@media (min-width:766px) and (min-height:450px) {
    .top-main-menu-products {
        height: 100%
    }
}

.top-main-menu-characters {
    height: 22px
}

@media (max-width:650px) {
    .top-main-menu-characters {
        height: 20px
    }
}

@media (max-width:650px) and (max-width:610px) {
    .top-main-menu-characters {
        height: 17px
    }
}

@media (min-width:766px) and (min-height:450px) {
    .top-main-menu-characters {
        height: 100%
    }
}

.top-main-menu-characters-fr {
    height: 26px;
    margin-bottom: -5px
}

@media (max-width:650px) {
    .top-main-menu-characters-fr {
        height: 24px
    }
}

@media (max-width:650px) and (max-width:610px) {
    .top-main-menu-characters-fr {
        height: 21px
    }
}

@media (min-width:766px) and (min-height:450px) {
    .top-main-menu-characters-fr img {
        height: 113%;
        margin-top: -.7%
    }
}

@media (min-width:766px) and (min-height:450px) and (orientation:portrait) {
    .top-main-menu-characters-fr img {
        height: 113%;
        margin-top: -.5%
    }
}

.top-main-menu-characters-es {
    height: 24px;
    margin-bottom: -2px
}

@media (max-width:650px) {
    .top-main-menu-characters-es {
        height: 22px
    }
}

@media (max-width:650px) and (max-width:610px) {
    .top-main-menu-characters-es {
        height: 19px
    }
}

@media (min-width:766px) and (min-height:450px) {
    .top-main-menu-characters-es img {
        height: 110%;
        margin-top: -.8%
    }
}

@media (min-width:766px) and (min-height:450px) and (orientation:portrait) {
    .top-main-menu-characters-es img {
        height: 110%;
        margin-top: -.5%
    }
}

.top-main-menu-videos {
    height: 22px
}

@media (max-width:650px) {
    .top-main-menu-videos {
        height: 20px
    }
}

@media (max-width:650px) and (max-width:610px) {
    .top-main-menu-videos {
        height: 17px
    }
}

@media (min-width:766px) and (min-height:450px) {
    .top-main-menu-videos {
        height: 100%
    }
}

.top-main-menu-videos-pl {
    height: 24px;
    margin-bottom: -3px
}

@media (max-width:650px) {
    .top-main-menu-videos-pl {
        height: 22px
    }
}

@media (max-width:650px) and (max-width:610px) {
    .top-main-menu-videos-pl {
        height: 19px;
        margin-bottom: -1px
    }
}

@media (min-width:766px) and (min-height:450px) {
    .top-main-menu-videos-pl img {
        height: 105%;
        margin-top: -.8%
    }
}

@media (min-width:766px) and (min-height:450px) and (orientation:portrait) {
    .top-main-menu-videos-pl img {
        height: 105%;
        margin-top: -.5%
    }
}

.top-main-menu-sound {
    height: 25px;
    width: 25px;
    margin-top: -4px
}

@media (min-width:766px) and (min-height:450px) {
    .top-main-menu-sound {
        height: 100%
    }
}

.top-main-menu-share {
    height: 25px
}

@media (min-width:766px) and (min-height:450px) {
    .top-main-menu-share {
        height: 75%
    }
}

.menu {
    color: #fff;
    font-size: 18px;
    margin-right: 10px;
    font-family: corn-dog, sans-serif;
    cursor: pointer;
    text-shadow: 2px 2px 0 #662a71
}

@media (min-width:766px) and (min-height:450px) {
    .menu {
        margin-right: 16px;
        font-size: 30px;
        text-shadow: 4px 4px 0 #662a71
    }
}

@media (min-width:766px) and (min-height:450px) and (orientation:portrait) {
    .menu {
        font-size: 24px;
        margin-right: 16px
    }
}

.menu:hover {
    -webkit-transform: scale(1.05);
    transform: scale(1.05)
}

#sound-button {
    margin-top: 1px
}

#sound-button:hover {
    -webkit-transform: scale(1.05);
    transform: scale(1.05)
}

.underline {
    background-image: url(/static/media/underline.cf20981a.svg);
    height: 3px;
    box-shadow: 1px 2px 0 0 #662a71;
    background-size: cover;
    width: 100%;
    margin-top: 3px
}

@media (min-width:766px) {
    .underline {
        margin-top: 5px
    }
}

.product-overlay {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 102;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden
}

.product-popup {
    position: relative;
    background: url(/static/media/language-layer.7d922572.svg) no-repeat;
    background-size: cover;
    -webkit-transition: margin-top .2s;
    transition: margin-top .2s;
    width: 60%;
    height: 80%;
    max-height: 80%;
    max-width: 900px;
    padding: 2% 2% 3% 4%;
    color: #fff;
    font-family: Marvin, sans-serif;
    text-align: center
}

@media (max-height:350px) {
    .product-popup {
        width: 70%
    }
}

@media (min-width:766px) and (orientation:portrait) {
    .product-popup {
        width: 85%;
        height: inherit;
        margin-left: -3%;
        font-size: 3.2vmin;
        line-height: 4.2vmin
    }
}

@media (min-width:991px) and (min-height:450px) {
    .product-popup {
        width: 60%;
        height: inherit;
        margin-top: 0;
        max-height: 650px
    }
}

.product-close-bar {
    display: flex;
    justify-content: space-between;
    align-items: baseline
}

@media (min-width:766px) and (orientation:portrait) {
    .product-close-bar {
        padding-left: 1%
    }
}

.product-close {
    cursor: pointer;
    width: 16px;
    height: 16px
}

@media (min-width:766px) and (min-height:450px) {
    .product-close {
        width: 30px;
        height: 30px
    }
}

.product-close:hover {
    -webkit-transform: scale(1.08);
    transform: scale(1.08)
}

.product-item-container {
    display: flex;
    justify-content: space-between;
    padding: 10px 19% 0
}

.overlayTitle {
    text-align: left;
    font-size: 18px;
    line-height: 18px;
    color: #fff;
    font-family: marvin, sans-serif;
    max-width: 90%
}

@media (min-width:766px) and (min-height:450px) {
    .overlayTitle {
        font-size: 32pt;
        line-height: 34pt
    }
}

.overlayNumber {
    font-size: 14px;
    margin-bottom: 5%;
    font-family: marvin, sans-serif
}

@media (min-width:766px) and (min-height:450px) {
    .overlayNumber {
        font-size: 22pt;
        line-height: 22pt;
        margin-bottom: 25px;
        margin-top: 5px
    }
}

.overlayDesc {
    font-size: 3.2vmin;
    line-height: 4.2vmin;
    color: #fff;
    font-family: Roboto Regular, sans-serif;
    font-weight: 400;
    min-height: 200px
}

@media (min-width:766px) and (min-height:450px) {
    .overlayDesc {
        font-size: 3vmin;
        line-height: 4.1vmin
    }
}

@media (min-width:766px) and (orientation:portrait) {
    .overlayDesc {
        font-size: 3.2vmin;
        line-height: 4.2vmin;
        min-height: 250px
    }
}

@media (min-width:991px) {
    .overlayDesc {
        min-height: 300px
    }
}

@media (min-width:991px) and (orientation:landscape) and (min-height:900px) {
    .overlayDesc {
        font-size: 26px;
        line-height: 35px
    }
}

@media (min-width:991px) and (orientation:landscape) and (min-height:1000px) {
    .overlayDesc {
        font-size: 28px;
        line-height: 35px
    }
}

@media (min-width:991px) and (orientation:portrait) and (min-width:1000px) {
    .overlayDesc {
        font-size: 25px;
        line-height: 30px
    }
}

.overlayImage {
    flex: 1 1;
    display: flex;
    justify-content: center;
    pointer-events: none
}

.overlayText {
    flex: 1 1
}

@media (min-width:766px) and (orientation:portrait) {
    .overlayText {
        padding-left: 2%;
        padding-bottom: 2%
    }
}

.overlaySub {
    margin-top: 5px;
    font-size: 10px;
    line-height: 15px;
    color: #fff;
    font-family: Roboto, sans-serif;
    font-weight: 400;
    text-align: left
}

@media (min-width:766px) {
    .overlaySub {
        margin-top: 10px;
        font-size: 2.6vmin;
        line-height: 2.6vmin
    }
}

@media (min-width:991px) and (orientation:landscape) and (min-height:900px) {
    .overlaySub {
        font-size: 22px
    }
}

@media (min-width:991px) and (orientation:portrait) and (min-width:1000px) {
    .overlaySub {
        font-size: 18px
    }
}

span {
    white-space: nowrap
}

@media only screen and (min-device-width:414px) and (max-device-height:736px) and (orientation:landscape) and (-webkit-device-pixel-ratio:3) {
    .product-close {
        width: 16px;
        height: 16px
    }

    .overlayTitle {
        font-size: 18px;
        line-height: 18px
    }

    .overlayNumber {
        font-size: 14px;
        line-height: 14px;
        margin-bottom: 5%
    }
}

@media only screen and (min-device-width:414px) and (max-device-height:896px) and (orientation:landscape) and (-webkit-device-pixel-ratio:2) {
    .product-close {
        width: 16px;
        height: 16px
    }

    .overlayTitle {
        font-size: 18px;
        line-height: 18px
    }

    .overlayNumber {
        font-size: 14px;
        line-height: 14px;
        margin-bottom: 5%
    }
}

@media only screen and (min-device-width:375px) and (max-device-height:812px) and (orientation:landscape) and (-webkit-device-pixel-ratio:3) {
    .product-close {
        width: 16px;
        height: 16px
    }

    .overlayTitle {
        font-size: 18px;
        line-height: 18px
    }

    .overlayNumber {
        font-size: 14px;
        line-height: 14px;
        margin-bottom: 5%
    }
}

@media only screen and (min-device-width:414px) and (max-device-height:896px) and (orientation:landscape) and (-webkit-device-pixel-ratio:3) {
    .product-close {
        width: 16px;
        height: 16px
    }

    .overlayTitle {
        font-size: 18px;
        line-height: 18px
    }

    .overlayNumber {
        font-size: 14px;
        line-height: 14px;
        margin-bottom: 5%
    }
}

.test {
    display: flex !important
}

.pImage {
    flex: 1 1;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: 50%
}

.character-portrait {
    -webkit-transition: -webkit-transform .25s ease-in-out;
    transition: -webkit-transform .25s ease-in-out;
    transition: transform .25s ease-in-out;
    transition: transform .25s ease-in-out, -webkit-transform .25s ease-in-out;
    cursor: pointer
}

.character-portrait:hover {
    -webkit-transform: scale(1.05);
    transform: scale(1.05)
}

.footer-container {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 100
}

.footer-grass {
    width: 100%;
    height: 70px;
    margin-bottom: -5px
}

.mobile-footer {
    background: rgba(0, 0, 0, .9)
}

.footer-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 4.3vw 27px
}

.footer-header-mobile {
    display: none;
    padding: 5px 4.3vw
}

.footer-header .legal-and-privacy {
    font: Condensed 700 18px/24px Roboto;
    color: #fff;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: pointer;
    display: flex;
    align-items: baseline
}

@media (max-width:991px) {
    .footer-header .legal-and-privacy {
        font-size: 12px
    }
}

.footer-header .legal-and-privacy>div:last-child {
    height: 11px;
    width: 16px;
    margin-left: 11px
}

.footer-header .playmobil-logo {
    width: 163px;
    height: 37px;
    background: transparent url(data:image/png;base64,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) 0 0 no-repeat padding-box;
    background-size: contain
}

@media (max-width:991px) {
    .footer-header .playmobil-logo {
        width: 90px;
        height: 20px
    }
}

.footer-content {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    padding: 8px calc(4.3vw - 10px) 30px;
    font: 700 18px/24px Roboto;
    letter-spacing: 0;
    color: #fff;
    overflow: hidden
}

@media (max-width:991px) {
    .footer-content {
        padding: 8px calc(4.3vw - 10px) 5px
    }
}

.ReactCollapse--collapse {
    -webkit-transition: height .3s;
    transition: height .3s
}

.footer-content .wb-container {
    display: flex;
    align-items: center;
    flex: 1 1 635px;
    font: 16px/20px Roboto;
    letter-spacing: 0;
    color: #9d9d9d;
    padding: 5px 10px
}

.footer-content .wb-logo {
    min-width: 37px;
    min-height: 40px;
    width: 37px;
    height: 40px;
    margin-right: 16px
}

.footer-content .wb-container>div:last-child {
    max-width: 582px
}

@media (max-width:991px) {
    .footer-content .wb-container>div:last-child {
        font-size: 13px
    }
}

@media only screen and (max-device-width:667px) and (-webkit-min-device-pixel-ratio:2) and (orientation:landscape) {
    .footer-content .wb-container>div:last-child {
        font-size: 13px
    }
}

.footer-content .wb-container>div:last-child>span {
    white-space: nowrap
}

.footer-social-and-links-container {
    flex: 1 1 1235px;
    flex-wrap: wrap;
    display: flex;
    justify-content: flex-end
}

.footer-content .social-media-container {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 5px 10px
}

.footer-content .imprint-language-container {
    display: flex;
    flex-wrap: wrap;
    flex: 1 1 815px;
    justify-content: flex-end;
    padding: 5px 10px
}

@media (max-width:991px) {
    .footer-content .imprint-language-container {
        font-size: 13px
    }
}

.footer-content .imprint-language-container>div {
    min-height: 50%;
    display: flex;
    align-items: center
}

.footer-content .imprint-language-container>div:not(:first-of-type) {
    margin-left: 16px
}

.footer-content .imprint-language-container .content-text {
    white-space: nowrap;
    color: #fff;
    text-decoration: none
}

.footer-content .newsletter-button {
    margin-right: 22px;
    text-decoration: none
}

.newsletter-button>div>div {
    height: 100%
}

.footer-content .newsletter-button>div:hover {
    background-image: url(/static/media/newsletter_hover.0409a8b7.svg)
}

.footer-content .newsletter-button>div:hover>* {
    display: none
}

.footer-content .newsletter-button>div {
    min-width: 157px;
    min-height: 40px;
    width: 157px;
    height: 40px
}

.footer-content .newsletter-button>div svg {
    width: 100%;
    height: 100%
}

.footer-content .social-media-button {
    min-width: 47px;
    min-height: 47px;
    width: 47px;
    height: 47px;
    cursor: pointer
}

@media (max-width:991px) {
    .footer-content .social-media-button {
        min-width: 40px;
        min-height: 40px;
        width: 40px;
        height: 40px
    }
}

.footer-content .social-media-button>div {
    height: 100%;
    background-position: 50%;
    background-color: transparent;
    background-repeat: no-repeat
}

.footer-content .social-media-button:not(:last-of-type) {
    margin-right: 16px
}

.footer-content .facebook-button {
    background-image: url(/static/media/fb.4cbc441a.svg);
    background-size: 52px
}

@media (max-width:991px) {
    .footer-content .facebook-button {
        background-size: 44px
    }
}

.footer-content .facebook-button:hover {
    background-image: url(/static/media/fb-hover.fb8d5482.svg)
}

.footer-content .twitter-button {
    background-image: url(/static/media/tw.dce5ecf9.svg);
    background-size: 52px
}

@media (max-width:991px) {
    .footer-content .twitter-button {
        background-size: 44px
    }
}

.footer-content .twitter-button:hover {
    background-image: url(/static/media/tw_hover.c1c5a349.svg)
}

.footer-content .instagram-button {
    background-image: url(/static/media/ig.0388f801.svg);
    background-size: 52px
}

@media (max-width:991px) {
    .footer-content .instagram-button {
        background-size: 44px
    }
}

.footer-content .instagram-button:hover {
    background-image: url(/static/media/ig_hover.8882e028.svg)
}

.footer-content .youtube-button {
    background-image: url(/static/media/yt.f23bffa8.svg);
    background-size: 47px
}

@media (max-width:991px) {
    .footer-content .youtube-button {
        background-size: 40px
    }
}

.footer-content .youtube-button:hover {
    background-image: url(/static/media/yt_hover.c612ab57.svg)
}

.footer-content .language-button {
    align-self: center;
    min-width: 40px;
    min-height: 40px;
    width: 40px;
    height: 40px;
    background-image: url(/static/media/lang-en.f74eab8a.svg);
    background-position: 50%;
    background-color: transparent;
    background-size: contain;
    border: none;
    cursor: pointer;
    outline: none;
    background-repeat: no-repeat
}

@media (max-width:991px) {
    .footer-content .language-button {
        min-width: 40px;
        min-height: 40px;
        width: 40px;
        height: 40px
    }
}

.footer-language-spacer {
    width: 16px
}

@media (min-width:766px) {
    .footer-language-spacer {
        flex: 1 1;
        max-width: 51px;
        min-width: 16px
    }
}

.rotate-device-notice {
    background-color: #401b47;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 999999999
}

.rotate-device-notice-container {
    width: 51%;
    display: flex;
    flex-direction: column;
    align-items: center
}

.rotate-device-notice-container>img:first-child {
    position: absolute;
    width: 175px;
    height: auto;
    left: auto;
    right: auto;
    top: 34px
}

.rotate-device-notice-container>img:last-child {
    position: absolute;
    width: 135px;
    height: 31px;
    left: auto;
    right: auto;
    bottom: 20px
}

.rotate-device-notice-message {
    font-size: 26px;
    line-height: 28px;
    color: #fff;
    font-family: marvin, sans-serif;
    text-align: center;
    -webkit-filter: drop-shadow(0 3px 0 #a466b0);
    filter: drop-shadow(0 3px 0 #a466b0)
}

.rotate-device-icon {
    max-width: 100%;
    height: auto
}

.language-selection-overlay {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 101;
    display: flex;
    justify-content: center;
    align-items: center
}

.language-selection-popup {
    position: relative;
    background: url(/static/media/language-layer.7d922572.svg) no-repeat;
    background-size: cover;
    width: 560px;
    max-height: 98%;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    padding: 0 0 0 10px;
    font-size: 16px;
    line-height: 25px;
    color: #fff;
    font-family: Marvin, sans-serif;
    text-align: center
}

@media (min-width:766px) {
    .language-selection-popup {
        width: 800px;
        height: -webkit-fit-content;
        height: -moz-fit-content;
        height: fit-content;
        font-size: 23px;
        line-height: 36px
    }
}

.language-selection-close-bar {
    display: flex;
    justify-content: flex-end;
    padding-top: 15px;
    padding-right: 15px
}

@media (min-width:766px) {
    .language-selection-close-bar {
        padding-top: 20px;
        padding-right: 20px
    }
}

.language-selection-close {
    cursor: pointer;
    width: 12px;
    height: 12px
}

@media (min-width:766px) {
    .language-selection-close {
        width: 18px;
        height: 16px
    }
}

.language-selection-close:hover {
    -webkit-transform: scale(1.08);
    transform: scale(1.08)
}

.language-selection-item-container {
    display: flex;
    justify-content: space-between;
    padding: 10px 5% 20px
}

.language-item>div {
    margin-top: 5px;
    line-height: 16px
}

.language-item {
    flex: 1 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    font-size: 12px;
    line-height: 25px;
    color: #fff;
    font-family: Roboto, sans-serif;
    font-weight: 700;
    text-align: center
}

@media (min-width:766px) {
    .language-item {
        font-size: 16px;
        line-height: 36px
    }
}

.language-item>img {
    cursor: pointer;
    width: 44px;
    height: 44px
}

@media (min-width:766px) {
    .language-item>img {
        width: 60px;
        height: 60px
    }
}