*
{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html,
body
{
    overflow: hidden;
}

/* .experience
{
    position: fixed;
    width: 100vw;
    height: 100vh;
} */

.experience {
    position: fixed;
    width: 100vw;
    height: 100vh;
    background-color: black; 
    /* animation: zoomIn 5s forwards;  */
    /* animation: fadeIn 2s forwards; */
}

/* @keyframes zoomIn {
    0% {
        transform: scale(1); /* Start at normal size *
    }
    100% {
        transform: scale(5); /* Zoom to 500% size *
    }
} */


/* @keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1; 
    }
} */

.fade-out {
    animation: fadeOut1 8s forwards;
}

@keyframes fadeOut1 {
    from {
        opacity: 1;
        /* background-color: white; */
        background-color: black;
    }
    to {
        opacity: 0;
        background-color: black;
    }
}