
@font-face {
    font-family: "StashBold";
    src:url(/fonts/StashBold.otf) format("opentype");

}




.milka-logo {
    position: absolute;
    left: 40px;
    top: 40px;
}

.is-share-socials-button.button.is-icon {
    display: none;
}

/* provisorisches css */
body {
    margin: 0;
    padding: 0;
}
body, ul, a {
    color: #fff;
}

div.content {
    margin-top: 0px; /*40px; */
    margin-left: 0;
    margin-right: 0;
    width: 1440px;
    overflow:hidden;
    /*border: 1px solid #ffa500;*/
    position: relative;
    top: 0;
    left: 0;
    transform-origin: top;
}
div.content > video {
    transform-origin: top;
}

.is-mobile div.content {
    width: 375px; /* 767 */
    margin-left: auto;
    margin-right: auto;
}


.content h1,
.content h2{

    /*font-family: 'GoboldBold';
    font-style: normal;
    font-weight: 400;*/
    font-size: 55px; /* statt 35 */
    line-height: 1.2;
    text-align: center;
    text-transform: uppercase;

    color: #FFFFFF;
}
.content h1,
.content h2{

    /*font-family: 'GoodHeadlinePro';*/
    font-family: "Gobold Lowplus";
    font-style: normal;
    font-weight: 700;
}



.content h2 span.headline-blau {

    /* Alpine Blue */
    color: #8BD1F0;
    text-transform: none;

    font-family: 'StashBold';
    font-style: italic;
    font-weight: 400;
    font-size: 50px;
}

.content h3 {

    /*font-family: 'GoboldBold';
    font-style: normal;
    font-weight: 700;*/
    font-size: 30px;
    line-height: 1.5;
    text-align: center;
    text-transform: uppercase;

    color: #FFFFFF;
    /*text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25), 0px 4px 4px rgba(0, 0, 0, 0.25), 0px 4px 4px rgba(0, 0, 0, 0.25);*/
}
.content h3 {

    /*font-family: 'GoodHeadlinePro';*/
    font-family: "Gobold Lowplus";
    font-style: normal;
    font-weight: 700;
}

.content h4 {

    /*font-family: 'GoboldBold';
    font-style: normal;
    font-weight: 400;*/
    font-size: 30px;
    line-height: 1.5;
    text-align: center;
    text-transform: uppercase;

    color: #FFFFFF;
}
.content h4 {

    /*font-family: 'GoodHeadlinePro';*/
    font-family: "Gobold Lowplus";
    font-style: normal;
    font-weight: 700;
}

.content p {

    font-family: 'GoodHeadlinePro';
    font-style: normal;
    font-weight: 400;
    font-size: 24px;
    line-height: 1.5;
    text-align: center;

    color: #FFFFFF;
}
.content p.intro {

    /*font-size: 24px;*/

}

.is-mobile .content h1,
.is-mobile .content h2,
.is-mobile .content h3,
.is-mobile .content h4,
.is-mobile .content p {
    margin-left: 10px;
    margin-right: 10px;
}


.is-mobile .content h1,
.is-mobile .content h2{

    font-size: 35px;

}

.is-mobile .content h2 span.headline-blau {
    font-size: 35px;
}

.is-mobile .content h3 {
    font-size: 25px;
}

.is-mobile .content h4 {
    font-size: 25px;
}

.is-mobile .content p {
    font-size: 16px;
}





@media only screen and (max-width: 767px){

   /* div.content {
        width: 375px;
        margin-left: auto;
        margin-right: auto;
    }*/

}



/* top text */
.top-text {
    padding-top: 50px;
    padding-bottom: 30px;
}
.top-text h1 {
    margin-bottom: 10px;
}

.top-text p,
p.centered-copy {
    max-width: 920px;
    margin-left: auto;
    margin-right: auto;
}




.section-video {
    position: relative;
    padding-top: 40px;
    /* dark lila */
    background: #3B2774;
}

body.slick .section-video {
    margin-top: -150px;
    padding-bottom: 180px;
}

.flavour-video-stream {
    position: relative;
    display: flex;
    justify-content: center;
    max-width: 100% !important; /* was 300px => why? */
}

.flavour-video-stream video {
    cursor: pointer;
    border-radius: 2em;
    object-fit: cover;
}

.over-video-button {
    cursor: pointer;
    position: absolute;
    top: 0;
    width: 480px;
    background-color: #000;
    opacity: 0.3;
    height: 300px;
}


/* video info */
.video-info {
    position: relative;
    width: 480px;
}
.video-info-content {
    position: relative;
    width: 480px;
    padding-top: 85px;
    background-image: url("/img/neben-video/pfeil-rechts-oben.png");
    background-position: center 20px;
    background-repeat: no-repeat;
}

.video-info-content img {
    display: block;
    position: relative;
}

.video-info h3 {
    margin: 0 65px 20px 35px;

}

@media only screen and (max-width: 767px){

 /*   .flavour-video-stream {
        flex-wrap: wrap;
    }

    .video-info {
        width: 100%;
    }

    .video-info-content {
        width: 375px;
        padding-top: 5px;
        background-image: url("/img/neben-video/pfeil-links.png");
        background-position: 10px 20px;
    }
    .video-info-content img {

        width: 70%;
        margin-left: 80px;
    }

    .flavour-video-stream video {
        width: 100%;
    }
*/
}

.is-mobile .flavour-video-stream {
    flex-wrap: wrap;
}

.is-mobile .video-info {
    width: 100%;
}

.is-mobile .video-info h3 {
    margin-left: 50px;

}

.is-mobile .video-info-content {
    width: 375px; /* 767 */
    padding-top: 5px;
    background-image: url("/img/neben-video/pfeil-links.png");
    background-position: 10px 20px;
}
.is-mobile .video-info-content img {

    width: 70%;
    margin-left: 80px;
}

.is-mobile .flavour-video-stream video {
    width: 100%;
}




/* flip */

.section-flipbook .flipbook .alpenmilch {
    background-image: url(/img/blaettern/desktop/alpenmilch.png);
}
.is-mobile .section-flipbook .flipbook .alpenmilch {
    background-image: url(/img/blaettern/mobile/alpenmilch.png);
}

.section-flipbook .flipbook .luflee {
    background-image: url(/img/blaettern/desktop/luflee.png);
}
.is-mobile .section-flipbook .flipbook .luflee {
    background-image: url(/img/blaettern/mobile/luflee.png);
}

.section-flipbook .flipbook .oreo {
    background-image: url(/img/blaettern/desktop/oreo.png);
}
.is-mobile .section-flipbook .flipbook .oreo {
    background-image: url(/img/blaettern/mobile/oreo.png);
}

.section-flipbook .flipbook .daim {
    background-image: url(/img/blaettern/desktop/daim.png);
}
.is-mobile .section-flipbook .flipbook .daim {
    background-image: url(/img/blaettern/mobile/daim.png);
}

.section-flipbook .flipbook .haselnuss {
    background-image: url(/img/blaettern/desktop/haselnuss.png);
}
.is-mobile .section-flipbook .flipbook .haselnuss {
    background-image: url(/img/blaettern/mobile/haselnuss.png);
}

.section-flipbook .flipbook .ganze-haselnuss {
    background-image: url(/img/blaettern/desktop/ganze-haselnuss.png);
}
.is-mobile .section-flipbook .flipbook .ganze-haselnuss {
    background-image: url(/img/blaettern/mobile/ganze-haselnuss.png);
}

.section-flipbook .flipbook .traube-nuss {
    background-image: url(/img/blaettern/desktop/traube-nuss.png);
}
.is-mobile .section-flipbook .flipbook .traube-nuss {
    background-image: url(/img/blaettern/mobile/traube-nuss.png);
}

.section-flipbook .flipbook .noisette {
    background-image: url(/img/blaettern/desktop/noisette.png);
}
.is-mobile .section-flipbook .flipbook .noisette {
    background-image: url(/img/blaettern/mobile/noisette.png);
}

.section-flipbook .flipbook .joghurt {
    background-image: url(/img/blaettern/desktop/joghurt.png);
}
.is-mobile .section-flipbook .flipbook .joghurt {
    background-image: url(/img/blaettern/mobile/joghurt.png);
}

.section-flipbook .flipbook .tuc {
    background-image: url(/img/blaettern/desktop/tuc.png);
}
.is-mobile .section-flipbook .flipbook .tuc {
    background-image: url(/img/blaettern/mobile/tuc.png);
}

.section-flipbook .flipbook .lu {
    background-image: url(/img/blaettern/desktop/lu.png);
}
.is-mobile .section-flipbook .flipbook .lu {
    background-image: url(/img/blaettern/mobile/lu.png);
}

.section-flipbook .flipbook .erdbeer {
    background-image: url(/img/blaettern/desktop/erdbeer.png);
}
.is-mobile .section-flipbook .flipbook .erdbeer {
    background-image: url(/img/blaettern/mobile/erdbeer.png);
}

.section-flipbook .flipbook .kuhflecken {
    background-image: url(/img/blaettern/desktop/kuhflecken.png);
}
.is-mobile .section-flipbook .flipbook .kuhflecken {
    background-image: url(/img/blaettern/mobile/kuhflecken.png);
}

.section-flipbook .flipbook .alpenmilch-creme {
    background-image: url(/img/blaettern/desktop/alpenmilch-creme.png);
}
.is-mobile .section-flipbook .flipbook .alpenmilch-creme {
    background-image: url(/img/blaettern/mobile/alpenmilch-creme.png);
}

.section-flipbook .flipbook .bunte-kakaolinsen {
    background-image: url(/img/blaettern/desktop/bunte-kakaolinsen.png);
}
.is-mobile .section-flipbook .flipbook .bunte-kakaolinsen {
    background-image: url(/img/blaettern/mobile/bunte-kakaolinsen.png);
}

.section-flipbook .flipbook .oreo-white {
    background-image: url(/img/blaettern/desktop/oreo-white.png);
}
.is-mobile .section-flipbook .flipbook .oreo-white {
    background-image: url(/img/blaettern/mobile/oreo-white.png);
}

.section-flipbook .flipbook .oreo-sandwich {
    background-image: url(/img/blaettern/desktop/oreo-sandwich.png);
}
.is-mobile .section-flipbook .flipbook .oreo-sandwich {
    background-image: url(/img/blaettern/mobile/oreo-sandwich.png);
}

.section-flipbook .flipbook .weisse {
    background-image: url(/img/blaettern/desktop/weisse-schokolade.png);
}
.is-mobile .section-flipbook .flipbook .weisse {
    background-image: url(/img/blaettern/mobile/weisse-schokolade.png);
}

.section-flipbook .flipbook .caramel {
    background-image: url(/img/blaettern/desktop/caramel.png);
}
.is-mobile .section-flipbook .flipbook .caramel {
    background-image: url(/img/blaettern/mobile/caramel.png);
}

.section-flipbook .flipbook .zartbitter {
    background-image: url(/img/blaettern/desktop/zartbitter.png);
}
.is-mobile .section-flipbook .flipbook .zartbitter {
    background-image: url(/img/blaettern/mobile/zartbitter.png);
}

.section-flipbook .flipbook .peanut-crisp {
    background-image: url(/img/blaettern/desktop/peanut-crisp.png);
}
.is-mobile .section-flipbook .flipbook .peanut-crisp {
    background-image: url(/img/blaettern/mobile/peanut-crisp.png);
}





.section-flipbook {
    position: relative;
    /*margin-top: 400px;*/
    height: 800px;
}

.section-flipbook .flipbook-viewport .container {
    /*left: 38%; /* standard */
    /*left: 28%; /* double war: 48 */
    left: 15.6%;
    top: 60%; /* wg. text-block */
}
.is-mobile .section-flipbook .flipbook-viewport .container {
    left: 48%;
    top: 80%; /* wg text-block */
}

.section-flipbook .flipbook-viewport .double {
    /*width: 796px;
    height: 500px;*/
    width: 1194px;
    height: 750px;
}
.is-mobile .section-flipbook .flipbook-viewport .double {
    width: 358px;  /* 398 ok aber klein 185 */
    height: 270px; /* 250 ok aber klein 153 */
}


.flipbook-viewport .flipbook {
    left: -100px;
}
.is-mobile .flipbook-viewport .flipbook {
    left: -172px;
}


.section-flipbook .flipbook-viewport .page {
    background-color: transparent;

    /*-webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;*/

}

.flipbook .shadow {
    /*display: none;*/
    /*-webkit-box-shadow: 0 4px 10px #666;
    -moz-box-shadow: 0 4px 10px #666;
    -ms-box-shadow: 0 4px 10px #666;
    -o-box-shadow: 0 4px 10px #666;
    box-shadow: 0 4px 10px #666;*/

    -webkit-box-shadow: 0 16px 22px #333;
    -moz-box-shadow: 0 16px 22px #333;
    -ms-box-shadow: 0 16px 22px #333;
    -o-box-shadow: 0 16px 22px #333;
    box-shadow: 0 16px 22px #333;

    border-radius: 16px;

}



/*
	-webkit-transition: -webkit-box-shadow 0.5s;
	-moz-transition: -moz-box-shadow 0.5s;
	-o-transition: -webkit-box-shadow 0.5s;
	-ms-transition: -ms-box-shadow 0.5s;

	-webkit-box-shadow:0 0 20px #ccc;
	-moz-box-shadow:0 0 20px #ccc;
	-o-box-shadow:0 0 20px #ccc;
	-ms-box-shadow:0 0 20px #ccc;
	box-shadow:0 0 20px #ccc;
 */




/* Swooshs */
.swoosh {
    position: absolute;
    width: 100%;
    z-index: 10;

    background-color: transparent;
    background-position: center 20px;
    background-repeat: no-repeat;
}


.header-swoosh {
    height: 223px;

    background-image: url("/img/welle/desktop/welle-1.png");

    top: -120px;
}

.is-mobile .header-swoosh {
    bottom: 50px;
}


.dark-swoosh {
    bottom: 147px;
    height: 223px;

    background-image: url("/img/welle/desktop/welle-2.png");
}

.is-mobile .dark-swoosh {
    bottom: 50px; /* wg blocking white space; s. slick-slider-nav */
    background-image: url("/img/welle/mobile/welle-2.png");
}


.videos-flipbook-swoosh {
    height: 223px;

    background-image: url("/img/welle/desktop/welle-3.png");

    top: -120px;
}

.is-mobile .videos-flipbook-swoosh {
    top: -58px;
    background-image: url("/img/welle/mobile/welle-1.png");
}






.section-teaser {
    position: relative;
    margin-top: 380px;
}
.is-mobile .section-teaser {
    margin-top: 80px;
}

.fcmilka-text {
    /*max-width: 900px;*/
}


.flavour-teaser {
    margin-left: auto;
    margin-right: auto;

    background-size: contain;

    width: 960px;
    height: 540px;


    margin-bottom: 50px;
}
.is-mobile .flavour-teaser {
    width: 375px;
    height: 430px;
}

.fcmilka-teaser {
    background-image: url("/img/teaser/FC-Milka-Teaser-02-2025-Gewinn-Legendenspiel-1309x734.jpg");
    background-repeat: no-repeat;
}
/*.is-mobile .fcmilka-teaser {
    background-image: url("/img/teaser/Teaser-FC-Milka-2023-Q4-375x430.jpg");
}*/

.section-teaser .button-wrapper {
    display: flex;
    justify-content: center;
}




.page-wrapper-footer {
    margin-top: 150px;

}



.cookie-page__content #ot-sdk-cookie-policy-v2.ot-sdk-cookie-policy h5,
.cookie-page__content #ot-sdk-cookie-policy-v2.ot-sdk-cookie-policy h6,
.cookie-page__content #ot-sdk-cookie-policy-v2.ot-sdk-cookie-policy li,
.cookie-page__content #ot-sdk-cookie-policy-v2.ot-sdk-cookie-policy p,
.cookie-page__content #ot-sdk-cookie-policy-v2.ot-sdk-cookie-policy a,
.cookie-page__content #ot-sdk-cookie-policy-v2.ot-sdk-cookie-policy span,
.cookie-page__content #ot-sdk-cookie-policy-v2.ot-sdk-cookie-policy td,
.cookie-page__content #ot-sdk-cookie-policy-v2.ot-sdk-cookie-policy #cookie-policy-description {
    color: #ffffff;
}

.cookie-page__content #ot-sdk-cookie-policy-v2.ot-sdk-cookie-policy .ot-sdk-cookie-policy-group {
    color: #ffffff;
}

.cookie-page__content #ot-sdk-cookie-policy-v2.ot-sdk-cookie-policy th {
    color: #ffffff;
    background-color: #7d69ac;
}


/* section-galerie */
.section-galerie .wallsio-wrapper {
    max-width:1200px;
    margin-left: auto;
    margin-right: auto;
}

.wallsio-wrapper button {
    margin-left: auto;
    margin-right: auto;
    display: block;
    margin-top: 40px;

    color: #3b2774;
    text-align: center;
    letter-spacing: .1rem;
    text-transform: uppercase;
    background-color: #fff;
    border: 3px solid #fff;
    border-radius: 100rem;
    padding: .4rem 2.125rem .3rem;
    font-size: 1.15rem;
    font-weight: 500;
    text-decoration: none;
    transition: all .3s;

    font-family: GoodHeadlinePro, sans-serif;
}

.wallsio-wrapper button:hover {
    color: #fff;
    background-color: rgba(0, 0, 0, 0);
    transform: scale(1.01);
}




