/* =======================================================================

                              *Standard masks*

   ===================================================================== */
/*************************************************************************/
/*=== mask === */
/*-- This code is for mask over all web content which will be 
fade out when your webpage get loaded. 
 --*/
#mask {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  /* you can change color of mask here*/
  background: #ffffff;
  z-index: 9999;
  /* makes sure it stays on top */
}

/*=== extra preloading text=== */
/** this code can be use for adding loading text under preloader */
#laoding_text {
  display: block;
  position: absolute;
  font-family: sans-serif,arial;
  top: 50%;
  left: 50%;
  height: 50px;
  width: 50px;
  margin: 50px 0 0 -25px;
  padding: 2px 0;
}


/**===== circle1 =====*/
#circle1 {
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  height: 50px;
  width: 50px;
  margin: -25px 0 0 -25px;
  border: 4px rgba(0, 0, 0, 0.25) solid;
  border-top: 4px #0066CC solid;
  border-bottom: 4px #0066CC solid;
  border-radius: 50%;
  -webkit-animation: spin1 1s infinite linear;
          animation: spin1 1s infinite linear;
}

@-webkit-keyframes spin1 {
  from {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(359deg);
            transform: rotate(359deg);
  }
}
@keyframes spin1 {
  from {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(359deg);
            transform: rotate(359deg);
    -webkit-transform: rotate(359deg);
            transform: rotate(359deg);
  }
}
/** END of circle1 */