.carousel__big21 {
    background: url(/media/swisslos/buehnenteaser/big21_slider/img/de/big21_background.jpg);
    overflow: hidden;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}
.carousel_item_button_big21 {
    position: absolute;
    transform: translate(-50%);
    left: 50%;
    color: #fff;
    background: #00D9D9;
    border: 3px solid #00D9D9;
    padding: 20px 60px;
    font-size: 1.5rem;
    font-weight: bold;
    border-radius: 5px;
    bottom: 40px;
    cursor: pointer;
    letter-spacing: 0.025rem;
    line-height: 1;
}
.carousel_item_button_big21:hover {
    background: #01a0a0;
    color: #fff;
    border: 3px solid #01a0a0;
}
.carousel_big21_text_image_container {
    position: absolute;
    top: 2rem;
    left: 16rem;
}
.carousel__big21.slick-active {
    .carousel_big21_text_image_container {
        animation: logo_animation 1s;
    }
}
.big21_logo_text_background_EN_DE {
    background: url(/media/swisslos/buehnenteaser/big21_slider/img/de/NEU_Balken_DE.svg);
    width: 85px;
    height: 50px;
    background-repeat: no-repeat;
    display: flex;
    justify-content: center;
    align-items: center;
}
.big21_logo_text_DE {
    background: url(/media/swisslos/buehnenteaser/big21_slider/img/de/NEU_Schrift_DE.svg);
    width: 70%;
    height: 70%;
    background-repeat: no-repeat;
}
.big21_logo_text_EN {
    background: url(/media/swisslos/buehnenteaser/big21_slider/img/en/NEU_Schrift_EN.svg);
    width: 70%;
    height: 70%;
    background-repeat: no-repeat;
}
.big21_logo_text_background_FR {
    background: url(/media/swisslos/buehnenteaser/big21_slider/img/fr/NEU_Balken_FR.svg);
    width: 130px;
    height: 90px;
    background-repeat: no-repeat;
    display: flex;
    justify-content: center;
    align-items: center;
}
.big21_logo_text_FR {
    background: url(/media/swisslos/buehnenteaser/big21_slider/img/fr/NEU_Schrift_FR.svg);
    width: 80%;
    height: 80%;
    background-repeat: no-repeat;
}
.big21_logo_text_background_IT {
    background: url(/media/swisslos/buehnenteaser/big21_slider/img/it/NEU_Balken_IT.svg);
    width: 130px;
    height: 60px;
    background-repeat: no-repeat;
    display: flex;
    justify-content: center;
    align-items: center;
}
.big21_logo_text_IT {
    background: url(/media/swisslos/buehnenteaser/big21_slider/img/it/NEU_Schrift_IT.svg);
    width: 75%;
    height: 75%;
    background-repeat: no-repeat;
}
.big21_logo_text_wrapper {
    position: absolute;
    margin-top: -0.5rem;
    width: 0rem;
    overflow: hidden;
}
.carousel__big21.slick-active {
    .big21_logo_text_wrapper {
        animation: logo_text_animation 1.3s ease;
        animation-fill-mode: forwards;
    }
}
.carousel_item_big21_logo {
    width: 20rem;
}
.big21_logo_headline {
    position: absolute;
    margin-top: 1.5rem;
    width: 100%;
    height: 100%;
    visibility: hidden;
    transform: scale(0.9);
}
.big21_logo_headline_fr_en {
    position: absolute;
    margin-top: 1.5rem;
    width: 100%;
    height: 100%;
    visibility: hidden;
    transform: scale(1.3);
    padding-right: 5px;
}
.carousel__big21.slick-active {
    .big21_logo_headline {
        animation: logo_headline_animation 0.3s;
        animation-fill-mode: forwards;
        animation-delay: 1s;
    }
    .big21_logo_headline_fr_en {
        animation: logo_headline_animation 0.3s;
        animation-fill-mode: forwards;
        animation-delay: 1s;
    }
}
.carousel_7_card {
    position: absolute;
    left: 0;
    bottom: 20rem;
    transform:
    perspective(900px)
    rotateY(28deg)
    rotateX(30deg);
}
.carousel_7_card img {
    position: absolute;
    top: 0;
    left: 0;
    width: 13rem;
}
.carousel_7_card > .card_value {
    width: 10.5rem !important;
    margin-top: 1.5rem;
    margin-left: 1.5rem;
}
.carousel_big21_gold_circle {
    position: absolute;
    top: 2rem;
    left: 38rem;
    height: 170px;
    width: 170px;
    border-radius: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1;
    transform: scale(0);
}
.carousel_big21_gold_circle_DE {
    background: url(/media/swisslos/buehnenteaser/big21_slider/img/de/big21_stoerer_DE.png);
}
.carousel_big21_gold_circle_EN {
    background: url(/media/swisslos/buehnenteaser/big21_slider/img/en/big21_stoerer_EN.png);
}
.carousel_big21_gold_circle_IT {
    background: url(/media/swisslos/buehnenteaser/big21_slider/img/it/big21_stoerer_IT.png);
}
.carousel_big21_gold_circle_FR {
    background: url(/media/swisslos/buehnenteaser/big21_slider/img/fr/big21_stoerer_FR.png);
}

.carousel__big21.slick-active {
    .carousel_big21_gold_circle {
        animation: gold_circle_animation 0.5s;
        animation-fill-mode: forwards;
        animation-delay: 2s;
    }
}

.carousel_ace_card {
    position: absolute;
    z-index: -1;
    left: 46rem;
    top: 4rem;
    transform:
    perspective(1000px)
    rotateY(-33deg)
    rotateX(30deg);
}
.carousel_ace_card img {
    position: absolute;
    top: 0;
    left: 0;
    width: 14rem;
}
.carousel_ace_card > .card_value {
    width: 11.2rem !important;
    margin-top: 1.5rem;
    margin-left: 1.5rem;
}
.carousel_king_card {
    position: absolute;
    z-index: -2;
    left: 60rem;
    top: 14.5rem;
    transform:
    perspective(1000px)
    rotateY(-35deg)
    rotateX(54deg);
}
.carousel_king_card img {
    position: absolute;
    top: 0;
    left: 0;
    width: 14rem;
}
.carousel_king_card > .card_value {
    width: 11.2rem !important;
    margin-top: 1.5rem;
    margin-left: 1.5rem;
}
.big21_confetti_background {
    position: absolute;
    top: -3rem;
    z-index: -3;
}
.carousel__big21.slick-active {
    .big21_confetti_background {
        animation: confetti_animation 30s ease;
    }
}
.card_gif {
    position: absolute;
    bottom: 0;
    width: 100%;
}

@keyframes confetti_animation{
    0% { 
        top: -14rem;
     }
    100% { 
        top: -3rem;
     }
}

@keyframes logo_animation{
    0% { 
        transform: scale(1.2);
     }
    100% { 
        transform: scale(1);
     }
}

@keyframes logo_text_animation{
    0% { 
        width: 0;
     }
    100% { 
        width: 100%;
     }
}
@keyframes logo_headline_animation{
    0% { 
        visibility: hidden;
        margin-top: 2rem;
     }
    100% { 
        visibility: visible;
        margin-top: 1.5rem;
     }
}
@keyframes gold_circle_animation{
    0% { 
        transform: scale(0);
     }
     85% { 
        transform: scale(1.05);
     }
    100% { 
        transform: scale(1);
     }
}
@keyframes gold_circle_text_animation{
    0% { 
        visibility: hidden;
        margin-top: 2rem;
     }
    100% { 
        visibility: visible;
        margin-top: 0;
     }
}

.big21_shine {
    width: 5.5rem;
    height: 5.5rem;
}
.big21_shine_1 {
    position: absolute;
    right: -2rem;
    top: -2.4rem;
    opacity: 0;
}
.carousel__big21.slick-active {
    .big21_shine_1 {
        animation: shine_animation 1.5s ease;
        animation-delay: 0.25s;
    }
}
.big21_shine_2 {
    position: absolute;
    right: 6.6rem;
    top: -1.5rem;
    opacity: 0;
}
.carousel__big21.slick-active {
    .big21_shine_2 {
        animation: shine_animation 1.5s ease;
        animation-delay: 1s;
    }
}
.big21_shine_3 {
    position: absolute;
    left: -2.8rem;
    top: -3.3rem;
    opacity: 0;
}
.carousel__big21.slick-active {
    .big21_shine_3 {
        animation: shine_animation 1.5s ease;
        animation-delay: 1.5s;
    }
}
.big21_shine_4 {
    position: absolute;
    left: 2.4rem;
    top: -1rem;
    opacity: 0;
}
.carousel__big21.slick-active {
    .big21_shine_4 {
        animation: shine_animation 1.5s ease;
        animation-delay: 1.5s;
    }
}
.big21_shine_5 {
    position: absolute;
    right: 0.8rem;
    top: 2.2rem;
    opacity: 0;
}
.carousel__big21.slick-active {
    .big21_shine_5 {
        animation: shine_animation 1.5s ease;
        animation-delay: 1.5s;
    }
}

@keyframes shine_animation {
    0% { 
        opacity: 0;
     }
    50% { 
        opacity: 1;
     }
    100% { 
        opacity: 0;
        transform: rotate(130deg);
     }
}

@media only screen and (max-width: 1024px) {
    .carousel_big21_gold_circle {
        top: 0rem;
        left: 33rem;
    }
    .big21_confetti_background {
        position: absolute;
        top: -7rem;
        scale: 1.5;
    }
    @keyframes confetti_animation{
        0% { 
            top: -8rem;
         }
        100% { 
            top: -4rem;
         }
    }
    .carousel_big21_text_image_container {
        top: 0rem;
        left: 10rem;
    }
    .card_gif {
        position: absolute;
        bottom: 0;
        left: -12rem;
        width: 150%;
    }
}
@media only screen and (max-width: 935px) {
    .big21_confetti_background {
        position: absolute;
        top: -7rem;
        scale: 1.5;
    }
    @keyframes confetti_animation{
        0% { 
            top: -8rem;
         }
        100% { 
            top: -2.5rem;
         }
    }
    .carousel_big21_text_image_container {
        top: 3rem;
        left: 6rem;
        transform: scale(0.8);
    }
    @keyframes logo_animation{
        0% { 
            transform: scale(1);
         }
        100% { 
            transform: scale(0.8);
         }
    }
    .carousel_item_button_big21 {
        font-size: 1.2rem;
        padding: 12px 25px;
    }
    .card_gif {
        position: absolute;
        bottom: 0;
        left: -12.5rem;
        width: 170%;
    }
    .carousel_big21_gold_circle {
        top: 3rm;
        left: 25.5rem;
        transform: scale(0);
    }
    @keyframes gold_circle_animation{
        0% { 
            transform: scale(0);
         }
         85% { 
            transform: scale(1.1);
         }
        100% { 
            transform: scale(0.9);
         }
    }
    .big21_logo_headline_fr_en {
        transform: scale(1.2);
        padding-right: 8px;
    }
}

@media only screen and (max-width: 800px) {
    .carousel_big21_gold_circle {
        left: 18.5rem;
        transform: scale(0);
    }
    @keyframes gold_circle_animation{
        0% { 
            transform: scale(0);
         }
         85% { 
            transform: scale(1);
         }
        100% { 
            transform: scale(0.8);
         }
    }
    .carousel_big21_text_image_container {
        top: -2rem;
        left: 0rem;
        transform: scale(0.8);
    }
}

@media only screen and (max-width: 490px) {
    .carousel_big21_gold_circle {
       top: -3rem;
       left: 18.5rem;
   }
   .card_gif {
    position: absolute;
    bottom: 0;
    left: -9.5rem;
    width: 200%;
}
}

@media only screen and (max-width: 450px) {
         .carousel_big21_gold_circle {
            top: -3rem;
            left: 19.5rem;
            height: 108px;
            width: 108px;
        }
}