.w3-animate-fading {
    -webkit-animation: fading 1s infinite;
    animation: fading 1s infinite;
}

@-webkit-keyframes fading {
    0% {
        opacity: .5;
    }

    50% {
        opacity: 1;
    }

    100% {
        opacity: .5;
    }
}

@keyframes fading {
    0% {
        opacity: .5;
    }

    50% {
        opacity: 1;
    }

    100% {
        opacity: .5;
    }
}

.w3-animate-opacity {
    -webkit-animation: opac 2s;
    animation: opac 2s;
}

@-webkit-keyframes opac {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes opac {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

.w3-animate-top {
    position: relative;
    -webkit-animation: animatetop 0.9s;
    animation: animatetop 0.9s;
}

@-webkit-keyframes animatetop {
    from {
        top: -300px;
        opacity: 0;
    }

    to {
        top: 0;
        opacity: 1;
    }
}

@keyframes animatetop {
    from {
        top: -300px;
        opacity: 0;
    }

    to {
        top: 0;
        opacity: 1;
    }
}

.w3-animate-left {
    position: relative;
    -webkit-animation: animateleft 0.4s;
    animation: animateleft 0.4s;
}

@-webkit-keyframes animateleft {
    from {
        left: -300px;
        opacity: 0;
    }

    to {
        left: 0;
        opacity: 1;
    }
}

@keyframes animateleft {
    from {
        left: -300px;
        opacity: 0;
    }

    to {
        left: 0;
        opacity: 1;
    }
}

.w3-animate-right {
    position: relative;
    -webkit-animation: animateright 0.4s;
    animation: animateright 0.4s;
}

@-webkit-keyframes animateright {
    from {
        right: -300px;
        opacity: 0;
    }

    to {
        right: 0;
        opacity: 1;
    }
}

@keyframes animateright {
    from {
        right: -300px;
        opacity: 0;
    }

    to {
        right: 0;
        opacity: 1;
    }
}

.w3-animate-bottom {
    position: relative;
    -webkit-animation: animatebottom 0.9s;
    animation: animatebottom 0.9s;
}

@-webkit-keyframes animatebottom {
    from {
        bottom: -300px;
        opacity: 0;
    }

    to {
        bottom: 0px;
        opacity: 1;
    }
}

@keyframes animatebottom {
    from {
        bottom: -300px;
        opacity: 0;
    }

    to {
        bottom: 0;
        opacity: 1;
    }
}

.w3-animate-zoom {
    -webkit-animation: animatezoom .5s;
    animation: animatezoom .5s;
}

@-webkit-keyframes animatezoom {
    from {
        -webkit-transform: scale(0);
    }

    to {
        -webkit-transform: scale(1);
    }
}

@keyframes animatezoom {
    from {
        transform: scale(0);
    }

    to {
        transform: scale(1);
    }
}