@charset "utf-8";

@media screen and (orientation:landscape) and (min-width:1px) {
  html {font-size: 1em;}
  body {font: 100%/1.1 Calibri, Verdana, Arial, Helvetica, sans-serif;}
}
@media screen and (orientation:portrait) and (min-width:1px) {
  html {font-size: 1em;}
  body {font: 100%/1.1 Calibri, Verdana, Arial, Helvetica, sans-serif;}
}
@font-face {
    font-family: 'Roboto';
    src: local('Roboto'), local('Roboto-Regular'), url('Roboto.woff2') format('woff2'), url('Roboto.woff') format('woff'), url('Roboto.ttf') format('truetype');
}
/*ПЕРЕМЕННЫЕ*/
:root{
	/*локальная форма*/
	--lf-text-col: rgba(0,0,0,1);
	--lf-fon-col: rgba(0,0,0,1);
	--lf-text: rgba(0,0,0,1);
	
	
	--fon-000: rgba(0,0,0,1); /*черный*/
	--body-fon: rgba(33,33,33,1); /*средне серый*/
		--body-text: rgba(252,252,252,1); /*почти белый*/
		--body-text-b: rgba(33,33,33,1); /*почти белый*/
		--body-letter-spacing: 0.1rem;
		--body-border: 0.3rem solid rgba(0,0,0,1);
		--body-y-border: 0.3rem solid rgba(252,252,0,1);
		--body-b-border: 0.3rem solid rgba(0,151,222,1);
		--boxout-shadow: 0 0 1.5rem 0.2rem rgba(0,0,0,1);
	/*--nav*/
		--nav-border: 0.15rem solid rgba(0,0,0,1);
	--iframe-fon: rgba(222,222,222,1); /*белый фон*/
	--form-fon: rgba(66,66,66,1); /*темно серый 48,48,48*/
		--form-text: rgba(252,252,252,1); /*почти белый*/
		--form-border: 0.3rem solid rgba(0,0,0,1); /*черный*/
	--top-fon: rgba(0,151,222,1); /*голубой*/
	--top-text: rgba(0,151,222,1); /*голубой*/
	--input-fon: rgba(33,33,33,1); /*голубой*/
		--input-text: rgba(0,252,151,1); /*светло зелёный*/
		--input-shadow: 0 0 0.6rem 0.1rem rgba(0,131,202,1) inset; /*голубой*/
	--link: rgba(252,252,0,1); /*желтый*/
		--link-focus: rgba(0,252,151,1); /*светло зелёный*/
	--button-fon: rgba(77,77,77,1); /*linear-gradient(to top, rgba(0,0,0,0.4) 30%, rgba(0,0,0,0) 100%), rgba(0,151,222,1)*/
		--button-fon-focus: rgba(33,33,33,1); /*linear-gradient(to bottom, rgba(0,0,0,0.4) 30%, rgba(0,0,0,0) 100%), rgba(0,151,222,1)*/
		--button-text: rgba(252,252,0,1); /*0,151,222,1*/
		--button-text-focus: rgba(0,252,151,1); /**/
		--button-letter-spacing: 0.10rem;
		--button-border: 0.3rem solid rgba(0,0,0,1); /*черный*/
		--button-shadow: 0 0 0.9rem 0.2rem rgba(0,151,222,1) inset; /**/
		--button-shadow-focus: 0 0 0.9rem 0.2rem rgba(0,252,151,1) inset; /**/
	--closed-color: rgba(255,151,0,1);/*rgba(250,190,50,1)*/
	--open-color: rgba(255,151,0,1); /*rgba(147,255,58,1)*/
	--actzag-color: rgba(55,255,55,1); /*rgba(147,255,58,1)*/
		--actart-color: rgba(0,155,0,1);} /*rgba(147,255,58,1)*/
	/*--linear-gradient(to right, rgba(0,0,0,0.4) 0%, rgba(0,0,0,0.2) 25%, rgba(0,0,0,0) 50%, rgba(0,0,0,0.2) 75%, rgba(0,0,0,0.4) 100%)*/
/*СТАНДАРТНЫЕ ССЫЛКИ*/
body {
	width: 100%;/*min-height: 100vh;*/	
	margin: 0;
	padding: 0;
	background: var(--body-fon);
	background-size: auto;
	background-attachment: fixed;
	color: var(--body-text);
	/*background-size: cover;*/
	letter-spacing: var(--body-letter-spacing);
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-khtml-box-sizing: border-box;
	box-sizing: border-box;
	outline: none;/*transition: 5s;*/}
div {
	margin: 0;
	padding: 0;}
a img {
	border: 0;
	outline: none;}
/*a p {
	border: none;
	text-decoration: none;
	outline: none;
	cursor: pointer;
	color: var(--closed1-color);}
a p:link {
	border: none;
	text-decoration: none;}
a p:visited {
	border: none;
	text-decoration: none;}
a p:hover, a p:active, a p:focus {
	border: none;
	text-decoration: none;
	color: red;}*/
a { /* !!! */
	border: none;
	text-decoration: none;
	outline: none;
	cursor: pointer;
	color: var(--link);}
	a:link {
		border: none;
		text-decoration: none;}
	a:visited {
		border: none;
		text-decoration: none;}
	a:hover, a:active, a:focus {
		border: none;
		text-decoration: none;
		color: var(--link-focus);
		cursor: pointer;
		text-decoration: none;}
/* ОПИСАНИЕ для поля ввода в форму */
p.inputblock {
	margin: 0;
	padding: 1rem 0;
	font-size: 1.5rem;
	display: flex;
	justify-content: flex-start;
	align-items: center;}
/* ПОЛЕ для ввода в форму */
input.inputblock {
	margin: 0 auto;
	padding: 0.2rem 0;
	background: var(--input-fon);
	text-transform: uppercase;
	color: var(--input-text);
	text-align: center;
	font-size: 0.9rem;
	letter-spacing: 0.1rem;
	cursor: text;
	border: var(--form-border);
	box-shadow: var(--input-shadow);
	display: flex;
	justify-content: center;
	align-items: center;
	}
	input[type="text"].inputblock:focus {
	  color: var(--input-text);}
	input[type="password"].inputblock:focus {
	  color: var(--input-text);}
	select.inputblock:focus {
	  color: var(--input-text);}
	textarea.inputblock:focus {
	  color: var(--input-text);}
/* КНОПКА ввода в форму */
input.enterbutton, input.enterbutton:visited, input.enterbutton:link {
	background: var(--button-fon);
	text-transform: uppercase;
	padding: 0.2rem 0 0.2rem 0;
	color: var(--button-text);
	font-size: 1.0rem;
	letter-spacing: var(--button-letter-spacing);
	text-align: center;
	cursor: pointer;
	border: var(--button-border);
	box-shadow: var(--button-shadow);	 
	overflow: hidden;}
	input.enterbutton:hover, input.enterbutton:active, input.enterbutton:focus {
		background: var(--button-fon-focus);
		color: var(--button-text-focus);
		box-shadow: var(--button-shadow-focus);}
/*ПАНЕЛЬ навигационная*/
#navpanel {
	position: fixed;
	left: 0;
	top: 0;
	right: 0;
	height: 3rem;
	margin: 0;
	padding: 0;
	background: var(--form-fon);
	border: 0;
	border-bottom: var(--body-border);
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	z-index: 1000;}
	#navpanel input.enterbutton, #navpanel input.enterbutton:visited, #navpanel input.enterbutton:link {
		background: none;/*var(--button-fon)var(--body-border) none*/
		text-transform: uppercase;
		margin: 0;
		padding: 0;
		width: 400px;
		color: var(--button-text);
		font-size: 1.1rem;
		letter-spacing: var(--button-letter-spacing);
		text-align: center;
		cursor: pointer;
		border: 0;
		border-left: var(--nav-border);
		border-right: var(--nav-border);
		box-shadow: none var(--button-shadow);
		display: flex;
		align-items: center;
		overflow: hidden;}
		#navpanel input.enterbutton:hover, #navpanel input.enterbutton:active, #navpanel input.enterbutton:focus {
			background: var(--button-fon-focus);
			color: var(--button-text-focus);
			box-shadow: var(--button-shadow-focus);}
	.subnava {
		position: fixed;
		top: 2.3rem;
		/*bottom: 0;*/
		height: 0;
		margin: 0;
		margin-left: 0;
		padding: 0;
		width: 400px;
		z-index: 0;
		display: none;
		/*overflow: hidden;*/
		background: var(--body-fon);
		border: 0;
		border-top: var(--body-border);
		border-right: var(--body-border);
		border-bottom: var(--body-border);
		border-left: var(--body-border);
		flex-direction: column;
		justify-content: space-between;
		animation-duration: 0.5s;
		animation-iteration-count: 1;}
.localform { /* !!! ЛОКАЛЬНАЯ ФОРМА*/
	width: 100%;
	background: rgba(55,55,55,1);
	border: 2px black solid;
	}
	#localpan p {
		color: black;
		font-size: 1.1rem;
		font-weight: bold;
		text-transform: uppercase;}
#sublocalnav {
	}
#sublocalnav {
	}
		
		@keyframes slideon {
			from {height: 0;}
			to {height: calc(100vh - 2.3rem);}
			after {overflow: visible;}
		}
		@keyframes slideoff {
			from {height: calc(100vh - 2.3rem);}
			to {height: 0;}
			after {overflow: hidden;}
		}
/* НОВЫЙ CSS 12.08.2025 */
#localpan {
	position: fixed;
	left: 0;
	top: 0;
	bottom: 0;
	width: 495px;
	height: 100vh;
	margin: 0;
	padding: 0.5rem;
	background: rgba(255,255,255,1);
	border: 2px rgba(0,0,0,1) solid;
	overflow: hidden;
	overflow-y: scroll;
	z-index: 1001;}
	#localform {
		width: 100%;
		background: rgba(77,77,77,1);
		border: 0;
		box-shadow: 0 0 0.6rem 0.1rem rgba(0,0,0,1) inset;}
		#localform p {
			padding: 0.5rem 1rem;
			color: rgba(255,255,255,1);
			font-size: 1.1rem;
			font-weight: bold;
			text-transform: uppercase;}
		#sublocalform {
			width: 100%; height: auto;
			text-align: center;
			display: flex;
			flex-direction: row;
			justify-content: center;
			align-items: center;
			margin: 0;
			padding: 0.5rem 1rem 1rem 1rem;}
			input.inblocknull {
				width: 1px;
				height: 1px;
				border-width: 0.2rem;
				margin: 0;
				padding: 0;
				background: black;
				color: white;
				text-align: center;
				border: none;
				visibility: hidden;
				display: flex;}
			input.inblock {
				margin: 0 1%;
				padding: 0.1rem 0 0.2rem 0;
				background: rgba(25,25,25,1);
				text-transform: uppercase;
				color: rgba(55,255,255,1);
				text-align: center;
				font-size: 0.9rem;
				letter-spacing: 0.1rem;
				cursor: text;
				border: 2px rgba(255,255,255,1) solid;
				box-shadow: 0 0 0.6rem 0.1rem rgba(0,0,0,1) inset;
				display: flex;
				justify-content: center;
				align-items: center;
				}
				input[type="text"].inblock:focus {
					background: rgba(0,0,0,1);
				  	color: rgba(55,255,255,1);
					box-shadow: 0 0 0.5rem 0.2rem rgba(55,155,255,1) inset;}
				input[type="password"].inblock:focus {
					background: rgba(0,0,0,1);
				  	color: rgba(55,255,255,1);
					box-shadow: 0 0 0.5rem 0.2rem rgba(55,155,255,1) inset;}
				select.inblock:focus {
					background: rgba(0,0,0,1);
				  	color: rgba(55,255,255,1);
					box-shadow: 0 0 0.5rem 0.2rem rgba(55,155,255,1) inset;}
				textarea.inblock:focus {
					background: rgba(0,0,0,1);
					color: rgba(55,255,255,1);
					box-shadow: 0 0 0.5rem 0.2rem rgba(55,155,255,1) inset;}
			input.enter, input.enter:visited, input.enter:link {
				background: rgba(55,55,55,1);
				text-transform: uppercase;
				padding: 0.1rem 0 0.2rem 0;
				color: rgba(255,255,255,1);
				font-size: 0.9rem;
				letter-spacing: var(--button-letter-spacing);
				text-align: center;
				cursor: pointer;
				border: 2px rgba(255,255,255,1) solid;
				border-radius: 0.2rem;
				box-shadow: 0 0 0.6rem 0.1rem rgba(0,0,0,1) inset;
				overflow: hidden;}
				input.enter:hover, input.enter:active, input.enter:focus {
					background: rgba(0,0,0,1);
					color: rgba(55,255,255,1);
					box-shadow: 0 0 0.5rem 0.2rem rgba(55,155,255,1) inset;}
			input.enterlink, input.enterlink:visited, input.enterlink:link {
				background: none;
				text-transform: uppercase;
				padding: 0.1rem 0 0.2rem 0;
				color: rgba(255,255,255,1);
				font-size: 0.9rem;
				letter-spacing: var(--button-letter-spacing);
				text-align: center;
				cursor: pointer;
				border: 0;
				border-bottom: 1px rgba(255,255,255,1) solid;
				overflow: hidden;}
				input.enterlink:hover, input.enterlink:active, input.enterlink:focus {
					color: rgba(55,255,255,1);}
			input.enterlinknull, input.enterlinknull:visited, input.enterlinknull:link {
				background: none;
				text-transform: uppercase;
				padding: 0.1rem 0 0.2rem 0;
				color: rgba(55,255,255,1);
				font-size: 0.9rem;
				letter-spacing: var(--button-letter-spacing);
				text-align: center;
				cursor: default;
				border: 0;
				overflow: hidden;}
				input.enterlinknull:hover, input.enterlinknull:active, input.enterlinknull:focus {
					color: rgba(55,255,255,1);}
		#sublocalnav {
			width: 95%;
			margin: 0 auto;
			padding: 0.5rem;
			display: flex;
			flex-direction: row;
			justify-content: space-evenly;
			align-items: center;
			background: none;
			border-top: 1px rgba(255,255,255,1) solid;}

/*input[type=submit].enterbutton,  input[type=submit].enterbutton:visited,  input[type=submit].enterbutton:link {
	background: var(--button-fon);
	text-transform: uppercase;
	color: var(--button-text);	
	letter-spacing: var(--button-letter-spacing);
	text-align: center;
	cursor: pointer;
	border: var(--button-border);
	box-shadow: var(--button-shadow);
	overflow: hidden;}
	input[type=submit].enterbutton:hover,  input[type=submit].enterbutton:active,  input[type=submit].enterbutton:focus {
		background: var(--button-fon-focus);
		color: var(--button-text-focus);
		box-shadow: var(--button-shadow-focus);}
input[type=reset].enterbutton,  input[type=reset].enterbutton:visited,  input[type=reset].enterbutton:link {
	text-transform: uppercase;
	color: var(--base-text);
	text-align: center;
	letter-spacing: 0.05em;
	cursor: pointer;}
	input[type=reset].enterbutton:hover,  input[type=reset].enterbutton:active,  input[type=reset].enterbutton:focus { 
		color: var(--nav-butt-text-press);
		box-shadow: 0 0 0.5rem 0.1rem #333 inset;}*/
.vivod0 {
	background: rgba(255,255,255,1);
	color: var(--textvivod-color);
	border: 0.05rem solid var(--base-border);
	overflow-wrap: anywhere;}/*break-word разрыв и перенос даже длинных*/
.vivod1 {
	background: rgba(255,255,255,0.75);
	color: var(--textvivod-color);
	border: 0.05rem solid var(--base-border);
	overflow-wrap: anywhere;}
.vvod {
	margin: 0.5rem 0.5rem;
	padding: 0.5rem 0.5rem 0.5rem 0.5rem;
	background: var(--textvvod-fon);
	color: var(--base-text); /*var(--base-text);var(--textvvod-color)*/
	text-align: center;
	font-size: 0.9rem;
	letter-spacing: 0.05rem;
	cursor: text;
	border: 0.2rem solid var(--base-border);
	border-radius: 0.3rem;
	box-shadow: 0 0 0.5rem 0.1rem var(--textvvod-inset) inset;}
.vvod[placeholder] {color: var(--textcomm-color);}
.vvod100divrow {
	display: flex;
	width: 100%;
	flex-direction: row;
	margin: 0.5rem 0 0 0;
	padding: 0;
	border: 0px solid red;}
.vvod100divcol {
	display: flex;
	width: 100%;
	flex-direction: column;
	margin: 0.5rem 0 0 0;
	padding: 0;
	border: 0px solid red;}
.vvodcomm {
	margin: 0.5rem 0.5rem;
	padding: 0.5rem 0 0.5rem 0;
	border: 0;
	background: none;
	color: var(--textcomm-color);
	text-align: right;
	font-size: 1.1rem;
	letter-spacing: 0.05rem;}
input[type="text"].vvod:focus {
  color: var(--nav-butt-text-press);}
select.vvod:focus {
  color: var(--nav-butt-text-press);}
textarea.vvod:focus {
  color: var(--nav-butt-text-press);}


/*@font-face {
    font-family: Panton;
    src: url(Panton.otf);}
@media screen and (min-width:1602px) {
  html {font-size: 14px;}
  body {font: 100%/1.3 Calibri, Verdana, Arial, Helvetica, sans-serif;}
  article {width: 80%;}
}*/	
/** ~~ Основное CSS ~~ **/
* {
  /*-webkit-user-select: none;
  -moz-user-select: none;
  -khtml-user-select: none;
  unselectable: on;*/
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -khtml-box-sizing: border-box;
  box-sizing: border-box;
		/*transition: 0.5s;*/}
/** ~~ Селекторы элементов/тегов ~~ ***/
div, a, p, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, span, strong, input, table, tr, td {	
  cursor: default;
  padding: 0;
  margin: 0;
  /*-webkit-user-select: none;
  -moz-user-select: none;
  -khtml-user-select: none;
  unselectable: on;*/
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -khtml-box-sizing: border-box;
  box-sizing: border-box;
  outline: none;}
h1, h2, h3, h4, h5, h6, p {
	padding-right: 5px;
	padding-left: 15px;
}

/* ~~ прочие классы float/clear ~~ */
.fltrt {  /* этот класс можно использовать для обтекания элемента справа на странице. Обтекаемый элемент должен предшествовать элементу, с которым он должен находиться рядом на странице. */
	float: right;
	margin-left: 8px;}
.fltlft { /* этот класс можно использовать для обтекания элемента слева на странице. Обтекаемый элемент должен предшествовать элементу, с которым он должен находиться рядом на странице. */
	float: left;
	margin-right: 8px;}
.clearfloat { /* этот класс можно поместить в теге <br /> или в пустом блоке DIV в качестве конечного элемента, следующего за последним обтекаемым DIV (внутри #container), если .#footer удален или извлечен из #container */
	clear:both;
	height:0;
	font-size: 1px;
	line-height: 0px;}

[if lte IE 7]>
.content { margin-right: -1px; } /* это отрицательное поле в 1 пиксел можно поместить в любом столбце данного макета с таким же корректирующим эффектом. */
ul.navb a { zoom: 1; } /* свойство масштабирования предоставляет IE триггер hasLayout, необходимый для удаления лишнего пустого пространства между ссылками */
ul.navm a { zoom: 1; } /* свойство масштабирования предоставляет IE триггер hasLayout, необходимый для удаления лишнего пустого пространства между ссылками */
ul.navcl a { zoom: 1; } /* свойство масштабирования предоставляет IE триггер hasLayout, необходимый для удаления лишнего пустого пространства между ссылками */
<![endif]

/*#osncont {
	-webkit-transition: all 11с linear;
	-moz-transition: all 11с linear;
	-ms-transition: all 11с linear;
	-o-transition: all 11с linear;
	transition: all 11с linear;
}
#osncont:active {
	border: 3px #f00 solid;
}*/
