*{
	padding: 0;
	margin: 0;
	border: 0;
}
*,*:before,*:after{
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
:focus,:active{outline: none;}
a:focus,a:active{outline: none;}



html,body{
	scroll-behavior: smooth; /* Плавный скрол */
	position: relative;
	height: 100%;
	width: 100vw;
    margin-right: 5px;
	font-size: 100%;
	line-height: 1;
	font-size: 14px;
	-ms-text-size-adjust: 100%;
	-moz-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
	background-attachment: fixed;
	
}

body{
overflow: hidden;
background-color: #E3D7D7;
/* background-image: url('../img/fon.jpg');    
background-position: right top;
background-size:cover;
background-repeat: no-repeat; */

}



input,button,textarea{font-family:inherit;}

input::-ms-clear{display: none;}
button{cursor: pointer;}
button::-moz-focus-inner {padding:0;border:0;}
a, a:visited{text-decoration: none;}
a:hover{text-decoration: none;}
ul li{list-style: none;}
img{vertical-align: top;}


@font-face {
	font-family: VinqueRg-Regular;
	src: url('../fonts/Roboto.ttf');
	font-weight: normal;
	font-style:normal; 
}

@font-face {
	font-family: Roboto;
	src: url('../fonts/Roboto.ttf');
	font-weight: normal;
	font-style:normal; 
}
.zast{
	position: relative;
	top:0;
	left: 0;
	z-index: 99;
	background-image: url('../img/cosmos31.jpg');     
	background-size:cover;
	background-attachment: fixed;
	background-position: right top;
	width: 100vw;
	height: 100vh;
	font: 40px Roboto;
	color: #fff;
	padding: 17vh 5vw;
	text-align: center;
	line-height: 1.5;
	display: none;
	
	

}

h1{
	font:90px VinqueRg-Regular ;
	color:aqua;
	text-align: center;
	font-weight: bold;
	padding-top:18vh;
}

.panel_avtor{
	display: flex;
	justify-content: space-around;
}

.a_avtor{
	font-size: 24px;
	color:rgb(223, 226, 19);
}


label{
	font:24px VinqueRg-Regular ;
	color:rgb(241, 248, 248);
	
}

.login_flex{
display: flex;
flex-direction: column;
margin:20vh auto;
width: 50vw;
height: 40vh;
justify-content: space-between;
}

.login{
	width: 80%;
	height: auto;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	align-items: center;
	
}

input{
	width: 60%;
	height: 100%;
}

@keyframes gradient {
	0% {
		background-position: 0% 50%;
	}
	50% {
		background-position: 100% 50%;
	}
	100% {
		background-position: 0% 50%;
	}
}

.submit{
	width: 40%;
	height: 20%;
	margin:0 auto;
 	background-color: #40874A;
 	color: #fff;
 	text-align: center;
 	font: 20px VinqueRg-Regular;
 	/* line-height: 3; */
 	cursor: pointer;
 	background: linear-gradient(-45deg,  #36065F, #F1E308, #e73c7e, #82CDF0, #23a6d5, #ee7752, #23d5ab);
	background-size: 400% 400%;
	animation: gradient 15s ease infinite;
	box-shadow: 0px 8px 5px #444;
	border: #69A2A6 3px solid;
 }


.dialog{
display: flex;
flex-direction: column;
justify-content: space-between;
width: 40vw;
height: 20vh;
margin:30vh auto;
}

.dialog_txt-span{
    font-size:45px;
    color:#fff;
}

.dialog_txt{
	font:30px VinqueRg-Regular;
	font-weight: bold;
	color:#36065F;
}

.span{
	color:#022324;
	font-size: 40px;
}

.text_error{
	font: 18px VinqueRg-Regular;
	color:#fff;
	text-align: center;
	font-weight: bold;
}

.color_exit{
    color:#04072F;
} 




@import url("https://fonts.googleapis.com/css?family=Poppins:200,300,400,500,600,700,800,900");

section {
  position: absolute;
  width: 100%;
  height: 100vh;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
}
section video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
section h2 {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.97);
  font-size: 120px;
  text-align: center;
  text-transform: uppercase;
  color: #fff;
  mix-blend-mode: multiply;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  font-weight: 800;
  
}
section h2  a {
  font-size: 40px;
  color: #fff;
}

section h2  span{
   font-size: 20px;
   color: #fff;
}

.fier_flex{
    display:flex;
    width:80vw;
    height:auto;
    justify-content:space-between;
    margin-top:10vh;
    margin-bottom:20vh;
    
}



.loader {
    background: #000;
    background: radial-gradient(#222, #000);
    bottom: 0;
    left: 0;
    overflow: hidden;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 99999;
    
}

.loader-inner {
    bottom: 0;
    height: 69vh;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    top: 0;
     width:70vw;
     
    
}

.loader-line-wrap {
    animation: 
		spin 2000ms cubic-bezier(.175, .885, .32, 1.275) infinite
	;
    box-sizing: border-box;
    height: 36%;
    left: 15%;
    transform:translate(-50%,0);
    overflow: hidden;
    position: absolute;
    top: 20%;
    transform-origin: 50% 100%;
    width: 60%;
    
}
.loader-line {
    border: 4px solid transparent;
    border-radius: 100%;
    box-sizing: border-box;
    height: 100px;
    left: 0;
    margin: 0 auto;
    position: absolute;
    right: 0;
    top: 0;
    width: 100px;
    
    
}
.loader-line-wrap:nth-child(1) { animation-delay: -50ms; }
.loader-line-wrap:nth-child(2) { animation-delay: -100ms; }
.loader-line-wrap:nth-child(3) { animation-delay: -150ms; }
.loader-line-wrap:nth-child(4) { animation-delay: -200ms; }
.loader-line-wrap:nth-child(5) { animation-delay: -250ms; }

.loader-line-wrap:nth-child(1) .loader-line {
    border-color: hsl(0, 80%, 60%);
    height: 90px;
    width: 90px;
    top: 7px;
}
.loader-line-wrap:nth-child(2) .loader-line {
    border-color: hsl(60, 80%, 60%);
    height: 76px;
    width: 76px;
    top: 14px;
}
.loader-line-wrap:nth-child(3) .loader-line {
    border-color: hsl(120, 80%, 60%);
    height: 62px;
    width: 62px;
    top: 21px;
}
.loader-line-wrap:nth-child(4) .loader-line {
    border-color: hsl(180, 80%, 60%);
    height: 48px;
    width: 48px;
    top: 28px;
}
.loader-line-wrap:nth-child(5) .loader-line {
    border-color: hsl(240, 80%, 60%);
    height: 34px;
    width: 34px;
    top: 35px;
}

@keyframes spin {
    0%, 15% {
		transform: rotate(0);
	}
	100% {
		transform: rotate(360deg);
	}
}





#nilam, .span_loader {
  color: #e8dfdf;
  text-shadow: 0px -2px 4px #f3eeee, 0px -2px 10px #7f8007, 0px -10px 20px #b98435, 0px -20px 40px #80380d;
  font-size: 100px;
  text-align:center;
  margin-top:6vh;
  
}

.span_loader{
  
  font-size:16px;
  margin-top:70vh;
}









@media only screen and (max-device-width: 890px) {
section h2 a {
  font-size: 24px;
  
}
}
@media only screen and (max-device-width: 750px) {

section h2{
    font-size:90px;
}

.submit{
font-size: 15px ;
}

input{
	width: 60%;
}

.login_flex{
width: 70vw;
}

}

@media only screen and (max-device-width: 540px) {

section h2{
    font-size:70px;
}

section h2 a {
  font-size: 20px;
  
}

}
@media only screen and (max-device-width: 480px) {
.submit{
font-size: 12px ;
}

h1{
	font-size:70px;
}

.login_flex{
width: 90vw;
}

	}


	@media only screen and (max-device-width: 430px) {
.zast{
	display: block;
}

#nilam{
    font-size:90px;
}


}



@media only screen and (max-device-width: 380px) {
.zast{
	font-size: 30px;
}

#nilam{
    font-size:70px;
}

}

@media only screen and (max-device-height: 530px) {

  
  
  #nilam{
      font-size:60px;
} 

.loader-line-wrap {
    
    top: 25%;
    
    
}

}


@media only screen and (max-device-height: 430px) {

h1{
	padding-top:0;
}

.dialog{
	width: 70vw;
}

section h2{
    font-size:100px;
}

}


@media only screen and (max-device-height: 370px) {

h1{
	margin: 3vh;
}

.submit{
	width: 60%;
	height: 30%;
}

.span_loader{
  
  margin-top:50vh;
} 

.loader-line-wrap {
    
    top: 30%;
    
}
.dialog{
margin:10vh auto;
}

section h2{
    font-size:60px;
   
}

.text_error{
    margin-top:-10vh;
}
}