@font-face {
	font-family: Hellenica;
    src: url(12124142.ttf);
}

@font-face {
	font-family: d_DocteurAtomic;
    src: url(/ttf/d_Docteur\ Atomic.ttf);
}

html {
	scroll-snap-type: y proximity;
	scrollbar-width: none;
}

html, body {
	padding: 0;
	margin: 0;
	font-family: Hellenica;
	height: 100%;
}

a{text-decoration: none; color: white;}

ul {
	margin-block-start: 0em;
    margin-block-end: 0em;
    padding-inline-start: 0px;
    display: -webkit-inline-box;
    list-style: none;
    height: 24px;
    width: 100%;
}

li {margin-left: 12%;}

h1 {
	font-size: 100%;
	text-align: center;
	margin-block-start: 0em;
    margin-block-end: 0em;
    padding-top: 4%;
    font-weight: normal;
}

input {
	border:none;
	width:100%;	
	opacity: 0.5;
	font-family:Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
}

button {
	background:white no-repeat center center;
	border: none;
	margin-top: 0.5%;
	font-family: Hellenica;
}

.site_https {
	display: flex;
    position: absolute;
    bottom: 0;
    left: 3%;
    z-index: 2;
    color: white;
    font-size:xxx-large;
	font-family: d_DocteurAtomic;
}

.search button {
	background:url('images/lupa.png') no-repeat center center;
	border: none;
	cursor: pointer;
	width: 23px;
	height: 19px;
	margin-top: 0.5%;
	font-family: Hellenica;
}

.wrapper_images_one {
	position: absolute;
    z-index: -1;
	max-height: 1080px;
}

.wrapper_images_one img{
	width: 100%;
	height: 100%;
}

button:active, button:focus, input:focus, input:active {
  outline: none;
}

.wrapper_media_content {
	display: flex;
	flex-direction: column;
}
 
.search input::-webkit-input-placeholder{ opacity: 0.9; font-family: Hellenica;}
.search input::-moz-placeholder{ opacity: 0.9; font-family: Hellenica;}

.search input {font-size: 140%;}

.wrapper {
	flex-direction: column;
	display: flex;
	min-height: 100vh;
}

.input_aut_admin {
	border: 1px solid #8a8a8a;
	width: 90%;
}

.admin_key_form {
	background-color: #fff6f6;
	display: flex;
    flex-direction: column;
    width: 30%;
	height: 11.5%;
	border-radius: 12% 12% 12% 12%;
	align-items: center;
}
.admin_div { 
	width: 100%;
	height: 100vh;
	display: flex;
    justify-content: center;
	align-items: center;
}

#but_admin{
	width: 50%;
	border: 1px solid #d1d1d1;
	color: #d1d1d1;
}

#but_admin:hover{
	border: 1px solid black;
	color: black;
}

.menu {
	width:100%;
	min-height: 7.5%;
	background-image: url('images/mmm.png');
	display: flex;
	align-items: center;
	font-size: 150%;
	z-index: 2;
	overflow: hidden;
	position: fixed;
	transition: 0.6s;
	top: 0%;
	height: auto;
}

.wrapper_menu{width: 100%; min-height: 7.5%; position: fixed;}

.logo {
	background:url('images/logo.png') no-repeat;
	min-height: 41px;
	min-width: 75px;
	margin-left: 2.9%;
}

.account {
	justify-content: flex-end;
	display: flex;
	height: 24px;
	width: auto;
	height: 100%;
	align-items: center;
}

.account img {
	height: 36px;
	width: 36px;
	margin: 0 23px 0 23px;
	border-radius: 50%;
}

.wrapper_slide_one, .wrapper_slide_two, .wrapper_slide_three {
	width: 100%;
	height: 100vh;
	scroll-snap-align: start;
	display: block;
	scrollbar-width: none;
}

.wrapper_slide_two {
	overflow:overlay;
	background-color: #ffffff;
	box-shadow: 0 0 10px rgba(0,0,0,0.5);
}

.wrapper_slide_three {
	box-shadow: 0 5px 210px rgba(0,0,0,0.5);
	background-color: #141313;
}

.wrapper_content {
	display: block;
	width: 94%;
	margin: 0 auto;
}

.content {
	width: 24%;
	height: 232px;
	width:413px;
	margin: 2.63% 0 0 2.55%;
}

.content:hover .header_text { position: relative; height: 0%; color: transparent; overflow: hidden;}
.content:hover .wrapper_media {height:100%; opacity:1; transition: 1s;}
.content_block {margin-bottom: 2.5%; justify-content: space-between; display: flex; flex-flow: wrap;}

.header_text {
	display:flex;
	align-items: center;
	justify-content: center;
	background: url('images/content_block.png');
	color:white;
	font-size: 85%;
	height: 20%;
	position: relative;
	transition: 1s;
	text-align: center;
	padding:0 2% 0 2%; 
}

.header_back {
	height: 100%;
	position: relative;
	z-index: 1;
	background: url('images/header_back.png');
	color: #dedcdc;
	font-size: 140%;
	overflow: auto;
	transition:0.7s;
	right:-100%;
}

.headerspan {
  margin-left:7%;
  margin-right: 7%;
  text-shadow: 5px 0 5px rgba(0,0,0,0.75);
}

#oneblock {
	width:51%;	
	display: flex;
	justify-content: flex-start;
	align-items: center;
}

#twoblock {
	width: 49%;
	display: flex;
	justify-content: flex-end;
	align-items: center;
}

.navigation {
	width: 3%;
	position: fixed;	
	z-index: 100;
	top:42%;
	left: 3.84%;
	transition: 0.5s;
}

.circle {
	border-radius: 50%;
	width: 18px;
	transition: 0.1s;
	transition-timing-function: ease-in-out;
	background-color: black;
	opacity: 0.4;
	height: 18px;
	margin: auto;
	top:42.9%;
	left: 3.84%;
	cursor: pointer;
	margin-bottom: 36px;
}

.circle:nth-child(2){
	background-color: white;
	margin-top: 36px;
}

.circle:nth-child(3){
		margin-bottom: 34px;
}

 .triangle-down {
      width: 24px;
      height: 24px;
      border-top: 8px solid white;
      border-right: 8px solid white;
      transform: rotate(-225deg);
      opacity: 0.4;
      margin: auto;
	  cursor: pointer;
  }   
  
   .triangle-up {
      width: 24px;
      height: 24px;
	  cursor: pointer;
      border-top: 8px solid white;
      border-right: 8px solid white;
      transform: rotate(-45deg);
      opacity: 0.4;
      margin: auto;
      display: none;
  }   

  .search {
  	width: 100%;
  	margin-top:1.6%;
  	display: flex;
  	border-bottom:1px solid #c1c1c1;
  	opacity: 0.7;
  	height: 34px;
  }
  
  .wrapper_content_footer {
	display: flex;
	justify-content: center;
	min-height: 96vh;
	width: 94%;
	margin: 0 auto;
	border-bottom:1px solid #3b3b3b;
}

#start, #end {
	color:white;
	height:100%;
	font-size:140%;	
	margin-top: 12%;
}
#start{	width:60%;}
#end  {	width:40%;}
#start span, #end span {font-size: 150%;}

#start input {
	background: transparent;
	color: white;
	border-bottom: 1px solid #c1c1c1;
	width: 394px;
	font-size: 100%;
	margin-top:3.5%;
}

#start button {
	background: #e8e8e8;
	color: #141313;
	width: 396px;
	height: 49px; 
	font-size: 140%;
	margin-top:4%;
}

.classhold::-webkit-input-placeholder{color:white; opacity:1; font-size: 100%;}
.classhold::-moz-placeholder {color:white; opacity:1; font-size: 100%;}

.classhold {
	font-family: Hellenica;
 }
 
input[type="checkbox"] {
 display: none;
}

label {
 line-height: 3%;
 vertical-align: middle;
 font-size: 75%;
 padding-top: 6%;
}

label:before {
 content: " ";
 display: inline-block;
 margin-right: 1.5%;
 width: 27px;
 height: 27px;
 background: transparent;
 border: 1px solid #919191;
 vertical-align: middle;
}

input:checked + label:before{background: url('images/galka.png');}

.BlockDop {
	display: flex;
	align-items: center;
	margin-top:5%;
}

#BlockDop {
	margin-left: 1%;
}

input[type="date"]::-webkit-calendar-picker-indicator {
	background:url('images/calendar.png') center center;
	width: 32px;
	height: 32px;
}

.margin_input {margin-bottom: 5%;}
.imgg {margin-left:1.3%;}

#end .BlockDop span {margin-left: 2%; font-size: 100%;}
.wrapper_media{background: url('images/content_block.png'); width: 100%; height: 80%; transition: 1s; opacity: 0; display: flex; justify-content: center; align-items: center;}
.wrapper_content_start{margin-left: 28%;}
.header_back_wrapper {overflow: hidden; width: 49.2%; margin-left: 50.8%; margin-top:7.5vh;height: 92.5vh; transition: 0.6s;}
.navigation_w {height: 26%; width: 10%; top:42.9%; margin: auto; position: fixed; z-index: 50;}
.ColorUL{transition: 1s;}

.authorization {
	width: 230px;
	height: auto;
	background: white;
	margin-top: 73px;
	display: block;
	float: left;
	padding: 1%;
	align-items: center;
	z-index: 6;
	position:fixed;
	right: 0.4%;
	box-shadow: 0.4em 0.4em 5px rgba(122,122,122,0.5);
	transition: 0.4s;
	top: -65%;
}

.authorization input {
	width: 100%;
	height: 23px;
	border: 0.5px solid black;
	margin: 2% 0 2% 0;
	/*100% с границей (border)*/
	box-sizing: border-box;
	font-size: 90%;
} 

.authorization button {
	width: 35%;
	height: 23px;
	border: 0.5px solid black;
	margin-top: 2%;
	cursor:pointer;
}

.wrapper_authorization_button_and_span {
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 100%;
}

.wrapper_authorization_button_and_span span {
	padding-top: 3%;
	cursor:pointer;
}

.mob_menu {display: none; z-index: 9;}

.img_mob_menu {
	background: url('images/arrows_hamburger1_40391.png') center no-repeat;
	min-width: 32px;
	height: 32px;
	margin: 0 0 0 14px;
	z-index: 5;
}

.left_menu {display: none;}
.left_menu_opacity, #auth_mob {display: none;}

.strelka {
	width: 21px;
	height: 69px;
	transition: 0.7s;
	position: absolute;
	background: url('images/pravo.png');
	right: 5%;
	top: 48%;
	opacity: 0.5;
	cursor: pointer;
}
.id_ident {cursor: pointer;}

.wrapper_logo_contacts {
	display: flex;
	width: 100%;
	flex-direction: column;
	height: auto;
}

.wrapper_logo_contacts h1 {
	margin-top: 5%;
	margin-left: 0.9%;
}

.wrapper_logo_contacts span {
	display: flex;
	align-items: center;
	padding-left: 0.5%;
	padding-top: 0.4%;
}

.wrapper_logo_contacts img {
	width: 48px;
	height: 48px;
	padding-right: 0.2%;
}

.back_fon_no_aut {
	display: flex;
    justify-content: flex-end;
    width: 100%;
	height: auto;
	margin-top: 7.5%;
}
.back_fon_no_aut img {
	max-width: 865px;
    max-height: 868px;
}

/*Работа с мобильной версией*/

@media screen and (max-width: 1280px) {
	
}

@media screen and (max-width: 1024px) {
	.back_fon_no_aut {
		display: none;
	}

	.wrapper_media_content {
		display: flex;
		flex-direction: column-reverse;
	}

	.account img {margin: 0 12px 0 0;}
	
	form.mobile {
		display: block;
		position: fixed;
		width: 70%;
		height: 43%;
		margin-top: 75px;
	}

	form.mobile input {
		margin-bottom: 5px;
		caret-color: #e08cf0;
		opacity: 0.5;
		font-size: 80%;
		border: none;
		background: white;
		margin-top:5px;
		width: 86.5%;
		padding: 0;
	}

	form.mobile button {opacity: 0.7; float: right;}

	form.mobile input, form.mobile span{
		left: 6%;
		position: absolute;
	}
	form.mobile span {color:white;	}

	.authorization {display: none;}
	.account {width: 100%;}
	.wrapper_media a{
		visibility: hidden;
	}
	.search {
		margin-bottom: 2%;
	}

	.mob_menu {
		display: flex;
		align-items: center;
		width: 100%;
		position: relative;
		height: 56px;
		opacity: 0.8;
		background: #141313;
		justify-content: space-between;
	}

	html {scroll-snap-type:none;}

	.wrapper_slide_one, .strelka {
		display: none;
	}
	.wrapper_slide_two {
		box-shadow:none;
	}
	
	#end {display: none;}
	#start {
		width: 100%;
		margin-top: 0;
	}

	.wrapper_slide_three {margin: 0; display: flex; align-items: center; justify-content: center;}
	.wrapper_content_footer {align-items: center;}

	.left_menu {
		display: flex;
		transition: 0.7s;
		left: -120%;
		height: 100vh;
		width: 70%;
		background: url('images/fon_menu.png');
		position: fixed;
		z-index: 2;
		box-shadow: 0.4em 0.4em 5px rgba(122,122,122,0.5);
	}

	.left_menu_opacity {
		display: block;
		position: fixed;
		z-index: 1;
		width: 100%;
		height: 100vh;
		left: -120%;
	}

	.TSPROJECT {
		width: 88.3%;
		height: 41px;
		z-index: 2;
		left: 6%;
		bottom: -107.5%;
		position: absolute;
	}

	.TSPROJECT img {
		float: right;
	}

	ul { display: block; margin-top: 107px; z-index: 190; position: relative;}
	ul li {margin-bottom: 28px; font-size: 100%; margin-left: 6%;}
	.search button {
		margin-top: 1.7%;
	}

	.line {
		width: 88%;
		height: 1px;
		position: absolute;
		margin-left: 6%;
		border-bottom: 1px solid white;
		bottom: -92.5%;
		opacity: 0.7;
	}

	#auth_mob {
		position: absolute;
		bottom: -6px;
   		left: 6%;
		display: block;font-size: 120%;
		width: 87.1%;
	}
	.menu {display: none;}
	.wrapper_logo_contacts h1 {margin-left: 1.9%;}
	.wrapper_slide_two {
		overflow-y: overlay;
	}
	.wrapper_slide_three {display: none;}
	.content {width: 100%; margin: 2.63% auto; height: 208px;}
	.wrapper_content {max-width: 360px;}
	.wrapper_media {height: 75%;}
	.header_text {height: 25%;}

	.exit-image, .exit-strelka, .mobile-exit-form {position: absolute;}
	.exit-image img, .exit-strelka img {height: inherit; width: inherit;}
	.exit-image {
		height: 150px; 
		width: 150px; 
		bottom: 40%; 
		left: 42%;
	}
	.exit-strelka {
		height: 50px; 
		width: 50px; 
		bottom: 47%; 
		left: 24%;
	}
	.mobile-exit-form {
		z-index: 100;
		width: max-content;
		height: max-content;
		bottom: 43%;
		left: 15%;	
	}
}

@media screen and (max-width: 468px){
	.wrapper_logo_contacts h1 {margin-left: 2.9%;}
}

/*Работа с телевизором 4к*/

@media screen and (min-width: 3840px){
	html {
		scroll-snap-type: x proximity;
	}
	.wrapper_slide_two {
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.search {
		margin-top: 0;
	}

	.content_block {
		margin-bottom: 0;
	}
}