.animation-moveRight {
    animation: moveRight 0.5s ease-in-out;
}

.animation-moveLeft {
    animation: moveLeft 0.5s ease-in-out;
}

.animation-fadeIn {
     animation: fadeIn 0.5s ease-in-out;
 }

.animation-fadeOut {
    animation: fadeOut 0.5s ease-in-out;
}

.visibility-none {
    opacity: 0;
}

.animation-pulse {
    animation: pulse 3s linear infinite;
}

.animation-width_1 {
    animation: width-1 1s ease-in-out;
}

.animation-width_2 {
    animation: width-2 1s ease-in;
}

.animation-width_3 {
    animation: width-3 1s ease;
}

.animation-width_4 {
    animation: width-4 1s ease-out;
}

@keyframes moveRight {
    from {
        transform: translate(-200px, 0);
        opacity: 0;
    }

    to {
        transform: translate(0, 0);
        opacity: 1;
    }
}

@keyframes moveLeft {
     from {
         transform: translate(200px, 0);
         opacity: 0;
     }

     to {
         transform: translate(0, 0);
         opacity: 1;
     }
 }

@keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes fadeOut {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
    }
}

@keyframes pulse {
    from {
        transform: scale(1);
        box-shadow: 0 0 5px rgba(0,0,0,.3);
    }

    50% {
        transform: scale(1.05);
        box-shadow: 0 0 20px rgba(0,0,0,.3);
    }

    to {
        transform: scale(1);
        box-shadow: 0 0 0 rgba(0,0,0,.5);
    }
}

@keyframes width-1 {
    from {
        width: 0;
    }

    to {
        width: 97%;
    }
}

@keyframes width-2 {
    from {
        width: 0;
    }

    to {
        width: 74%;
    }
}

@keyframes width-3 {
    from {
        width: 0;
    }

    to {
        width: 82%;
    }
}

@keyframes width-4 {
    from {
        width: 0;
    }

    to {
        width: 100%;
    }
}

@keyframes bell {
    from {
        transform: scale(1);
    }

    10% {
        transform: scale(1.1);
    }

    20% {
        transform: rotate(10deg) scale(1.1);
    }

    30% {
        transform: rotate(-10deg) scale(1.1);
    }

    40% {
        transform: rotate(0) scale(1.1);
    }

    50% {
        transform: scale(1);
    }

    to {
        transform: scale(1);
    }
}