@font-face {
    font-family: 'Impact';
    src: url('https://staticfr.skillcap.net/htmlGames/loto/shared/fonts/impact.eot');
    src: url('https://staticfr.skillcap.net/htmlGames/loto/shared/fonts/impact.eot?#iefix') format('embedded-opentype'),
        url('https://staticfr.skillcap.net/htmlGames/loto/shared/fonts/impact.woff2') format('woff2'),
        url('https://staticfr.skillcap.net/htmlGames/loto/shared/fonts/impact.woff') format('woff'),
        url('https://staticfr.skillcap.net/htmlGames/loto/shared/fonts/impact.ttf') format('truetype'),
        url('https://staticfr.skillcap.net/htmlGames/loto/shared/fonts/impact.svg#Impact') format('svg');
}
@font-face {
  font-family: 'Montserrat';
  src: url('https://staticfr.skillcap.net/htmlGames/loto/shared/fonts/Montserrat-Bold.eot');
  src: url('https://staticfr.skillcap.net/htmlGames/loto/shared/fonts/Montserrat-Bold.eot?#iefix') format('embedded-opentype'),
  url('https://staticfr.skillcap.net/htmlGames/loto/shared/fonts/Montserrat-Bold.woff2') format('woff2'),
  url('https://staticfr.skillcap.net/htmlGames/loto/shared/fonts/Montserrat-Bold.woff') format('woff'),
  url('https://staticfr.skillcap.net/htmlGames/loto/shared/fonts/Montserrat-Bold.ttf') format('truetype'),
  url('https://staticfr.skillcap.net/htmlGames/loto/shared/fonts/Montserrat-Bold.svg#Impact') format('svg');
}

html, body {
  padding: 0;
  margin: 0;
  background-color: #21346a;
}

@-webkit-keyframes rotateAround { /* для поддержки ранних версий браузеров */
  100% {
    -moz-transform : rotate(1turn);
    -webkit-transform : rotate(1turn);
    -ms-transform : rotate(1turn);
    transform : rotate(1turn);
  }
}
@keyframes rotateAround {
  100% { /* указываем, что к завершению анимации элемент должен совершить 2 оборота
		(кроме 5 и 6 блока - для них указана другая трансформация в описании класса
		(во избежании ошибок лучше так не делать - только для примера)) */
    -moz-transform : rotate(1turn);
    -webkit-transform : rotate(1turn);
    -ms-transform : rotate(1turn);
    transform : rotate(1turn);
  }
}

.main-content * {border: 0; margin: 0; padding: 0}
.main-content {
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    align-items: center;
    justify-content: center;
}
#content {
  clear:left;
  background-color: #1c4b90;
  align-items: center;
  justify-content: center;
  display: flex;
}
#wrongOrientation {
  position: absolute;
  width: 100%;
  height: 100%;
  background-image: url("https://static.skillcap.net/htmlGames/loto/shared/img/rotate.png");
  background-position:  50% 45%;
  background-repeat: no-repeat;
  background-color: #333232;
}
#loader {
  position: absolute;
  width: 100%;
  height: 100%;

  background-image: url("https://static.skillcap.net/htmlGames/loto/shared/img/login/pattern_fon.png");
  background-position:  50% 50%;
  background-size: 20vmin;
  background-repeat: repeat;
  background-color: #013556;
}

#static_loader {
  position: absolute;
  width: 100%;
  height: 100%;
  background-image: url("https://static.skillcap.net/htmlGames/loto/shared/img/loader/loading_ring.png");
  background-position:  100% 100%;
  background-repeat: no-repeat;
  background-size: contain; /*215px;*/
  top: 0px;
  left:0px;
  right:0px;
  bottom:0px;
}
#spin_loader {
  position: absolute;
  top: 50%; left: 50%;
  width: 45%;
  height: 45%;
  background-image: url("https://static.skillcap.net/htmlGames/loto/shared/img/loader/loading_runner_2.png");
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-size: 130%;

  -webkit-animation : rotateAround 2s linear infinite; /* для поддержки ранних версий браузеров */
  animation : rotateAround 2s linear infinite; /* имя анимации, указанное в ключевом кадре, длительность анимации, с одинаковой скоростью, бесконечно */
  transform-origin : 0% 0%; /* указывает начало координат преобразования (трансформации) элемента (первое значение ось X, второе ось Y) */
  -webkit-transform-origin : 0% 0%; /* для поддержки ранних версий браузеров */
  -moz-transform-origin : 0% 0%; /* для поддержки ранних версий браузеров */
  -ms-transform-origin : 0% 0%; /* для поддержки ранних версий браузеров */
}

#static_logo {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 70%;
  height: 40%;
  max-width: 100vmin;
  background-image: url("https://static.skillcap.net/htmlGames/loto/shared/img/login/Logo_big_RU.png");
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 100%;
}

#loader_content {
  position: relative;
  width: 35vh;
  margin-left: auto;
  margin-right: auto;
  max-width: 46vw;
  margin-top: 2vmin;
}

#loader_content:after {
  content: "";
  display: block;
  padding-bottom: 100%;
}

#text_loader {
  position: absolute;
  text-align: center;
  font-size: 7vmin;
  color: #ffffff;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 50%;
}

canvas {
  z-index: 0;
}

#error p {
  position: absolute;
  top: 280px;
  left: 280px;
  color: #ffffff;
  font-size: 48px;
}

/*# sourceMappingURL=main.css.map */