/* line 1, ../sass/preloader.scss */
html {
  height: 100%;
  width: 100%;
}

/* line 5, ../sass/preloader.scss */
body {
  -webkit-font-smoothing: antialiased;
  height: 100%;
  min-width: 320px;
  width: 100%;
}
/* line 11, ../sass/preloader.scss */
body.loaded {
  overflow: hidden;
}

/* Preloader 
-----------------------------------------------------------------*/
/* line 17, ../sass/preloader.scss */
.preloader {
  height: 100%;
  left: 0;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 1000;
  /* background
  --------------------------------------------------------------------------*/
}
/* line 27, ../sass/preloader.scss */
.preloader .background {
  height: 100%;
  left: 0;
  overflow: hidden;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: -1;
}
/* line 35, ../sass/preloader.scss */
.preloader .background.size-box {
  left: 10px;
  width: calc(100% - 20px);
}
/* line 40, ../sass/preloader.scss */
.preloader .background .layer {
  -webkit-background-size: cover;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-size: cover;
  height: 100%;
  left: 0;
  overflow: hidden;
  position: absolute;
  top: 0;
  width: 100%;
}

@media (max-width: 767px) {
  /* line 59, ../sass/preloader.scss */
  .travelling .preloader .background .layer {
    margin-left: 0;
    margin-right: 0;
    width: 100%;
  }
}

/* New Preloader
--------------------------------------------------------------------------------------*/
/* line 78, ../sass/preloader.scss */
.circle {
  top: 50%;
  left: 50%;
  margin-top: -15px;
  margin-left: -15px;
  color: #7fccf7;
  animation: rotate 1s linear infinite;
  width: 30px;
  height: 30px;
  position: absolute;
  clip: rect(0, 34px, 34px, 17px);
}
/* line 102, ../sass/preloader.scss */
.circle::after {
  content: '';
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  border: 2px solid #b8c9d0;
  border-radius: 50%;
  position: absolute;
  clip: rect(3px, 34px, 34px, 17px);
  animation: clip 1s linear infinite;
}
/* line 108, ../sass/preloader.scss */
.circle::before {
  content: '';
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  border: 2px solid #b8c9d0;
  border-radius: 50%;
  position: absolute;
  clip: rect(0, 34px, 34px, 17px);
  animation: clip-reverse 1s linear infinite;
}

@keyframes clip {
  50% {
    clip: rect(30px, 34px, 34px, 17px);
    animation-timing-function: ease-in-out;
  }
}
@keyframes clip-reverse {
  50% {
    clip: rect(0, 34px, 6px, 17px);
    animation-timing-function: ease-in-out;
    transform: rotate(135deg);
  }
}
@keyframes rotate {
  from {
    transform: rotate(0);
    animation-timing-function: ease-out;
  }
  45% {
    transform: rotate(18deg);
    color: #3899ec;
  }
  55% {
    transform: rotate(54deg);
  }
  to {
    transform: rotate(360deg);
  }
}