@font-face
{
	font-family: 		'Roboto Regular';
	src: 				url('../res/roboto-regular.ttf');
}
body
{	
	background:			#ccc;
	padding:			2%;
	font-family: 		'Roboto Regular';
}
button
{
	position:			absolute;
	font-weight:		800;
	text-transform:		uppercase;
	width:				75px;
}
#on,#run,#off,#load_1,#load_2,#sanit, a
{
	cursor:				pointer;
}
marquee
{
	position:			absolute;
	border: 			1px solid #000;
	border-radius: 		4px;
	width: 				100px;
}
/* Визуализация системы. Начало */
.tank
{
	position:			absolute;
	width:				100px;
	height:				100px;
}
.tank_small
{
	position:			absolute;
	width:				70px;
	height:				70px;
}
.batcher
{
	position:			absolute;
	width:				100px;
	height:				100px;
}
.mixer
{
	position:			absolute;
	width:				100px;
	height:				100px;
}
.sensor
{
	position:			absolute;
	width:				6px;
	height:				6px;
	z-index:			15;
}
.tap
{
	position:			absolute;
	width:				20px;
	height:				20px;
	z-index:			20;
}
.tube
{
	position:			absolute;
	width:				20px;
	height:				20px;
}
.stirrer
{
	position:			absolute;
	width:				100px;
	height:				100px;
	z-index:			400;
}
.strain_gauge
{
	position:			absolute;
	border:				1px solid #000;
	border-radius:		4px;
	text-align:			center;
	width:				100px;
}
/* Визуализация системы. Конец */
.block_0 a:link
{
	color:				#0f211a;
}
.block_0 a:visited
{
	color:				#336666;
}
.block_0 a:hover
{
	text-decoration: 	none;
	color:				#0f211a;
}
/***********************************************************************************************************
*      Меню. 
*/
input 
{
	display:					none;
}	
label 
{	
	cursor:						pointer;
}
nav
{	
	 user-select:				none;
}		
nav .showmenu
{	
    position:					fixed;
    display:					inline-block;
    margin-left:				-2%;
    padding:					5px 10px 10px;
    top:						1%;
	z-index:					500;
}		
nav .back
{	
    position:					fixed;
    top:						0;
    right:						0;  
    bottom:						0;
    left:						0;
    transition:					background-color .3s;
}		
nav ul
{	
    list-style:					none;
    padding:					0;
    color:						#fff;
    overflow:					hidden;
	z-index:					400;
    font-size:					13px;     /*Размер шрифта для меню*/
}
nav>ul
{
    position:					fixed;
    top:						0;
    bottom:						0;
    left:						0;
    display:					block;
    width:						220px;
    margin:						0;
    padding:					100px 0 20px;
    text-transform:				uppercase;
    line-height:				2em;
    background-color:			#2c2c2c;
    overflow-y:					auto;
    -webkit-overflow-scrolling: touch;
    transform:					translateX(-100%);
    transition:					transform .3s;
    will-change:				transform;
    backface-visibility :	   	hidden;
}
nav ul ul
{
    font-size:					.7em;
    background-color:			#dcdfe4;		/*Цвет фона раздвигающегося подменю*/
    max-height:					0;
    transition:					max-height .3s ease-in-out;
}
nav ul label
{
    position:					absolute;
    right:						0;
    margin-top:					-32px;		/*Расстояние отступа треугольных маркеров меню*/
    padding:					10px;
    line-height:				normal;
}
nav a
{  
    display:					block;
    text-align:					left;
	margin-left:				20px;
    text-decoration:			none;
    color:						#fff;
}
nav ul ul a
{
	color:						#0f211a;
	text-align:					right;
	margin-right:				20px;
}
#showmenu:checked~.back
{
    background-color:			rgba(0,0,0,.5);
    bottom:						0;
}
nav a:hover,nav .showmenu:hover,nav ul label:hover
{
	opacity:					0.7;
}
nav>ul::-webkit-scrollbar
{
	display:					none;
}
#showmenu:checked+.showmenu
{
	color:						#fff;
}
nav ul input:checked~ul 
{
	max-height:					100vh;
}
nav ul input:checked+label
{
	transform:					rotate(180deg);
}
#showmenu:checked~ul
{
	transform:					translateX(0);
}
/**
*                                          Меню. Конец
*
**********************************************************************************************************/