﻿.flakecontainer {
    overflow: hidden;
}

@media (max-width: 768px) {
    /* Nascondo il logo se uso il menu esteso. */
    .flakecontainer {
        overflow: hidden;
        display: none;
    }
}

.flake {
    color: rgb(247, 252, 243);
    font-size: 2rem;
    padding: 1rem;
    animation: fall 4s linear forwards infinite;
    animation-delay: 1s;
}

@keyframes fall {
    from {
        transform: translateY(-100vh);
    }

    to {
        transform: translateY(100vh);
    }
}

.float {
    position: relative;
    -webkit-animation: floatBubble 12s infinite;
    animation: floatBubble 12s infinite;
    animation-delay: 3s;
    display: none;
    overflow: hidden;
}

@media (max-width: 768px) {
    .float {
        margin-top: 55px;
        margin-bottom: -65px;
        position: relative;
        -webkit-animation: floatBubble 12s infinite;
        animation: floatBubble 12s infinite;
        animation-delay: 3s;
        display: none;
        overflow: hidden;
    }
}

@-webkit-keyframes floatBubble {
    0% {
        left: -200px;
    }

    100% {
        left: 100vw;
    }
}

@keyframes floatBubble {
    0% {
        left: -200px;
    }

    100% {
        left: 100vw;
    }
}
