@font-face{
  font-family: "Times New Roman";
  src: url(fonts/Times New Roman.ttf) format(truetype);
}
* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

body {
  font-size: 16px;
  line-height: 22px;
  font-family: "Times New Roman", serif;

}
.body-lila {
  background: #000 url(imgs/000.jpg) no-repeat;
  background-size: 100% 100%;
}
.container {
  max-width: 1200px;
  margin: 0 auto;
  box-shadow: 0px 0px 20px 15px rgba(1, 1, 1, 0.7);
}

.lila-header {
  display: flex;
  flex-direction: column;
  max-width: 100%;
  background: #000;
  overflow: visible;

}



.header-fon {
  height: 300px;
  background: url(imgs/logo-up.jpg) no-repeat;
  background-size: 100% 100%;
}

.logo {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 450px;
  background: #000;
  border-top: 5px solid #000;
  border-bottom: 5px solid #000;
  background: url(imgs/logo-down.jpg) no-repeat;
  background-size: 100% 100%;

}


.lila {
  font-size: 9em;
  letter-spacing: 20px;
  color: #fff;
  animation: blur 1s ease-out infinite;
  text-shadow: 0 0 5px #000, 0 0 7px #724481;
}

@keyframes blur {
  from {
    text-shadow:0px 0px 10px #fff,
      0px 0px 10px #fff,
      0px 0px 20px #fff,
      0px 0px 20px #fff,
      0px 0px 20px #fff,
      0px 0px 20px #fff,
      0px 0px 20px #fff,
      0px 0px 20px #fff,
      0px 0px 40px #fff,
      0px 0px 40px #fff,
      0px 0px 40px rgba(241, 53, 47,.7),
      0px 0px 100px rgba(241, 53, 47,.7),
      0px 10px 70px rgba(241, 53, 47,.7),
      0px 10px 70px rgba(241, 53, 47,.7),
      0px 10px 70px rgba(241, 53, 47,.7),
      0px 10px 70px rgba(241, 53, 47,.7),
      0px -10px 70px rgba(241, 53, 47,.7),
      0px -10px 70px rgba(241, 53, 47,.7);
  }
}

.login {

  text-decoration: none;
  color: #ec4e50;
}

.login:hover {
  color: #d0effc;
  animation: blurH 0.5s ease-out infinite;
  text-shadow: 0 0 5px #000, 0 0 7px #eb514c;
}

@keyframes blurH {
  from {
    text-shadow:0px 0px 10px #fff,
      0px 0px 10px #000,
      0px 0px 20px #000,
      0px 0px 20px #000,
      0px 0px 20px #000,
      0px 0px 20px #000,
      0px 0px 20px #000,
      0px 0px 20px #000,
      0px 0px 40px #000,
      0px 0px 40px #000,
      0px 0px 40px #5377c8,
      0px 0px 90px #5377c8,
      0px 10px 70px #5377c8,
      0px 10px 70px #5377c8,
      0px 10px 70px #5377c8,
      0px 10px 70px #5377c8,
      0px -10px 70px #5377c8,
      0px -10px 70px #5377c8;
  }
}

.login:active {
  color: #000;
  animation: blurA 0.5s ease-out infinite;
  text-shadow: 0 0 5px #000, 0 0 7px #fff;
}

@keyframes blurA {
  from {
    text-shadow:0px 0px 10px #fff,
      0px 0px 10px #fff,
      0px 0px 20px #fff,
      0px 0px 20px #fff,
      0px 0px 20px #fff,
      0px 0px 20px #fff,
      0px 0px 20px #fff,
      0px 0px 20px #fff,
      0px 0px 40px #fff,
      0px 0px 40px #fff,
      0px 0px 40px #000,
      0px 0px 80px #000,
      0px 10px 70px #000,
      0px 10px 70px #000,
      0px 10px 70px #000,
      0px 10px 70px #000,
      0px -10px 70px #000,
      0px -10px 70px #000;
  }
}


.enter-login{
  position: absolute;
  top: 120px;
  left: 47%;
  z-index: 30;
  display: none;
  width: 530px;
  margin-left: -230px;
  padding: 40px 80px;
  color: #000000;
  background: #f8f3f0 url(imgs/logo-form.jpg) no-repeat;
  background-size: 100% 100%;
  box-shadow: 0 30px 50px rgba(0,0,0,0.7);
  border: 3px solid #000;
}

.close{
  position: absolute;
  top: 1px;
  left: 48%;
  width: 22px;
  height: 22px;
  font-size: 0;
  border: 0;
  outline: 0;
  cursor: pointer;
  background-color: transparent;

}
.close::before,
.close::after{
  content: "";
  position: absolute;
  top: 10px;
  left: 2px;
  width: 19px;
  height: 3px;
  background-color: #fff;
  border-radius: 5px;
  border: 1px solid #000;

}
.close::before{
  transform: rotate(-45deg);
}
.close::after{
  transform: rotate(45deg);
}

.enter-login h2{
  margin: 0;
  margin-bottom: 26px;
  font-size: 28px;
  line-height: 28px;
  color: #eb514c;
  text-align: center;
  text-shadow: 1px 1px 1px #000;
}

.login-form{

  margin-bottom: -20px;
}
.login-form input[type="text"],
.login-form input[type="password"]{
  width: 363px;
  margin: 0;
  margin-bottom: 10px;
  padding: 10px 20px;
  padding-right: 40px;
  font-size: 14px;
  line-height: 24px;
  text-transform: uppercase;
  color: #fff;
  background-color: #f9f6f3;
  border: 2px solid #58555c;
  outline: none;
}
.login-form input:focus{
  border-color: #fff;
}
.login-form input.user,
.login-form input.password{
  background-color: transparent;
}

.bth{
  display: inline-block;
  margin-right: 16px;
  padding: 10px 33px;
  color: #abc;
  background: transparent;
  border: none;
  outline: none;
  cursor: pointer;
  font-weight: 500;
  font-size: 16px;
  line-height: 22px;
  text-transform: uppercase;
  text-decoration: none;
  vertical-align: top;
  text-align: center;
  border:2px solid #abc;
}
.bth:hover{
  background-color: #000;
  color: #fff;
  border:2px solid #fff;
}
.bth:active {
  box-shadow: inset 0px 0px 0px 3px;
  background-color: #ea514c;
  border:2px solid #ea514c;
  color: #000;

}
.login-form .bth{
  width: 100%;
  margin-top: 15px;
}



.show0{
  display: block;
  animation: bounceq 0.6s, bounceqq 0.7s;
}
.error{
  animation: shake 0.6s;
}

@keyframes bounceq{
   0% { opacity: 0; }
 20% { opacity: 0.2; }
 40% { opacity: 0.4; }
 60% { opacity: 0.6; }
  80% { opacity: 0.8; }
 100% { opacity: 1; }
}

@keyframes bounceqq{
  0% {transform: translateY(-2000px);}
  70% {transform: translateY(100px);}
  90% {transform: translateY(-30px);}
  100% {transform: translateY(10px);}
}

@keyframes shake{
  0%, 100% {transform: translateX(0);}
  10%, 30%, 50%, 70%, 90% {transform: translateX(-10px);}
  20%, 40%, 60%, 80% {transform: translateX(10px);}
}

@keyframes fade {
 0% { opacity: 0; }
 11.11% { opacity: 1; }
 33.33% { opacity: 1; }
 44.44% { opacity: 0; }
 100% { opacity: 0; }
}


.lila-main {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  min-height: 1000px;
  background: #000 url(imgs/index-main-fon.jpg) no-repeat;
  background-size: 100% 100%;
  vertical-align: bottom;

}

.game {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 847px;
  height: 664px;
  background: url(imgs/index-game.jpg) no-repeat;
  /*background-size: contain;*/
  border: 5px solid #000;
}

.lila-navigation {
 margin-top: -357px;
 width: auto;
 text-align: center;
}

.lila-navigation a{
  text-decoration: none;
}

.lila-navigation ul{
  /*margin: 0;
  padding: 0;*/
  list-style: none;
}

.lila-navigation li{
  margin-top: 50px;
  font-size: 66px;
  line-height: 22px;

}

/*
.FAQ {
  font-size: 66px;
}

/*.FAQ a {
  color: #fff;
  text-shadow: 0px 0px 5px #0042d4, 0px 0px 6px #00abff;


}

.FAQ a:hover {
  /*animation: blurz .75s ease-out infinite;
  text-shadow: 0 0 5px #abc, 0 0 7px #abc;
}

@keyframes blurzz {
  from {
    text-shadow:0px 0px 10px #fff,
      0px 0px 10px #ffbc9e,
      0px 0px 20px #ffbc9e,
      0px 0px 20px #ffbc9e,
      0px 0px 20px #ffbc9e,
      0px 0px 20px #ffbc9e,
      0px 0px 20px #ffbc9e,
      0px 0px 20px #ffbc9e,
      0px 0px 40px #ffbc9e,
      0px 0px 40px #ffbc9e,
      0px 0px 40px rgba(239,140,124,.7),
      0px 0px 100px rgba(239,140,124,.7),
      0px 10px 70px rgba(239,140,124,.7),
      0px 10px 70px rgba(239,140,124,.7),
      0px 10px 70px rgba(239,140,124,.7),
      0px 10px 70px rgba(239,140,124,.7),
      0px -10px 70px rgba(239,140,124,.7),
      0px -10px 70px rgba(239,140,124,.7);
  }
}

.lila-menu {
  font-size: 70px;
}
/*
.lila-menu a {
  color: #fff;
  /*animation: blink5 3s linear infinite;
  text-shadow: 0px 0px 5px #0042d4, 0px 0px 6px #00abff;
}

.lila-menu a:hover {
  /*animation: blurz .75s ease-out infinite;
  text-shadow: 0 0 5px #abc, 0 0 7px #abc;

}

@keyframes blink5 {
  0% { color: #0097d4; }
  50% { color: #943967; }
  75% { color: #4c1725; }
  100% { color: #0097d4; }
}

@keyframes blurz{
  from{
      text-shadow:0px 0px 10px #fff,
      0px 0px 10px #fff,
      0px 0px 25px #fff,
      0px 0px 25px #fff,
      0px 0px 25px #fff,
      0px 0px 25px #fff,
      0px 0px 25px #fff,
      0px 0px 25px #fff,
      0px 0px 50px #fff,
      0px 0px 50px #fff,
      0px 0px 50px #7B96B8,
      0px 0px 150px #7B96B8,
      0px 10px 100px #7B96B8,
      0px 10px 100px #7B96B8,
      0px 10px 100px #7B96B8,
      0px 10px 100px #7B96B8,
      0px -10px 100px #7B96B8,
      0px -10px 100px #7B96B8;}
}

.key {
  
  font-size: 58px;
}

/*.key a {
  color: #fff;
  /*text-shadow: 0px 0px 5px #ff0000, 0px 0px 6px #ff0000;
  text-shadow: 0px 0px 5px #0042d4, 0px 0px 6px #00abff;
}

.key a:hover {
  /*animation: blurz .75s ease-out infinite;
  text-shadow: 0 0 5px #abc, 0 0 7px #abc;
}
@keyframes blurzz {
  from {
    text-shadow:0px 0px 10px #fff,
      0px 0px 10px #ffbc9e,
      0px 0px 20px #ffbc9e,
      0px 0px 20px #ffbc9e,
      0px 0px 20px #ffbc9e,
      0px 0px 20px #ffbc9e,
      0px 0px 20px #ffbc9e,
      0px 0px 20px #ffbc9e,
      0px 0px 40px #ffbc9e,
      0px 0px 40px #ffbc9e,
      0px 0px 40px rgba(239,140,124,.7),
      0px 0px 100px rgba(239,140,124,.7),
      0px 10px 70px rgba(239,140,124,.7),
      0px 10px 70px rgba(239,140,124,.7),
      0px 10px 70px rgba(239,140,124,.7),
      0px 10px 70px rgba(239,140,124,.7),
      0px -10px 70px rgba(239,140,124,.7),
      0px -10px 70px rgba(239,140,124,.7);
  }
}

.help {
    font-size: 60px;
}
*/
.lila-navigation a{
    /*text-shadow: 0px 0px 5px #ff0000, 0px 0px 6px #ff0000;
    text-shadow: 0px 0px 5px #03ddff, 0px 0px 6px #1d00ff;*/
    color: #fff;
    font-weight: bold;
    text-shadow: 0px 0px 5px #8200d4, 0px 0px 6px #fd00ff;
}

.lila-navigation a:hover {
    text-shadow: 0px 0px 5px #ff0000, 0px 0px 6px #ff0000;
}

.lila-footer {
  width: 100%;
  min-height: 300px;
  background: #000 url(imgs/footer-fon.gif) no-repeat;
  background-size: 100% 100%;
  border-top: 5px solid #000;

}

.contacts {
  margin-top: 20px;
  float: right;
  width: 70px;
  height: 50px;

}

.social-btn{
  display: inline-block;
  width: 43px;
  height: 43px;
  margin: 0 2px;
  font-size: 0;
  vertical-align: top;
  text-decoration: none;
  background: /*#161616*/ transparent url("imgs/sprite.png") no-repeat;
  transition:
  background-position 0.5s,
  background-color 0.5s;
}

.social-btn-vk{
  background-position: 5px 12px;
}

.social-btn:hover{
  background-color: #ffffff;
}

.social-btn-vk:hover{
  background-position: 5px -39px;
}
.social-btn-tele{
  background: transparent url("imgs/sprite.png") no-repeat;
  background-position: -33px 9px;
}
.social-btn-tele:hover{
  background-position: -34px -39px;
}

@media (max-width: 1200px) {
  .lila-footer {
    min-height: 450px;
  }
}

/*GAME*/

.container-game {
  max-width: 1100px;
  margin: 0 auto;
  box-shadow: 0px 0px 20px 15px rgba(1, 1, 1, 0.7);

}
.body-game{
  background: #000 url(imgs/body-game.jpg) repeat;
  background-size: 100% auto;

}

.game-header {
  width: 100%;
  height: 1109px;
  background: url(imgs/game-head.jpg) no-repeat;
  background-size: 100% 100%;
  vertical-align: bottom;
}

.game-lila {
  display: flex;
  justify-content: center;
  font-size: 7em;
  letter-spacing: 20px;
  color: #24102b;
  text-align: center;
}

.game-lila a {
  margin-top: 115px;
  text-decoration: none;
  color: #551a8a;
  font-weight: bold;
}

.game-lila a:hover {
  color: #ee3a2b;
  text-shadow: 0 0 5px #000;
}

.game-lila a:active {
  color: #000;
  text-shadow: 0 0 5px #fff, 0 0 7px #724481;
}
.game-main {
  width: 100%;
  min-height: 100px;
  background: #19253f;
  border-top: 5px solid #000;

}

/*.game-main h2{
  display: inline-block;
  margin-top: 500px;
  font-size: 6em;
  text-align: center;
  color: #1e9adc;
}*/

.game-text {
  background: #272822;
  color: #4b8185;
  /*padding: 4.8% 8.5%;*/
  padding: 35px 85px;
  background: #042129;
}

.game-text h1 {
  margin-top: 20px;
  margin-bottom: 50px;
  font-size: 4em;
  line-height: 4.1rem;
  text-align: center;

}

.game-text p {
  font-size: 24px;
  line-height: 27px;
  /*text-align: justify;
  /*text-indent: 50px;*/
  margin-bottom: 45px;
}

.signature {
  margin: 50px 0 30px;
}

@media (max-width: 1100px) {
  .game-text {
    padding: 25px 45px;
  }
  .game-text p {
  /*margin-top: 50px;
  /*text-indent: 0px;*/
  font-size: 38px;
  line-height: 44px;
  max-height:1000000px;
}
}

.game-end {
  /*margin-top: -30px;*/
  background: #003837;

  /*url(imgs/zx.jpg) no-repeat;
  background-size: 100% 100%;*/

}

.game-menu {
  position: relative;
  display: block;
  width: 400px;
  margin: 0px auto;
  padding: 20px 5px 3px;
  background: #000 url(imgs/game-menu.jpg) no-repeat;
  background-size: 100% 100%;

}

.btn-game {
  margin: 0px auto 20px;
  display: block;
  padding: 20px;
  color: #fff;
  text-decoration: none;
  /*background: #9f4280;
  background: linear-gradient(#252121, #4b2230);*/
  background: linear-gradient(#042129, #003837);
  font-size: 2em;
  line-height: 2.1rem;
  font-weight: 700;
  cursor: pointer;
  border: 2px solid #000;
  outline: none;
  box-shadow: 0 2px 2px 0 #003837;
  text-shadow: 0 2px 5px rgba(0, 0, 0,.76);
  text-align: center;
}

.btn-game a {
  text-decoration: none;
  color: #fff;
}

.btn-game:hover{
  background: linear-gradient(#001, #03222a);
}

.btn-game:active{

  box-shadow: inset 0px 3px 3px 1px rgba(0,0,0,0.6);
}



.game-pic-1 {
  position: absolute;
  top: -70%;
  left: -20%;
  display: none;
  width: 526px;
  height: 604px;
  background: url(imgs/game-pic-1.jpg) no-repeat;
  background-size: 100% 100%;
  border: 5px solid #000;
}



.close-1{
  position: absolute;
  top: -30px;
  left: 50%;
  width: 22px;
  height: 22px;
  font-size: 0;
  border: 0;
  outline: 0;
  cursor: pointer;
  background-color: transparent;
}

.close-1::before,
.close-1::after{
  content: "";
  position: absolute;
  top: 10px;
  left: 2px;
  width: 19px;
  height: 3px;
  background-color: #fff;
  border-radius: 1px;
}
.close-1::before{
  transform: rotate(45deg);
}
.close-1::after{
  transform: rotate(-45deg);
}

.game-pic-2 {
  position: absolute;
  top: -10%;
  left: -45%;
  display: none;
  width: 750px;
  height: 396px;
  background: url(imgs/game-pic-2.gif) no-repeat;
  background-size: 100% 100%;
  border: 5px solid #000;
}

.close-2{
  position: absolute;
  top: -30px;
  left: 50%;
  width: 25px;
  height: 25px;
  font-size: 0;
  border: 0;
  outline: 0;
  cursor: pointer;
  border: 2px solid #fff;
  border-radius: 50%;
  background-color: transparent;
}

.close-2::before,
.close-2::after{
  content: "";
  position: absolute;
  top: 9px;
  left: 1px;
  width: 19px;
  height: 3px;
  background-color: #fff;
  border-radius: 1px;
}
.close-2::before{
  transform: rotate(45deg);
}
.close-2::after{
  transform: rotate(-45deg);
}


.game-pic-3 {
  position: absolute;
  top: -110%;
  left: -30%;
  display: none;
  width: 600px;
  height: 793px;
  background: url(imgs/game-pic-3.jpg) no-repeat;
  background-size: 100% 100%;
  border: 5px solid #000;
}

.close-3{
  position: absolute;
  bottom: 214px;
  left: 51.5%;
  width: 68px;
  height: 20px;
  font-size: 0;
  border: 2px solid #000;
  outline: 0;
  cursor: pointer;
  background-color: transparent;
  animation: accept 0.7s ease-in-out infinite;
}

@keyframes accept{
  from{
      border: 2px solid #bf4c8d;}
}

.show {
  display: block;
  animation: bounce 0.6s;
}

@keyframes bounce{
  0% {transform: translateY(-2000px);}
  70% {transform: translateY(40px);}
  90% {transform: translateY(-20px);}
  100% {transform: translateY(10px);}
}

.show-2 {
  display: block;
  animation: fade2 1s;

}

@keyframes fade2 {
 0% { opacity: 0; }
 30% { opacity: 0.3; }
 60% { opacity: 0.6; }
 90% { opacity: 0.9; }
 100% { opacity: 1; }
}



.show-3 {
  display: block;
  animation: bounce3 0.6s;
}

@keyframes bounce3{
  0% {transform: translateY(2000px);}
  70% {transform: translateY(-40px);}
  90% {transform: translateY(20px);}
  100% {transform: translateY(-10px);}
}

.game-footer {
  width: 100%;
  border-top: 5px solid #000;

}

.game-contacts {
  margin-top: -385px;

  float: right;
  width: 70px;
  height: 50px;

}

/*FAQ*/
.body-faq {
  /*background: url(imgs/faq-body-rezerf.jpg) no-repeat;*/
  background: #460829 url(imgs/faq-body.gif) no-repeat;
  background-size: 100% 100%;
}
.container-faq {
  max-width: 1100px;
  margin: 0 auto;
  box-shadow: 0px 0px 20px 15px rgba(1, 1, 1, 0.7);
}

.faq-header {
  width: 100%;
  height: 500px;
  background: url(imgs/faq-head.jpg) no-repeat;
  background-size: 100% 100%;
  vertical-align: bottom;
  border-bottom: 5px solid #000;
}

.faq-lila {
  display: flex;
  justify-content: center;
  font-size: 7em;
  letter-spacing: 20px;
}

.faq-lila a {
  margin-top: 50px;
  text-decoration: none;
  color: #000;
  font-weight: bold;
  text-shadow: 0px 0px 5px #fb0aff, 0px 0px 6px #ff0a0a;
}

.faq-lila a:hover {
  color: #000;
  text-shadow: 0 0 5px #fff, 0 0 7px #fff;
  
}

.faq-lila a:active {
  color: #ff00f7;
  text-shadow: 0 0 5px #000, 0px 0px 6px #b80aef;
}

.faq-main {
  width: 100%;
  padding-bottom: 20px;
  min-height: 100px;
  background: #270529;
  color: #ffbc9e;
  text-align: center;
  border-bottom: 5px solid #000;
}
.faq-main h1 {
  padding-top: 15px;
  font-size: 40px;
  line-height: 40px;
  text-shadow: 0 0 5px #000, 0 0 5px #000;
}

.faq-main h2 {
  padding-top: 15px;
  font-size: 33px;
  line-height: 40px;
  text-shadow: 0 0 5px #000, 0 0 5px #000;
}
.faq-main p {
  padding-top: 15px;
  font-size: 20px;
  line-height: 24px;
  text-shadow: 0 0 5px #000, 0 0 5px #000;
}

.faq-main a {
  text-decoration: none;
  color: #fb620a;
}

.faq-main a:hover {
  color: #f30df7;
}
/*
.faq-main-game {
  text-decoration: none;
  color: #fb620a;
}

.faq-main-game:hover {
  color: #f30df7;
}

.faq-main-key {
  text-decoration: none;
  color: #f00;
}

.faq-main-key:hover {
  color: #f30df7;
}
*/
@media (max-width: 1100px) {
  .faq-main {
    padding: 35px 20px 10px 20px;
  }

  .faq-main h1 {
  font-size: 60px;
  line-height: 64px;
}

  .faq-main h2 {
  font-size: 50px;
  line-height: 54px;
}

  .faq-main p {
  margin-top: 35px;
  font-size: 40px;
  line-height: 44px;
  max-height:1000000px;
}
}

.faq-footer {
  width: 100%;
  min-height: 440px;
  background: #000 url(imgs/faq-footer.jpg) no-repeat;
  background-size: 100% 100%;

}

/*KEY*/

.body-key {
  background: #fff url(imgs/key-body.jpg) repeat;
  /*background-size: 100% 100%;*/
}
.container-key {
  max-width: 1100px;
  margin: 0 auto;
  box-shadow: 0px 0px 20px 15px rgba(1, 1, 1, 0.7);
}

.key-header {
  width: 100%;
  height: 700px;
  background: url(imgs/key-head.jpg) no-repeat;
  background-size: 100% 100%;
  vertical-align: bottom;
  border-bottom: 5px solid #000;
}

.key-lila {
  display: flex;
  justify-content: center;
  font-size: 110px;
  letter-spacing: 20px;

}

.key-lila a {
  margin-top: 55px;
  text-decoration: none;
  /*color: #00b1fb;
  text-shadow: 0px 0px 5px #171037, 0px 0px 6px #000;*/
  color: #000;
  font-weight: bold;
  text-shadow: 0 0 5px #00b6ff, 0px 0px 7px #0097d4;
}

.key-lila a:hover {
  color: #000;
  text-shadow: 0 0 5px #00f9ff, 0px 0px 7px #fff;
}

.key-lila a:active {
  color: #f9fcfe;
  text-shadow: 0 0 5px #00c4ff, 0 0 7px #0097d4;
}

.key-main {
  width: 100%;
  padding: 40px 0;
  min-height: 100px;
  background: #012c39;
  color: #4fb0bb;
  text-align: center;
  border-bottom: 5px solid #000;
}
.key-main h1 {
  margin-bottom: 35px;
  font-size: 37px;
  line-height: 40px;
  text-shadow: 0 0 5px #000, 0 0 5px #000;
}

.key-main h2 {
  margin-bottom: 35px;
  font-size: 60px;
  text-shadow: 0 0 5px #000, 0 0 5px #000;
}
.key-main p {
  margin-top: 15px;
  font-size: 20px;
  line-height: 24px;
  /*text-shadow: 0 0 5px #000, 0 0 5px #000;*/
}

.key-main a {
  text-decoration: none;
  color: #fb620a;
}

.key-main a:hover {
  color: #f30df7;
}

@media (max-width: 1100px) {
  .key-main {
    padding: 35px 20px 10px 20px;
  }

  .key-main h1 {
  font-size: 60px;
  line-height: 64px;
}

.key-main p {
  margin-top: 35px;
  font-size: 40px;
  line-height: 44px;
  max-height:1000000px;
}
}

.key-footer {
  width: 100%;
  min-height: 540px;
  background: #000 url(imgs/key-footer.jpg) no-repeat;
  background-size: 100% 100%;

}

/*HELP*/

.body-help {
  background: #000 url(imgs/help-body.gif) no-repeat;
  background-size: 100% 100%;

}
.container-help {
  max-width: 1100px;
  margin: 0 auto;
  box-shadow: 0px 0px 20px 15px rgba(1, 1, 1, 0.8);
}

.help-header {
  width: 100%;
  min-height: 500px;
  background: url(imgs/help-head.gif) no-repeat;
  background-size: 100% 100%;
  vertical-align: bottom;
  border-bottom: 5px solid #000;
}

.help-lila {
  display: flex;
  justify-content: center;
  font-size: 110px;
  letter-spacing: 20px;

}

.help-lila a {
  margin-top: 155px;
  text-decoration: none;
  color: #000;
  font-weight: bold;
  text-shadow: 0 0 5px #00f9ff, 0px 0px 7px #fff;
}

.help-lila a:hover {
  color: #f9fcfe;
  text-shadow: 0 0 5px #00c4ff, 0 0 7px #0097d4;
}

.help-lila a:active {
  color: #000;
  text-shadow: 0 0 5px #ff0000, 0 0 7px #d20505;
}

.help-main {
  width: 100%;

  min-height: 100px;
  background: /*#012c39;*/ rgba(18, 96, 162, 0.7) url(imgs/help-main.gif) no-repeat;
  background-size: 100% 100%;
  color: /*#8d999c;*/ #dac5c5;
  text-align: center;
  border-bottom: 5px solid #000;
}

.help-main-fon {
  background: rgba(47, 47, 47, 0.7);
  padding: 40px 0;
}
.help-main h1 {
  margin-bottom: 35px;
  font-size: 37px;
  line-height: 40px;
  text-shadow: 0 0 5px #000, 0 0 5px #000;
}

.help-main p {
  margin-top: 15px;
  padding: 0 15px;
  font-size: 20px;
  line-height: 24px;
  text-shadow: 0 0 5px #000, 0 0 5px #000;
}

.help-main a {
  text-decoration: none;
  color: #ddddff;
}

.help-main a:hover {
  color: #81ffff;
}

.help-footer {
  width: 100%;
  min-height: 300px;
  background: #000 url(imgs/help-footer.gif) no-repeat;
  background-size: 100% 100%;

}

@media (max-width: 1100px) {
  .help-body {
    background: #000;
    background-size: 100% 100%;
  }
  .help-lila {
    font-size: 160px;
  }
  .help-lila a {
    margin-top: 100px;
    text-shadow: 0 0 5px #546a6b, 0px 0px 7px #fff;
  }
  .help-lila a:hover {
  color: #f9fcfe;
  text-shadow: 0 0 5px #000, 0 0 7px #000;
}

.help-lila a:active {
  color: #fff;
  text-shadow: 0 0 5px #000, 0 0 7px #000;
}
  .help-main-fon {
    padding: 120px 60px;
  }

  .help-main h1 {
  font-size: 56px;
}

.help-main p {
  margin-top: 45px;
  font-size: 40px;
  line-height: 52px;
}
.help-header{
  min-height: 600px;
  background: url(imgs/help-head-mobile.jpg) no-repeat;
  background-size: 100% 100%;
}
.help-footer {
  min-height: 450px;
  background: #000 url(imgs/help-footer-mobile.jpg) no-repeat;
  background-size: 100% 100%;
}
}