:root {
    --footer-cookie-bg-color: #606bff;
    --footer-cookie-color: #fff;
    --footer-cookie-ok-btn-border-color: #fff;
    --footer-cookie-ok-btn-bg-hover-color: #fff;
    --footer-cookie-font-family: Verdana;
    --footer-cookie-font-size:14px;
}
.footer-cookie-container {
    z-index: 9999999;
    font-size: var(--footer-cookie-font-size);
    font-family: var(--footer-cookie-font-family);
    background: var(--footer-cookie-bg-color);
    color: var(--footer-cookie-color);
    display: grid;
    width: 100%;
    padding: 15px 0 10px 0;
    grid-template-areas: "footer-cookie-text footer-cookie-text footer-cookie-text footer-cookie-ok-btn" "footer-cookie-datenschutz footer-cookie-datenschutz footer-cookie-datenschutz footer-cookie-deny-btn";
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-template-rows: 1fr auto;
    grid-gap: 3px;
    position: fixed;
    bottom: 0;
    left: 0;
    transition: all 0.375s linear;
}
.footer-cookie-text {
    grid-area: footer-cookie-text;
    display: grid;
    justify-content: start;
    align-content: center;
    padding-left: 10px;
}
.footer-cookie-ok-btn {
    grid-area: footer-cookie-ok-btn;
    display: grid;
    justify-items: center;
    align-content: center;
}
.footer-cookie-ok-btn > a {
    width: 80%;
    text-decoration: none;
    color: var(--footer-cookie-color);
    border: 2px solid var(--footer-cookie-ok-btn-border-color);
    text-align: center;
    padding: 7px 20px;
    font-size: 140%;
}
.footer-cookie-ok-btn a:hover {
    color: #000;
    background: var(--footer-cookie-ok-btn-bg-hover-color);
}
.footer-cookie-datenschutz {
    grid-area: footer-cookie-datenschutz;
    display: grid;
    justify-content: start;
    align-content: center;
    padding-left: 10px;
}
.footer-cookie-datenschutz a {
    text-decoration: none;
    color: var(--footer-cookie-color);
}
.footer-cookie-deny-btn {
    grid-area: footer-cookie-deny-btn;
    display: grid;
    justify-content: center;
    align-content: center;
}
.footer-cookie-deny-btn a {
    text-decoration: none;
    color: #ccc;
}
.footer-cookie-deny-btn a:hover {
    color: var(--footer-cookie-color);
}
.cookie-bestimmungen-btn {
    font-size: 80%;
}
@media (max-width: 1024px) {
    .footer-cookie-container {
        grid-template-areas: "footer-cookie-text footer-cookie-ok-btn" "footer-cookie-datenschutz footer-cookie-deny-btn";
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 1fr auto;
    }
}
@media (max-width: 480px) {
    .footer-cookie-container {
        grid-template-areas: "footer-cookie-text" "footer-cookie-datenschutz" "footer-cookie-ok-btn" "footer-cookie-deny-btn";
        grid-template-columns: 1fr;
        grid-template-rows: auto;
    }
    .footer-cookie-datenschutz {
        padding: 0 0 10px 10px;
    }
    .footer-cookie-ok-btn {
        grid-area: footer-cookie-ok-btn;
        display: grid;
        justify-items: center;
        align-content: center;
    }
    .footer-cookie-ok-btn > a {
        width: 80%;
        text-decoration: none;
        color: var(--footer-cookie-color);
        border: 2px solid var(--footer-cookie-ok-btn-border-color);
        text-align: center;
        padding: 10px 20px;
        font-size: 120%;
    }
}
.hidden {
    display: none;
}
.not-seen-on-site {
    opacity: 0;
    z-index: 0;
}

<div class="footer-cookie-container not-seen-on-site" id="footer-cookie">
    <div class="footer-cookie-text">Wir nutzen Cookies, um unsere Dienste zu erbringen und zu verbessern. Mit Nutzung dieser Seite akzeptieren Sie Cookies. </div>
    <div class="footer-cookie-ok-btn" id="cookie-accept"><a  href="javascript:void(0)" title="Akzeptieren">Einverstanden</a></div>
    <div class="footer-cookie-datenschutz"><a class="cookie-bestimmungen-btn" href="https://czw.at/datenschutz.php" >(Datenschutzbestimmungen)</a></div>
    <div class="footer-cookie-deny-btn" ><a id="cookie-deny" href="javascript:void(0)" title="ablehnen">ablehnen</a></div>
</div>

var footerCookie = document.querySelector("#footer-cookie"),
    footerCookieDeny = document.querySelector("#cookie-deny"),
    footerCookieAccept = document.querySelector("#cookie-accept");
let box = document.getElementById("footer-cookie");
if (-1 == document.cookie.indexOf("CarlosCookieBanner="))
    box.classList.remove("hidden"),
        setTimeout(function () {
            box.classList.remove("not-seen-on-site");
        }, 20);
else {
    var footerCookieGet = getCookie("CarlosCookieBanner");
    console.log("im else schon da"),
        "deny" == footerCookieGet &&
            (box.classList.remove("hidden"),
            setTimeout(function () {
                box.classList.remove("not-seen-on-site");
            }, 20));
}
function setCookie(e, o, t) {
    var n = new Date();
    n.setTime(n.getTime() + 24 * t * 60 * 60 * 1e3);
    var i = "expires=" + n.toUTCString();
    document.cookie = e + "=" + o + ";" + i + ";path=/";
}
function getCookie(e) {
    for (var o = e + "=", t = decodeURIComponent(document.cookie).split(";"), n = 0; n < t.length; n++) {
        for (var i = t[n]; " " == i.charAt(0); ) i = i.substring(1);
        if (0 == i.indexOf(o)) return i.substring(o.length, i.length);
    }
    return "";
}
(footerCookieAccept.onclick = function (e) {
    console.log("acceptbtn"),
        setCookie("CarlosCookieBanner", "accept", 30),
        box.classList.add("not-seen-on-site"),
        box.addEventListener(
            "transitionend",
            function (e) {
                box.classList.add("hidden");
            },
            { capture: !1, once: !0, passive: !1 }
        );
}),
    (footerCookieDeny.onclick = function (e) {
        console.log("denybtn"),
            setCookie("CarlosCookieBanner", "deny", 30),
            box.classList.add("not-seen-on-site"),
            box.addEventListener(
                "transitionend",
                function (e) {
                    box.classList.add("hidden");
                },
                { capture: !1, once: !0, passive: !1 }
            );
    });

<link rel="stylesheet" href="//unpkg.com/ue-scroll-js@latest/dist/ue-scroll.min.css">
<script src="https://unpkg.com/ue-scroll-js"></script>
<!--[btn-white -grey -black]   [arrow-white -black]  [circle rounded-rectangle square]-->
<div id="ue-scroll" class="ue-scroll btn-white arrow-black circle shadow"></div>
<script>
    UeScroll.init();
</script>

//der "Button" im Menü
<div class="link-to-page" data-page="index">zur Startseite</div>
    
//als jquery in die Startdatei einfügen
$('.link-to-page').on("click",function(){
    var page = $(this).data('page');
    if(page == ""){ return; }
    $("body").fadeOut(1E3, function() {
        location.href = page+'.php';
    });
    return false
});

/*als style in die Zieldatei einfügen*/
html {
    background:#000;
}
body {
    display:none;
}

/*als jquery in die Zieldatei am Ende des body einfügen*/
$("body").fadeIn(500);  //wieder einblenden nach dem Laden

<link rel="stylesheet" href="//unpkg.com/ue-scroll-js@latest/dist/ue-scroll.min.css">
<script src="https://unpkg.com/ue-scroll-js"></script>
<!--[btn-white -grey -black]   [arrow-white -black]  [circle rounded-rectangle square]-->
<div id="ue-scroll" class="ue-scroll btn-white arrow-black circle shadow"></div>
<script>
    UeScroll.init();
</script>

.scroll-profil-complete-info {
    display: none;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 20px 0;
    text-align: center;
    background: #878dff;
    color: #fff;
}
.profil-complete-verstanden {
    font-size: 50%;
    color: #fff;
    padding: 6px;
    cursor: pointer;
    border: 2px solid #fff;
    transition: background 375ms;
}
.profil-complete-verstanden:hover {
    background: rgba(0, 0, 0, 0.6);
}

<!--setze den Scrollpunkt, ab welchem die INFO eingeblendet wird-->
<div id="zeige-punkt-nextProfilComplete">ab hier fadeIn der Info </div>
<!--und das popup-element:-->
<div id="scroll-profil-complete" class="scroll-profil-complete-info">Hier kannst Du deine INFO platzieren<br>
    <span class="profil-complete-verstanden">Verstanden - nicht mehr anzeigen</span>
</div>

function set_profil_complete_cookie(e, o, t) {
    var l = escape(o);
    if (t) {
        var r = new Date;
        r.setDate(r.getDate() + t), l += "; expires=" + r.toUTCString()
    }
    document.cookie = e + "=" + l
}

function get_profil_complete_cookie(e) {
    var o, t, l, r = document.cookie.split(";");
    for (o = 0; o < r.length; o++)
        if (t = r[o].substr(0, r[o].indexOf("=")), l = r[o].substr(r[o].indexOf("=") + 1), (t = t.replace(/^\s+|\s+$/g, "")) === e) return unescape(l)
}
$(window).scroll(function() {
    if (window.localStorage) {
        var e = localStorage.getItem("nextProfilComplete");
        if ("verstanden" == localStorage.getItem("ProfilComplete") && e > new Date) return
    } else if (get_profil_complete_cookie("nextProfilComplete")) return;
    var o = $("#zeige-punkt-nextProfilComplete").offset().top,
        t = $("#zeige-punkt-nextProfilComplete").outerHeight(),
        l = $(window).height();
    $(this).scrollTop() > o + t - l ? $("#scroll-profil-complete").fadeIn(500) : $("#scroll-profil-complete").fadeOut(375)
}), $(".profil-complete-verstanden").on("click", function() {
    if (window.localStorage) {
        var e = new Date;
        e = e.setHours(e.getHours() + 24), localStorage.setItem("nextProfilComplete", e), localStorage.setItem("ProfilComplete", "verstanden")
    } else set_profil_complete_cookie("nextProfilComplete", "verstanden", 1);
    setTimeout(function() {
        $("#scroll-profil-complete").fadeOut(375)
    }, 175)
});