* {
    margin: 0;
    padding: 0;
    overflow-x: hidden;
}
button {
    background: none;
	color: inherit;
	border: none;
	padding: 0;
}



@media only screen and (max-width: 768px) {
    body {
        background: black;
        background-position: center;
        text-align: center;
    }
    .mum .btn img {
        margin: 50px 0px 100px;
        width: 60%;
        border-radius: 20%;
        box-shadow: 5px 5px 5px rgb(0, 0, 0);
    }

    .mum_arbeit a img {
        cursor: pointer;
        border-radius: 2%;
        width: 10%;
        opacity: 0;
        margin: 0px 0px 100px;
        animation: slide_in_arbeit 1s ease-in-out 1.5s forwards;
        box-shadow: 0 0.2rem 0.4rem rgb(0 0 0);
    }
    @keyframes slide_in_arbeit {
        100% {
            width: 30%;
            height: 100%;
            opacity: 100%;
        }
    }

    .mum_facebook a img {
        cursor: pointer;
        border-radius: 50%;
        width: 20%;
        opacity: 0;
        animation: slide_in_fb 1s ease-in-out 2.5s forwards;
        box-shadow: 0 0.2rem 0.4rem rgb(0 0 0);
    }
    @keyframes  slide_in_fb {
        100% {
            top: 70%;
            left: 50%;
            width: 30%;
            opacity: 100%;
        }
    } 

    .mum_insta a img {
        cursor: pointer;
        border-radius: 2%;
        width: 20%;
        opacity: 0;
        margin: 100px 0px 0px;
        animation: slide_in_insta 1s ease-in-out 3.5s forwards;
        box-shadow: 0 0.2rem 0.4rem rgb(0 0 0);
    }
    @keyframes  slide_in_insta {
        100% {
            top: 70%;
            left: 50%;
            width: 30%;
            opacity: 100%;
        }
    } 

    .mum_tiktok a img {
        cursor: pointer;
        width: 100%;
        opacity: 0;
        margin: 100px 0px 100px;
        animation: slide_in_tt 1s ease-in-out 4.5s forwards;
        box-shadow: 0 0.2rem 0.4rem rgb(0 0 0);
    }
    @keyframes slide_in_tt {
        100% {
            top: 70%;
            left: 50%;
            width: 30%;
            opacity: 100%;
        }
        
    }


}

@media only screen and (min-width: 768px) {
    body {
        background-color: black;
        background-position: center;
        text-align: center;
    }
    .mum .btn img {
        margin: 50px 0px 100px;
        width: 60%;
        border-radius: 20%;
        box-shadow: 5px 5px 5px rgb(0, 0, 0);
    }

    .mum_arbeit a img {
        cursor: pointer;
        border-radius: 2%;
        width: 10%;
        opacity: 0;
        margin: 0px 0px 100px;
        animation: slide_in_arbeit 1s ease-in-out 1.5s forwards;
        box-shadow: 0 0.2rem 0.4rem rgb(0 0 0);
    }
    @keyframes slide_in_arbeit {
        100% {
            width: 20%;
            opacity: 100%;
        }
    }

    .mum_facebook a img {
        cursor: pointer;
        border-radius: 50%;
        width: 20%;
        opacity: 0;
        margin: 0px 0px 50px;
        animation: slide_in_fb 1s ease-in-out 2.5s forwards;
        box-shadow: 0 0.2rem 0.4rem rgb(0 0 0);
    }
    @keyframes  slide_in_fb {
        100% {
            width: 20%;
            opacity: 100%;
        }
    } 

    .mum_insta a img {
        cursor: pointer;
        border-radius: 2%;
        width: 20%;
        opacity: 0;
        margin: 100px 0px 0px;
        animation: slide_in_insta 1s ease-in-out 3.5s forwards;
        box-shadow: 0 0.2rem 0.4rem rgb(0 0 0);
    }
    @keyframes  slide_in_insta {
        100% {
            top: 70%;
            left: 50%;
            width: 20%;
            opacity: 100%;
        }
    } 

    .mum_tiktok a img {
        cursor: pointer;
        width: 100%;
        opacity: 0;
        margin: 100px 0px 100px;
        animation: slide_in_tt 1s ease-in-out 4.5s forwards;
        box-shadow: 0 0.2rem 0.4rem rgb(0 0 0);
    }
    @keyframes slide_in_tt {
        100% {
            top: 70%;
            left: 50%;
            width: 20%;
            opacity: 100%;
        }
        
    }

    
}

@media only screen and (min-width: 992px) {
    body {
        background-color: black;
        background-position: center;
        text-align: center;
    }

    .mum .btn img {
        margin: 50px 0px 100px;
        width: 60%;
        border-radius: 20%;
        box-shadow: 5px 5px 5px rgb(0, 0, 0);
    }

    .mum_arbeit a img {
        cursor: pointer;
        border-radius: 2%;
        width: 10%;
        opacity: 0;
        margin: 0px 0px 100px;
        animation: slide_in_arbeit 1s ease-in-out 1.5s forwards;
        box-shadow: 0 0.2rem 0.4rem rgb(0 0 0);
    }
    @keyframes slide_in_arbeit {
        100% {
            width: 15%;
            height: 100%;
            opacity: 100%;
        }
    }

    .mum_facebook a img {
        cursor: pointer;
        border-radius: 50%;
        width: 20%;
        opacity: 0;
        margin: 0px 0px 50px;
        animation: slide_in_fb 1s ease-in-out 2.5s forwards;
        box-shadow: 0 0.2rem 0.4rem rgb(0 0 0);
    }
    @keyframes  slide_in_fb {
        100% {
            top: 70%;
            left: 50%;
            width: 15%;
            height: 100%;
            opacity: 100%;
        }
    } 

    .mum_insta a img {
        cursor: pointer;
        border-radius: 2%;
        width: 20%;
        opacity: 0;
        margin: 100px 0px 0px;
        animation: slide_in_insta 1s ease-in-out 3.5s forwards;
        box-shadow: 0 0.2rem 0.4rem rgb(0 0 0);
    }
    @keyframes  slide_in_insta {
        100% {
            top: 70%;
            left: 50%;
            width: 15%;
            opacity: 100%;
        }
    } 

    .mum_tiktok a img {
        cursor: pointer;
        width: 100%;
        opacity: 0;
        margin: 100px 0px 100px;
        animation: slide_in_tt 1s ease-in-out 4.5s forwards;
        box-shadow: 0 0.2rem 0.4rem rgb(0 0 0);
    }
    @keyframes slide_in_tt {
        100% {
            top: 70%;
            left: 50%;
            width: 15%;
            opacity: 100%;
        }
        
    }
}

@media only screen and (min-width: 1200px) {
    body {
        background-color: black;
        background-position: center;
        text-align: center;
    }

    .mum .btn img {
        margin: 50px 0px 100px;
        width: 60%;
        border-radius: 20%;
        box-shadow: 5px 5px 5px rgb(0, 0, 0);
    }

    .mum_arbeit a img {
        cursor: pointer;
        border-radius: 2%;
        width: 10%;
        opacity: 0;
        margin: 0px 0px 100px;
        animation: slide_in_arbeit 1s ease-in-out 1.5s forwards;
        box-shadow: 0 0.2rem 0.4rem rgb(0 0 0);
    }
    @keyframes slide_in_arbeit {
        100% {
            width: 12%;
            height: 100%;
            opacity: 100%;
        }
    }

    .mum_facebook a img {
        cursor: pointer;
        border-radius: 50%;
        width: 20%;
        opacity: 0;
        margin: 0px 0px 50px;
        animation: slide_in_fb 1s ease-in-out 2.5s forwards;
        box-shadow: 0 0.2rem 0.4rem rgb(0 0 0);
    }
    @keyframes  slide_in_fb {
        100% {
            top: 70%;
            left: 50%;
            width: 12%;
            height: 100%;
            opacity: 100%;
        }
    } 

    .mum_insta a img {
        cursor: pointer;
        border-radius: 2%;
        width: 20%;
        opacity: 0;
        margin: 100px 0px 0px;
        animation: slide_in_insta 1s ease-in-out 3.5s forwards;
        box-shadow: 0 0.2rem 0.4rem rgb(0 0 0);
    }
    @keyframes  slide_in_insta {
        100% {
            top: 70%;
            left: 50%;
            width: 12%;
            opacity: 100%;
        }
    } 

    .mum_tiktok a img {
        cursor: pointer;
        width: 100%;
        opacity: 0;
        margin: 100px 0px 100px;
        animation: slide_in_tt 1s ease-in-out 4.5s forwards;
        box-shadow: 0 0.2rem 0.4rem rgb(0 0 0);
    }
    @keyframes slide_in_tt {
        100% {
            top: 70%;
            left: 50%;
            width: 12%;
            opacity: 100%;
        }
        
    }
}

@media only screen and (min-width: 1400px) {
    body {
        background-color: black;
        background-position: center;
        text-align: center;
    }

    .mum .btn img {
        margin: 50px 0px 100px;
        width: 60%;
        border-radius: 20%;
        box-shadow: 5px 5px 5px rgb(0, 0, 0);
    }

    .mum_arbeit a img {
        cursor: pointer;
        border-radius: 2%;
        width: 10%;
        opacity: 0;
        margin: 0px 0px 100px;
        animation: slide_in_arbeit 1s ease-in-out 1.5s forwards;
        box-shadow: 0 0.2rem 0.4rem rgb(0 0 0);
    }
    @keyframes slide_in_arbeit {
        100% {
            width: 10%;
            opacity: 100%;
        }
    }

    .mum_facebook a img {
        cursor: pointer;
        border-radius: 50%;
        width: 20%;
        opacity: 0;
        margin: 0px 0px 50px;
        animation: slide_in_fb 1s ease-in-out 2.5s forwards;
        box-shadow: 0 0.2rem 0.4rem rgb(0 0 0);
    }
    @keyframes  slide_in_fb {
        100% {
            top: 70%;
            left: 50%;
            width: 10%;
            opacity: 100%;
        }
    } 

    .mum_insta a img {
        cursor: pointer;
        border-radius: 2%;
        width: 20%;
        opacity: 0;
        margin: 100px 0px 0px;
        animation: slide_in_insta 1s ease-in-out 3.5s forwards;
        box-shadow: 0 0.2rem 0.4rem rgb(0 0 0);
    }
    @keyframes  slide_in_insta {
        100% {
            top: 70%;
            left: 50%;
            width: 10%;
            opacity: 100%;
        }
    } 

    .mum_tiktok a img {
        cursor: pointer;
        width: 100%;
        opacity: 0;
        margin: 100px 0px 100px;
        animation: slide_in_tt 1s ease-in-out 4.5s forwards;
        box-shadow: 0 0.2rem 0.4rem rgb(0 0 0);
    }
    @keyframes slide_in_tt {
        100% {
            top: 70%;
            left: 50%;
            width: 10%;
            opacity: 100%;
        }
        
    }
}




































/*Backup



body {
    margin: 0;
    padding: 0;
    background: url("../images/water.jpg");
    background-size: cover;
}

.monika button {
    background: transparent;
    border: none;
}
.monika button img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: url("../images/monika.png");
    background-size: 100%;
    animation: slide 1s ease-in-out 0.5s forwards;
    border-radius: 2%;
    cursor: pointer;
    height: 42.6rem;
    width: 30rem;
    border: none;
    box-shadow: 0 0.2rem 0.4rem rgb(0 0 0);

}
@keyframes slide  {

    100% {
        top: 15rem;
        height: 22rem;
        width: 15rem;
        background-size: 100%;
    }
}
.monika_arbeit a img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    cursor: pointer;
    border-radius: 2%;
    width: 30%;
    opacity: 0;
    animation: slide_in 1s ease-in-out 1.5s forwards;
    box-shadow: 0 0.2rem 0.4rem rgb(0 0 0);
}
@keyframes slide_in {
    100% {
        top: 70%;
        left: 15rem;
        width: 15%;
        opacity: 100%;
    }
}
.monika_facebook a img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    cursor: pointer;
    border-radius: 50%;
    width: 30%;
    opacity: 0;
    animation: slide_in_fb 1s ease-in-out 2.5s forwards;
    box-shadow: 0 0.2rem 0.4rem rgb(0 0 0);
}
@keyframes slide_in_fb {
    100% {
        top: 70%;
        left: 50rem;
        width: 13%;
        opacity: 100%;
    }
}
.monika_insta a img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    cursor: pointer;
    border-radius: 28%;
    width: 30%;
    opacity: 0;
    animation: slide_in_auto 1s ease-in-out 3.5s forwards;
    box-shadow: 0 0.2rem 0.4rem rgb(0 0 0);
}
@keyframes slide_in_auto {
    100% {
        top: 70%;
        left: 80rem;
        width: 12%;
        opacity: 100%;
    }
}
.monika_tiktok a img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    cursor: pointer;
    border-radius: 28%;
    width: 30%;
    opacity: 0;
    animation: slide_in_tiktok 1s ease-in-out 4.5s forwards;
    box-shadow: 0 0.2rem 0.4rem rgb(0 0 0);
}
@keyframes slide_in_tiktok {
    100% {
        top: 70%;
        left: 105rem;
        width: 10%;
        opacity: 100%;
    }
}
*/




