@font-face{
	font-family: "HypatiaSansPro-Regula"; 
	src: url("fonts/Roboto-Regular.ttf") format("truetype"); 
	font-style: normal; 
	font-weight: normal;
}
/*тут есть много нужных классов 
container
	container_header
	.form
		place_for_input
			input
			select
			p
		subnit_btn
main_text
footer
main_header
hov - накидывай на всё, где есть активность по нажатию
+ checkbox
+ scrollbar
+ fancybox max-width*/
html {
	padding: 0;
	margin: 0;
	width: 100%;
	min-height:100%;
	display: flex; 
	display: -webkit-flex;
	justify-content: center;
	align-items: center;
}
body {
    position: relative;
    display: flex; 
	display: -webkit-flex;	
    width:100%;
	height:max-content;
    flex-direction: column;
    margin: 0;
	padding:0;
    align-items: stretch;
    justify-content: flex-start;
	min-height: 100vh;
	flex-grow:3;
	color:#000;
	box-sizing: border-box;
	font-size:4px;
	font-family: "HypatiaSansPro-Regula"; 
}
.bg_image{
	background: url('img/bg_reg.svg');
    background-position: center center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover; 
}
.text_header{
	font-weight: 600;
	font-size: 43px;
	line-height: 28px;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	color: #47535E;
	flex-grow:3;
	padding:10px;
	box-sizing: border-box;
}
.logo{
	display: flex;
	align-items: center;
	justify-content: center;
	width:23%;
	padding:10px;
	box-sizing: border-box;
}
.logo img{
	object-fit: contain;
	width:100%;
}
.container{
	display: flex; 
	display: -webkit-flex;
	position: relative;
	width:50%;
	height:max-content;
	flex-grow: 3;
	margin: 0 auto;
	justify-content: flex-start;
	align-items: stretch;
	height:auto;
	box-sizing: border-box;
	max-height: max-content;
	min-height: 100%;
	padding:10px;
	
}
.container.page-welcome{
	width:43%;
}
.page-welcome .main_text{
	margin-bottom: 15px;
}
.main_text p,.main_text h1, .main_text h2,.main_text h3,.main_text h4,.main_text h5{
	margin:10px auto;
	text-align: center;
}
.main_text img{
	object-fit: contain;
	margin:0 auto;
	width:40%;
}
.main_text h5{
	font-size: 3.5em;
	line-height: calc(1em + 4px);
	color: #666666;
	opacity: 0.8;
}
.page-welcome .main_text p{
	margin-bottom:15px;
	font-size: 4em;
	line-height: calc(1em + 4px);
}
.page-welcome .main_text h2{
	margin-bottom:20px;
	font-size: 13.5em;
	line-height: calc(1em + 2px);
}
.page-reg .main_text p{
	margin-bottom:15px;
	font-size: 4em;
	line-height: calc(1em + 4px);
	opacity: 0.8;
}
.page-checkmail .main_text p{
	font-size: 4em;
	line-height: calc(1em + 4px);

}
.page-reg .main_text h2,.page-checkmail .main_text h2{
	font-size: 36px;
line-height: 43px;
text-align: center;

color: #999999;
}
.page-success .main_text p,.page-success .main_text h4{
	margin-bottom:15px;
	font-size: 5em;
	line-height: calc(1em + 4px);
}
.page-success .main_text h2{
	margin-bottom:20px;
	font-size: 8em;
	line-height: calc(1em + 2px);
}
.page-success .container_header img{
	object-fit: contain;
	max-width:50%;
	margin:0 auto;
}
.column{
	flex-direction: column;
}
.row{
	flex-direction: row;
}
.container_header,.main_text,.form,.place_for_input,.submit_btn,.main_header,.footer,.row{
	display: flex; 
	display: -webkit-flex;
	width:100%;
	height:auto;
	margin:0 auto;
	padding:0;
	align-items: stretch;
	justify-content: center;
	box-sizing: border-box;
	text-align:center;
	align-self: center;
	transition: 0.3s;
}
.footer{
	flex-grow: 3;
	align-items: flex-end;
	margin-top:30px;
	margin-bottom: 21px;
}
.btn_chatra{
    max-width:220px;
    width:100%;
    display:inline-flex;
    position:relative;
    background: transparent;
    border-radius: 30px;
	font-size: 16px;
	line-height: 20px;
	text-transform: uppercase;	
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    padding:5px;
    height:50px;
    transition: 0.3s;border: 1px solid #FFFFFF;
	box-sizing: border-box;
	border-radius: 30px;
    color: #000;
	outline:none;
    margin-top:10px;
	cursor: pointer;
	font-family: "HypatiaSansPro-Regula";
}
.btn_chatra img{
	height:80%;
	object-fit: contain;
	margin-left:5px;
}
.submit_btn.non_active_btn{
	opacity: 0.7;
}
.btn_chatra:hover{
	font-size:4em;
	transition: 0.3s;
}
.row{
	justify-content: space-between;
}
.page-reg .left_side,.page-reg .right_side{
	display:flex;
	width:46%;

}
.container.page-welcome .container_header{
	margin-top: 52px;
	margin-bottom: 52px;
}
.container_header img{
	object-fit: contain;
	width:100%;
}
.place_for_input,.submit_btn{
	max-width: none;
}
.place_for_input,.submit_btn{
	height:max-content;
	margin-top:10px;
	align-items: center;
	flex-direction: column;
}
.place_for_input{
	margin-bottom: 20px;
}
.submit_btn{
	height:50px;
	background: #269D98;
	border-radius: 3px;
	font-size: 4.5em;
	line-height: calc(1em + 4px);
	text-transform: uppercase;
	outline: none;
	border: none;
	font-family: "HypatiaSansPro-Regula";
	color:#fff;
}
.page-welcome .submit_btn{
	max-width: 300px;
}
.place_for_input p{
	align-self: flex-start;
	margin:0;
	margin-left: 0;
	width:100%;
	text-align: start;
	font-size:4em;
	line-height: calc(1em + 4px);
}
.place_for_input i{
	color:red;
}
.input,.select,.select option{
	width:100%;
	display: flex; 
	display: -webkit-flex;
	justify-content: center;
	align-self: center;
	align-items: stretch;
	flex-grow: 3;
	padding:10px;
	margin:0;
	border: 1px solid #BCBEC0;
	box-sizing: border-box;
	border-radius: 2px;
	outline:none;	
	height:50px;
	font-size: 15px;
	line-height: 28px;
}
.input:hover,.select:hover,.submit_btn:hover{
	cursor: pointer;
}
.submit_btn:hover{
	font-size:6em;
	transition: 0.3s;
}

.hov{
	cursor:pointer;
}
.fancybox-slide--iframe .fancybox-content {
    max-width  : 1200px;
}
body::-webkit-scrollbar {
    width: 5px;               /* ширина scrollbar */
  }
  body::-webkit-scrollbar-track {
    background: transparent;        /* цвет дорожки */
  }
  body::-webkit-scrollbar-thumb {
    background-color: #000;    /* цвет плашки */
    border-radius: 20px;       /* закругления плашки */
    border: none;  /* padding вокруг плашки */
  }
::-webkit-input-placeholder {font-size:1em;}
::-moz-placeholder          {font-size:1em;}
:-moz-placeholder           {font-size:1em;}
:-ms-input-placeholder      {font-size:1em;}

/* checkboxes */
.custom-checkbox+label{
    display: inline-flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: stretch;
	height:100%;
    user-select: none;
	width:100%;
    margin:0;
	box-sizing: border-box;
	font-size:18px;
	text-align: left;
	line-height: 20px;
}
.custom-checkbox{
    visibility: hidden;
    display: none;
}
.custom-checkbox+label::before {
    content: '';
    display: inline-block;
    width: 1.3em;
    height: 1.3em;
    flex-shrink: 0;
    flex-grow: 0;
    border-radius: 2px;
    margin-right: 0.5em;
	background: #fff;
	border: 1px solid #269D98; 
    background-position: center center;
    background-size: cover; 
    box-sizing: border-box;
    border-radius: 2px;
    min-width:24px;
    min-height:24px;
}
.place_for_input.i_cont{
	margin-top: 20px;
}
.place_for_input.t a{
	font-size: 16px;
line-height: 19px;
text-align: center;
text-decoration-line: underline;

color: #269D98;
text-align: center;
width:100%;
}
.place_for_input.i_cont.checkbox{
	margin-top: 20px;
	margin-bottom: 30px;
}
label font{
    padding-left:10px;
    padding-top:0.2em;
	font-size: 1em;
	line-height: calc(1em + 4px);
	font-size: 16px;
line-height: 19px;
letter-spacing: -0.01em;

color: #999999;
}
label a{
	font-size: 16px;
line-height: 19px;
letter-spacing: -0.01em;

color: #999999;
text-decoration: none;
}
.custom-checkbox:checked+label::before {
	background-color: #fff;
	border: 1px solid #269D98; 
    background-image: url("img/check.svg");
    object-fit: contain;
    }
/* стили при наведении курсора на checkbox */
.custom-checkbox:not(:disabled):not(:checked)+label:hover::before {
    
	background-color: #fff;
	border: 1px solid #269D98; 
    background-position: center center;
    background-size: cover; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
}
/* стили для активного состояния чекбокса (при нажатии на него) */
.custom-checkbox:not(:disabled):active+label::before {
	background-color: #fff;
	border: 1px solid #269D98; 
    background-image: url("img/check.svg");
    background-position: center center;
    background-size: cover; 
}
/* стили для чекбокса, находящегося в фокусе */
.custom-checkbox:focus+label::before {
  box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}
/* стили для чекбокса, находящегося в фокусе и не находящегося в состоянии checked */
.custom-checkbox:focus:not(:checked)+label::before {
	background-color: #fff;
	border: 1px solid #269D98; 
}
/* стили для чекбокса, находящегося в состоянии disabled */
.custom-checkbox:disabled+label::before {
	background-color: #fff;
	border: 1px solid #269D98; 
}
.input.non_field {    
    border: 2px solid #EB5757;
}
.select.non_field{
	border: 2px solid #EB5757;
}
.custom-checkbox.non_field+label::before{
    border-color: #EB5757;
}
.event_timer {
    display: flex;
    position: relative;
    flex-direction: row;
    font-style: normal;
    font-weight: normal;
    font-size: 34px;
    line-height: 48px;
    width:80%;
    margin:0 auto 0 auto;
	padding:0;
    align-items: center;
    text-align: center;
    justify-content: center;
    color: #000;
	box-sizing: border-box;
	
}
.container_item{
    display: flex;
    position: relative;
    flex-direction: column;
    align-items: center;
    text-align: center;
    justify-content: space-between;
	box-sizing: border-box;
	padding:10px;
	text-transform: uppercase;
	font-size: 18px;
line-height: 22px;
}
.page-success .main_text{
	justify-content: center;
}
.page-success .main_text p{
	margin-top:30px;
}
.event_timer_item{
	color: #0B6DCB;
    display: flex;
    font-style: normal;
    font-weight: bold;
    font-size: 55px;
	line-height: 57px;
    margin-bottom: 10px;
    justify-content: center;
    align-items: center;
    text-align: center;
	background: #FFFFFF;
	border-radius: 100px;
	width:140px;
	height:140px;	
}
.page, .mob {
	display:none;
}
.page.active{
	display:flex;
}
@media(max-width:4000px){
	body{
		font-size:8px;
	}
	.container{
		align-items: center;
	}
	.container.page-welcome{
		width:60%;
	}
	.container.page-success{
		width:100%;
	}
	.page-welcome .submit_btn,.page-checkmail .submit_btn,.page-reg .submit_btn{
		max-width: 440px;
		height:100px;
	}
	.form,.page-reg .submit_btn,.page-reg .main_text{
		max-width:600px;
	}
	.form{
		padding:60px;
		box-sizing: border-box;
		background: rgba(26, 26, 26, 0.4);
border: 1px solid #1E4543;
box-sizing: border-box;
/* bg blure */

backdrop-filter: blur(10px);
	}
	.container.page-reg{
		margin-top:50px;
	}
	.btn_chatra{
		max-width: 370px;
	}
	.container.page-welcome .container_header,.container.page-success .container_header,.page-checkmail .container_header{
		margin:42px auto;
		max-width:40%;
	}
	.container.page-reg{
		max-width:50%;
	}
}

@media(max-width:1920px){
	.container.page-reg{
		max-width:40%;
	}
	body{
		font-size:5px;
	}
	
	.page-welcome .submit_btn,.page-reg .submit_btn,.page-checkmail .submit_btn,.page-checkmail .place_for_input{
		max-width: 300px;
		height:50px;
	}
	.page-reg .submit_btn{
		max-width: 100%;
	}
	.page-success .container_header{
		width:80%;
		margin:42px auto;
	}
}
@media(max-width:1400px){
	.text_header{
		font-size: 36px;
	}
}

@media(max-width:1280px){
	.text_header{
		font-size: 34px;
	}
	.container.page-welcome{
		width:70%;
	}
	.container.page-reg,.page-checkmail .submit_btn, .page-checkmail .place_for_input{
		max-width:600px;
	}
	body{
		font-size:4px;
	}
	.event_timer_item{
		font-size: 42px;
		line-height: 48px;
		width:110px;
		height:110px;	
	}
	.page-welcome .main_text h2{
		font-size: 60px;
		line-height: 55px;	
	}
	.page-reg .main_text p,.page-checkmail .main_text p{
		font-size: 14px;
		line-height: 18px;	
	}
	.page-reg .main_text h2,.page-checkmail .main_text h2{
		font-size: 40px;
		line-height: 38px;
	}
	.page-success .main_text p{
		font-size: 20px;
		line-height: 42px;	
	}
	.page-success .main_text h2{
		font-size: 40px;
		line-height: 44px;
	}
	.container .page-reg,.container .page-checkmail{
		margin-top:30px;
	}
	.btn_chatra:hover{
		font-size:5em;
	}
}
@media(max-width:1024px){
	.container.page-welcome .container_header,.container.page-success .container_header{
		max-width:80%;
	}
	body{
		font-size:4px;
	}
	.container.page-welcome{
		width:80%;
	}
	.container .page-reg,.container .page-checkmail{
		width:95%;
	}
}
@media(max-width:767px){
	.desktop{
		display:none;
	}
	.mob{
		display:flex;
	}
	.container.page-checkmail,.container.page-reg, .container.page-success,.container.page-welcome{
		max-width:100%;
		width:100%;
		padding:0;
		margin-top:0;
	}
	.main_text img{
		margin:30px auto;
		width:60%;
	}
	label font, label a{
		font-size: 13px;
		line-height: 16px;
	}
	.page-reg .main_text h2{
		font-size: 24px;
line-height: 29px;
	}
	.place_for_input p{
		font-size: 15px;
		line-height: 28px;
	}
	.page-success .container_header img{
		max-width:100%;
	}
	.page-success .main_text h4 {
		font-size: 30px;
		line-height:42px;
	}
	.form{
		padding:10px;
		margin-top:10px;
	}
}
@media(max-width:375px){
	.page-success .main_text h2{
		font-size:26px;
	}
	.page-success .container_header{
		margin-top:0;
	}
	.event_timer_item{
		width: 60px;
		height: 60px;
		font-size: 30px;
		line-height: 34px;
	}
}