.weebex-loader {
    background: #fff;
    overflow: hidden;
    position: fixed;
    left: 0;
    top: 0;
    right:0;
    bottom:0;
    z-index: 1000;
    opacity: 0.9;
}

.weebex-preloader {
    background-image: url(../images/logo.png);
    background-position: 50% 40%;
    background-repeat: no-repeat;
    background-size: 310px;
    width: 100%;
    height: 100%;
}

.loader {
    width: 60px;
    height: 60px;
    border-radius: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -25px;
}

.circle {
  width: 100%;
  height: 100%;
  position: absolute;
}
.circle .inner {
  width: 100%;
  height: 100%;
  border-radius: 100%;
  border: 3px solid #f10f1a;
  border-right: none;
  border-top: none;
  box-shadow: inset 0 0 5px #ffffff;
}

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

@keyframes spin {
  from {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
}
to {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
}
}
.circle:nth-of-type(0) {
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
}
.circle:nth-of-type(0) .inner {
  -webkit-animation: spin 2s infinite linear;
  animation: spin 2s infinite linear;
}

.circle:nth-of-type(1) {
  -webkit-transform: rotate(70deg);
  transform: rotate(70deg);
}
.circle:nth-of-type(1) .inner {
  -webkit-animation: spin 2s infinite linear;
  animation: spin 2s infinite linear;
}

.circle:nth-of-type(2) {
  -webkit-transform: rotate(140deg);
  transform: rotate(140deg);
}
.circle:nth-of-type(2) .inner {
  -webkit-animation: spin 2s infinite linear;
  animation: spin 2s infinite linear;
}

.loader {
  -webkit-animation: spin 5s infinite linear;
  animation: spin 5s infinite linear;
}