.loader-holder{
    position: relative;
    float: left;
    height: 50px;
    width: 100%;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: opacity 300ms ease-in-out;
    -moz-transition: opacity 300ms ease-in-out;
    -ms-transition: opacity 300ms ease-in-out;
    -o-transition: opacity 300ms ease-in-out;
    transition: opacity 300ms ease-in-out;
}
.loader-holder.loader-overlapping{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.7);
    z-index: 1000;
}
.loader-holder.active{
    opacity: 1;
    visibility: visible;
}
.loader,
.loader:before,
.loader:after {
    /*background: #000000;*/
    /*-webkit-animation: load1 1s infinite ease-in-out;*/
    /*animation: load1 1s infinite ease-in-out;*/
    /*width: 1em;*/
    /*height: 4em;*/
}
.loader {
    color: #000000;
    text-indent: -9999em;
    margin: 15px auto;
    position: relative;
    font-size: 7px;
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-animation-delay: -0.16s;
    animation-delay: -0.16s;
}
.loader-overlapping .loader{
    position: absolute;
    left: calc(50% - 10px);
    top: calc(50% - 5px);
}

.loader:before {
    content: ' ';
    background-image: url(../../spinner.gif);
    position: absolute;
    top: 0;
    display: block;
    width: 120px;
    height: 120px;
    background-repeat: no-repeat;
    background-size: contain;
    left: -60px!important;
}

.loader:before,
.loader:after {
    /*position: absolute;*/
    /*top: 0;*/
    /*content: '';*/
}
.loader:before {
    left: -1.6em;
    -webkit-animation-delay: -0.32s;
    animation-delay: -0.32s;
}
.loader:after {
    left: 1.6em;
}
@-webkit-keyframes load1 {
    0%,
    80%,
    100% {
        box-shadow: 0 0;
        height: 4em;
    }
    40% {
        box-shadow: 0 -2em;
        height: 5em;
    }
}
@keyframes load1 {
    0%,
    80%,
    100% {
        box-shadow: 0 0;
        height: 4em;
    }
    40% {
        box-shadow: 0 -2em;
        height: 5em;
    }
}
