// @import "../var.scss";
$loaderScale: 2em;
$loaderColor: #3ca9d1;

.loading-control {
  height: 100%;
  // min-height: 100px;
  position: relative;
  // >div {
  //   height: 100%;
  // }
  .mask {
    @include fill();
    background-color: rgba(0, 0, 0, 0.1);
    z-index: 99;
  }
}
.loading-container {
  // @include fill();
  // text-align: center;
  width: 100%;
  // position: relative;
  z-index: 1;
  transition: all ease 0.2s;
  pointer-events: none;
}
// .loader1 {
//   $scale: 50px;
//   width: $scale;
//   height: $scale;
//   position: absolute;
//   top: 50%;
//   left: 50%;
//   margin-top: - $scale / 2;
//   margin-left: - $scale / 2;
//   .block {
//     width: 20px;
//     height: 20px;
//     /*border:5px solid #fff;*/
//     position:absolute;
//     &:nth-child(1) {
//       top: 0;
//       left: 0;
//       right: auto;
//       bottom: auto;
//       -webkit-animation: top-left 3s infinite;
//       background-color: #00aacf;
//     }
//     &:nth-child(2) {
//       top: 0;
//       left: 25px;
//       right: auto;
//       bottom: auto;
//       -webkit-animation: top-right 3s infinite;
//       background-color: #f6c574;
//     }
//     &:nth-child(3) {
//       top: 25px;
//       left: 0;
//       right: auto;
//       bottom: auto;
//       -webkit-animation: bottom-left 3s infinite;
//       background-color: #fc5652;
//     }
//     &:nth-child(4) {
//       top: 25px;
//       left: 25px;
//       right: auto;
//       bottom: auto;
//       -webkit-animation: bottom-right 3s infinite;
//       background-color: #00b3a0;
//     }
//   }
// }

// @-webkit-keyframes top-left {
//   0%  { left: 0; top:0; }
//   25% { left: 25px; top:0; -webkit-transform: rotate(90deg) }
//   50% { left: 25px; top: 25px; -webkit-transform: rotate(180deg) }
//   75% { left: 0; top: 25px; -webkit-transform: rotate(270deg) }
//   100%  { left: 0; top:0; -webkit-transform: rotate(360deg) }
// }
// @-webkit-keyframes top-right {
//   0% { left: 25px; top:0; }
//   25% { left: 25px; top: 25px; }
//   50% { left: 0; top: 25px; }
//   75%  { left: 0; top:0; }
//   100% { left: 25px; top:0; }
// }
// @-webkit-keyframes bottom-left {
//   0% { left: 25px; top: 25px; }
//   25% { left: 0; top: 25px; -webkit-transform: rotate(90deg) }
//   50%  { left: 0; top:0; -webkit-transform: rotate(180deg) }
//   75%  { left: 25px; top:0; -webkit-transform: rotate(270deg) }
//   100% { left: 25px; top:25px; -webkit-transform: rotate(360deg) }
// }
// @-webkit-keyframes bottom-right {
//   0% { left: 0; top: 25px; }
//   25%   { left: 0; top:0; }
//   50% { left: 25px; top:0; }
//   75% { left: 25px; top: 25px; }
//   100% { left: 0; top: 25px; }
// }