.loader-wrapper {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
vertical-align: middle;
z-index: 999;
}
.loader-wrapper .fader {
position: fixed;
background-color: rgba(0,0,0,0.1);
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 0;
}
.loader-container {
position: absolute;
top: 55%;
left: 57.7%;
background-color: rgb(255, 255, 255);
vertical-align: middle;
width: 100px;
height: 100px;
z-index: 999;
border-radius: 10px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
margin-top: -50px;
margin-left: -50px;
box-shadow: 0 2px 5px rgba(0,0,0,0.3);
-moz-box-shadow: 0 2px 5px rgba(0,0,0,0.3);
-webkit-box-shadow: 0 2px 5px rgba(0,0,0,0.3);
}
.loader, .loader:after {
border-radius: 50%;
width: 40px;
height: 40px;
}
.loader {
margin: -20px 0 0 -20px;
font-size: 5px;
position: absolute;
top: 50%;
left: 50%;
text-indent: -9999em;
z-index: 1;
border-top: 1.1em solid rgba(102, 47, 101,1);
border-right: 1.1em solid rgba(102, 47, 101,1);
border-bottom: 1.1em solid rgba(102, 47, 101,1);
border-left: 1.1em solid #ffffff;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
-webkit-animation: load8 1.1s infinite linear;
animation: load8 1.1s infinite linear;
}
@-webkit-keyframes load8 {
0% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes load8 {
0% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}