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

@keyframes spin {
  0% {
    transform: rotate(0deg); }
  to {
    transform: rotate(360deg); } }

html.brk-preloader:before, html.brk-preloader:after {
  position: fixed !important; }

html.brk-preloader:before {
  transition-duration: 1s;
  z-index: 1002; }

html.brk-preloader:after {
  transition-duration: .5s;
  z-index: 1003; }

html.brk-preloader:after {
  width: 60px;
  height: 60px;
  background: url(../../img/page-preloader.gif) no-repeat center center;
  background-size: contain; }

.brk-preloader {
  position: relative;
  overflow: hidden;
  height: 100vh; }
  [data-x-mode="true"] .brk-preloader {
    overflow: visible;
    height: auto; }
  .brk-preloader.brk-preloader-remove {
    overflow: visible; }
    .brk-preloader.brk-preloader-remove:before, .brk-preloader.brk-preloader-remove:after {
      opacity: 0;
      visibility: hidden; }
  .brk-preloader:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    opacity: 1;
    visibility: visible;
    transition-property: opacity, visibility;
    background-color: #fff; }
    [data-x-mode="true"] .brk-preloader:before {
      display: none; }
  .brk-preloader:after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 77px;
    height: 77px;
    background: url(../../img/preloader.gif) no-repeat center center;
    background-size: contain;
    opacity: 1;
    visibility: visible;
    transition-property: opacity;
    z-index: 2; }
    [data-x-mode="true"] .brk-preloader:after {
      display: none; }

.brk-loader {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #fff;
  z-index: 99999;
  transition: all .3s; }
  .brk-loader-remove {
    opacity: 0;
    visibility: hidden; }
  .brk-loader__loader {
    display: block;
    position: relative;
    left: 50%;
    top: 50%;
    width: 150px;
    height: 150px;
    margin: -75px 0 0 -75px;
    border-radius: 50%;
    border: 3px solid transparent;
    border-top-color: #2775ff;
    -webkit-animation: spin 2s linear infinite;
    animation: spin 2s linear infinite; }
    .brk-loader__loader:after, .brk-loader__loader:before {
      content: "";
      position: absolute;
      top: 5px;
      left: 5px;
      right: 5px;
      bottom: 5px;
      border-radius: 50%;
      border: 3px solid transparent;
      border-top-color: #7202bb;
      -webkit-animation: spin 3s linear infinite;
      animation: spin 3s linear infinite; }
    .brk-loader__loader:after {
      top: 15px;
      left: 15px;
      right: 15px;
      bottom: 15px;
      border-top-color: #b50aff;
      -webkit-animation: spin 1.5s linear infinite;
      animation: spin 1.5s linear infinite; }