.loaderbody

{

  width: 100%;position: fixed;z-index: 99999;background-color: #ffffff;height: 100%;

}
.load-wrapp {
    width: 238px;
    height: 100px;
    margin: 17% auto;
    padding: 20px 20px 20px;
    border-radius: 5px;
    text-align: center;
    background-color: #ffffff;
}
.load-wrapp p {padding: 0 0 20px;}
.line {
    display: inline-block;
    width: 15px;
    height: 15px;
    border-radius: 15px;
    background-color: #4b9cdb;
}

/*chrome*/

.load-3 .line:nth-last-child(1) {

  -webkit-animation: loadingC .8s .1s linear infinite;

  -moz-animation: loadingC .8s .1s linear infinite;

  -ms-animation: loadingC .8s .1s linear infinite;

  -o-animation: loadingC .8s .1s linear infinite;

  animation: loadingC .8s .1s linear infinite;

}

.load-3 .line:nth-last-child(2) {

  -webkit-animation: loadingC .8s .2s linear infinite;

   -moz-animation: loadingC .8s .2s linear infinite;

  -ms-animation: loadingC .8s .2s linear infinite;

  -o-animation: loadingC .8s .2s linear infinite;

  animation: loadingC .8s .2s linear infinite;

}

.load-3 .line:nth-last-child(3) {

  -webkit-animation: loadingC .8s .3s linear infinite;

  -moz-animation: loadingC .8s .3s linear infinite;

  -ms-animation: loadingC .8s .3s linear infinite;

  -o-animation: loadingC .8s .3s linear infinite;

  animation: loadingC .8s .3s linear infinite;

}

.load-3 .line:nth-last-child(4) {

  -webkit-animation: loadingC .8s .4s linear infinite;

  -moz-animation: loadingC .8s .4s linear infinite;

  -ms-animation: loadingC .8s .4s linear infinite;

  -o-animation: loadingC .8s .4s linear infinite;

  animation: loadingC .8s .4s linear infinite;

}

.load-3 .line:nth-last-child(5) {

  -webkit-animation: loadingC .8s .5s linear infinite;

  -moz-animation: loadingC .8s .5s linear infinite;

  -ms-animation: loadingC .8s .5s linear infinite;

  -o-animation: loadingC .8s .5s linear infinite;

  animation: loadingC .8s .5s linear infinite;

}



@-webkit-keyframes loadingC {

    0%{

      -webkit-transform: translate(0,0);

      -moz-transform: translate(0,0);

      -ms-transform: translate(0,0);

      -o-transform: translate(0,0);

      transform: translate(0,0);

    }

    50% {

      -webkit-transform: translate(0,15px);

      -moz-transform: translate(0,15px);

      -ms-transform: translate(0,15px);

      -o-transform: translate(0,15px);

      transform: translate(0,15px);

    }

    100% {

      -webkit-transform: translate(0,0);

      -moz-transform: translate(0,0);

      -ms-transform: translate(0,0);

      -o-transform: translate(0,0);

      transform: translate(0,0);

    }

}



@-moz-keyframes loadingC {

    0%{

      -webkit-transform: translate(0,0);

      -moz-transform: translate(0,0);

      -ms-transform: translate(0,0);

      -o-transform: translate(0,0);

      transform: translate(0,0);

    }

    50% {

      -webkit-transform: translate(0,15px);

      -moz-transform: translate(0,15px);

      -ms-transform: translate(0,15px);

      -o-transform: translate(0,15px);

      transform: translate(0,15px);

    }

    100% {

      -webkit-transform: translate(0,0);

      -moz-transform: translate(0,0);

      -ms-transform: translate(0,0);

      -o-transform: translate(0,0);

      transform: translate(0,0);

    }

}



@-ms-keyframes loadingC {

    0%{

      -webkit-transform: translate(0,0);

      -moz-transform: translate(0,0);

      -ms-transform: translate(0,0);

      -o-transform: translate(0,0);

      transform: translate(0,0);

    }

    50% {

      -webkit-transform: translate(0,15px);

      -moz-transform: translate(0,15px);

      -ms-transform: translate(0,15px);

      -o-transform: translate(0,15px);

      transform: translate(0,15px);

    }

    100% {

      -webkit-transform: translate(0,0);

      -moz-transform: translate(0,0);

      -ms-transform: translate(0,0);

      -o-transform: translate(0,0);

      transform: translate(0,0);

    }

}



@keyframes loadingC {

    0% {

      -webkit-transform: translate(0,0);

      -moz-transform: translate(0,0);

      -ms-transform: translate(0,0);

      -o-transform: translate(0,0);

      transform: translate(0,0);

    }

    50% {

      -webkit-transform: translate(0,15px);

      -moz-transform: translate(0,15px);

      -ms-transform: translate(0,15px);

      -o-transform: translate(0,15px);

      transform: translate(0,15px);

    }

    100% {

      -webkit-transform: translate(0,0);

      -moz-transform: translate(0,0);

      -ms-transform: translate(0,0);

      -o-transform: translate(0,0);

      transform: translate(0,0);

    }

}



   /* animation-name: loadingC;

    animation-duration: 0.8s;

    animation-timing-function: linear;

    animation-delay: 0.5s;

    animation-iteration-count: infinite;

    animation-direction: initial;

    animation-fill-mode: initial;

    animation-play-state: initial;*/

.load-3 h3

{

  display: inline-flex;font-weight: 700;

}



.span-color-1

{

  color: #038870;

}



.span-color-2

{

  color: gray;

}