.catalog-loading {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: rgba(0,0,0,.8);
}

.catalog-loading-container {
    position: relative;
    margin: 0 auto;
    padding-top: 50vh;
    width: 110px;
}

    .catalog-loading-container div {
        height: 20px;
        width: 20px;
        border-radius: 50%;
        background: black;
        float: left;
        margin: 0 3px;
        background: #005690;
    }

    .catalog-loading-container .ball1 {
        z-index: 1;
        -moz-animation: bounce 1.5s infinite ease-in-out;
        -webkit-animation: bounce 1.5s infinite ease-in-out;
    }

    .catalog-loading-container .ball2 {
        -moz-animation: bounce 1.5s infinite ease-in-out;
        -webkit-animation: bounce 1.5s infinite ease-in-out;
        -webkit-animation-delay: 0.25s;
        animation-delay: 0.25s;
    }

    .catalog-loading-container .ball3 {
        -moz-animation: bounce 1.5s infinite ease-in-out;
        -webkit-animation: bounce 1.5s infinite ease-in-out;
        -webkit-animation-delay: 0.5s;
        animation-delay: 0.5s;
    }

    .catalog-loading-container .ball4 {
        -moz-animation: bounce 1.5s infinite ease-in-out;
        -webkit-animation: bounce 1.5s infinite ease-in-out;
        -webkit-animation-delay: 0.75s;
        animation-delay: 0.75s;
    }

    @-moz-keyframes bounce {
        0%,15% {
            -moz-transform: translate(0,0);
        }

        50% {
            -moz-transform: translate(0,-30px);
        }

        85%, 100% {
            -moz-transform: translate(0,0);
        }
    }

    @-webkit-keyframes bounce {
        0%,20% {
            -webkit-transform: translate(0,0);
        }

        50% {
            -webkit-transform: translate(0,-30px);
        }

        80%, 100% {
            -webkit-transform: translate(0,0);
        }
    }