@charset "utf-8";
/* CSS Document */

/* CSS3 Keyframe Animation for Rotation */
@-webkit-keyframes rotate {
  from {
    -webkit-transform: rotate(0deg);
  }
  to { 
    -webkit-transform: rotate(360deg);
  }
}
@-moz-keyframes rotate {
  from {
    -moz-transform: rotate(0deg);
  }
  to { 
    -moz-transform: rotate(360deg);
  }
}
@-o-keyframes rotate {
  from {
    -o-transform: rotate(0deg);
  }
  to { 
    -o-transform: rotate(360deg);
  }
}
@-ms-keyframes rotate {
  from {
    -ms-transform: rotate(0deg);
  }
  to { 
    -ms-transform: rotate(360deg);
  }
}
@keyframes rotate {
  from {
    transform: rotate(0deg);
  }
  to { 
    transform: rotate(360deg);
  }
}

/* CSS3 Keyframe Animation for Rotation Counter Clockwise */
@-webkit-keyframes rotate-cc {
  from {
    -webkit-transform: rotate(0deg);
  }
  to { 
    -webkit-transform: rotate(-360deg);
  }
}
@-moz-keyframes rotate-cc {
  from {
    -moz-transform: rotate(0deg);
  }
  to { 
    -moz-transform: rotate(-360deg);
  }
}
@-o-keyframes rotate-cc {
  from {
    -o-transform: rotate(0deg);
  }
  to { 
    -o-transform: rotate(-360deg);
  }
}
@-ms-keyframes rotate-cc {
  from {
    -ms-transform: rotate(0deg);
  }
  to { 
    -ms-transform: rotate(-360deg);
  }
}
@keyframes rotate-cc {
  from {
    transform: rotate(0deg);
  }
  to { 
    transform: rotate(-360deg);
  }
}


.loading { /* Outer Ring */
  margin: 100px auto;
  width: 95px;
  height: 95px;
  border-right: 5px solid #fff;
  border-top: 5px solid transparent;
  border-left: 5px solid transparent;
  border-bottom: 5px solid transparent;
  border-radius: 100px;
  -moz-border-radius: 100px;
  -webkit-border-radius: 100px;
  
  /* call rotate animation */
  -webkit-animation: rotate 2s linear 0 infinite normal;
  -moz-animation: rotate 2s linear 0s infinite normal;
  -o-animation: rotate 2s linear 0 infinite normal;
  -ms-animation: rotate 2s linear 0 infinite normal;
  animation: rotate 2s linear 0 infinite normal;
  
}
  .loading-medium { /* Middle Ring */
    margin: 15px auto;
    display: block;
    width: 75px;
    height: 55px;
    border-right: 5px solid #fff;
    border-top: 5px solid transparent;
    border-left: 5px solid transparent;
    border-bottom: 5px solid transparent;
    border-radius: 80px;
    -moz-border-radius: 80px;
    -webkit-border-radius: 80px;    
    
    /* call rotate animation */
    -webkit-animation: rotate 2s linear 0 infinite normal;
    -moz-animation: rotate 2s linear 0s infinite normal;
    -o-animation: rotate 2s linear 0 infinite normal;
    -ms-animation: rotate 2s linear 0 infinite normal;
    animation: rotate 2s linear 0 infinite normal;
    
  }
    .loading-small { /* Inner Ring */
      margin: 15px auto;
      display: block;
      width: 55px;
      height: 15px;
      border-right: 5px solid #fff;
      border-top: 5px solid transparent;
      border-left: 5px solid transparent;
      border-bottom: 5px solid transparent;
      border-radius: 60px;
      -moz-border-radius: 60px;
      -webkit-border-radius: 60px;    
      
      /* call rotate animation */
      -webkit-animation: rotate 2s linear 0 infinite normal;
      -moz-animation: rotate 2s linear 0s infinite normal;
      -o-animation: rotate 2s linear 0 infinite normal;
      -ms-animation: rotate 2s linear 0 infinite normal;
      animation: rotate 2s linear 0 infinite normal;
    }
.loading.cc,
.loading-medium.cc,
.loading-small.cc {
  /* call rotate Counter Clockwise animation */
  -webkit-animation: rotate-cc 2s linear 0 infinite normal;
  -moz-animation: rotate-cc 2s linear 0s infinite normal;
  -o-animation: rotate-cc 2s linear 0 infinite normal;
  -ms-animation: rotate-cc 2s linear 0 infinite normal;
  animation: rotate-cc 2s linear 0 infinite normal;   
}
.loading.slow,
.loading-medium.slow,
.loading-small.slow {
  /* call rotate Counter Clockwise animation */
  -webkit-animation: rotate 3s linear 0 infinite normal;
  -moz-animation: rotate 3s linear 0s infinite normal;
  -o-animation: rotate 3s linear 0 infinite normal;
  -ms-animation: rotate 3s linear 0 infinite normal;
  animation: rotate 3s linear 0 infinite normal;   
}


