/* File Created: October 7, 2014 */
/*-----------Div Loading-----------------------*/
.spinner {
width: 21px;
margin: 0px auto;
position: relative;
border-style: solid;
border-color: rgba(0, 0, 0, 0) #3C8DBC  #3C8DBC  #3C8DBC;
height: 21px;
animation: 0.6s linear 0s normal none infinite rotation;
-webkit-animation: 0.6s linear 0s normal none infinite rotation;
border-width: 2px;
border-radius: 21px;
}

@-webkit-keyframes rotation {
from {-webkit-transform: rotate(0deg);}
to {-webkit-transform: rotate(359deg);}
}

@-moz-keyframes rotation {
from {-moz-transform: rotate(0deg);}
to {-moz-transform: rotate(359deg);}
}

@-o-keyframes rotation {
from {-o-transform: rotate(0deg);}
to {-o-transform: rotate(359deg);}
}

@keyframes rotation {
from {transform: rotate(0deg);}
to {transform: rotate(359deg);}
}


/*-------------------bar----------------*/
.loaderBar { width:32px; height:32px; }
 
/* Initial state */
.barloading {
    background-color:#99aaca; border:1px solid #96a6c9; float:left;
    margin-right:4px; margin-top:6px; width:6px; height:18px;
    
    /* Set the animation properties */
    animation-duration: 1s;
    animation-iteration-count: infinite;
    animation-name: loadingbar;
}
 
/* Delay both the second and third bar at the start */
.loaderBar .barloading:nth-child(2) { animation-delay: 0.1s; }
.loaderBar .barloading:nth-child(3) { animation-delay: 0.2s; }
.loaderBar .barloading:nth-child(4) { animation-delay: 0.3s; }
.loaderBar .barloading:nth-child(5) { animation-delay: 0.4s; }
.loaderBar .barloading:nth-child(6) { animation-delay: 0.5s; }

 
/* The actual animation */
@keyframes loadingbar {
     0% { }
    10% { margin-top:5px; height:22px; border-color:#d1d8e6; background-color:#bac5db; }
    20% { margin-top:0px; height:32px; border-color:#d1d7e2; background-color:#c6ccda; }
    30% { margin-top:1px; height:30px; border-color:#d1d8e6; background-color:#bac5db; }
    40% { margin-top:3px; height:26px; }
    50% { margin-top:5px; height:22px; }
    60% { margin-top:6px; height:18px; }
    70% { }
    /* Missing frames will cause the extra delay */
    100% { }
}