body{
	/*width:1520px;*/
	height: 720px;
	font-family: light;
	font-size: 12px;
	text-transform:uppercase;
	
}

@font-face {
  font-family: 'light';
  src: url('../fonts/Avenir Next W1G Light.ttf');
}

.tube{
	 background: #42424f;
background: linear-gradient(180deg,rgba(66, 66, 79, 0.81) 0%, rgba(8, 4, 4, 1) 46%, rgba(5, 0, 0, 1) 49%, rgba(23, 17, 6, 1) 52%, rgba(105, 105, 92, 0.77) 100%);

}


.hr-shelf {
/*
-webkit-box-shadow: -60px 23px 18px 8px rgba(34, 60, 80, 0.4);
-moz-box-shadow: -60px 23px 18px 8px rgba(34, 60, 80, 0.4);
box-shadow: -60px 23px 18px 8px rgba(34, 60, 80, 0.4);*/
-webkit-box-shadow: 0px 0px 5px 6px rgba(0, 0, 0, 0.28);
-moz-box-shadow: 0px 0px 5px 6px rgba(0, 0, 0, 0.28);
border-radius:50px;
-webkit-border-radius: 50px;
-moz-border-radius:50px;
box-shadow: 0px 0px 5px 6px rgba(0, 0, 0, 0.28);


	}


@keyframes arrovz11 {
	from {
	  color: #3f5487;
	}
	to {
	  color: #00ffff;
	}

  }


  @keyframes arrovz22 {
	from {
	  color: #7d7d7d;
	}
	to {
	  color: #111111;
	}

  }

.animation1{
	animation-name: arrovz1;
	animation-duration: 2s;
	animation-iteration-count: infinite;
	animation-direction: alternate;
	animation-timing-function: ease-in-out;
}

.animation2{
	animation-name: arrovz1;
	animation-duration: 4s;
	animation-iteration-count: infinite;
	animation-direction: alternate;
	animation-timing-function: ease-in-out;
}

.animation3{
	animation-name: arrovz1;
	animation-duration: 6s;
	animation-iteration-count: infinite;
	animation-direction: alternate;
	animation-timing-function: ease-in-out;
}

.animation4{
	animation-name: arrovz1;
	animation-duration: 8s;
	animation-iteration-count: infinite;
	animation-direction: alternate;
	animation-timing-function: ease-in-out;
}
.animation5{
	animation-name: arrovz1;
	animation-duration: 10s;
	animation-iteration-count: infinite;
	animation-direction: alternate;
	animation-timing-function: ease-in-out;
}
.animation6{
	animation-name: arrovz1;
	animation-duration: 12s;
	animation-iteration-count: infinite;
	animation-direction: alternate;
	animation-timing-function: ease-in-out;
}
.animation7{
	animation-name: arrovz1;
	animation-duration: 14s;
	animation-iteration-count: infinite;
	animation-direction: alternate;
	animation-timing-function: ease-in-out;
}
.animation8{
	animation-name: arrovz1;
	animation-duration: 16s;
	animation-iteration-count: infinite;
	animation-direction: alternate;
	animation-timing-function: ease-in-out;
}
.animation9{
	animation-name: arrovz1;
	animation-duration: 18s;
	animation-iteration-count: infinite;
	animation-direction: alternate;
	animation-timing-function: ease-in-out;
}
.animation10{
	animation-name: arrovz1;
	animation-duration: 20s;
	animation-iteration-count: infinite;
	animation-direction: alternate;
	animation-timing-function: ease-in-out;
}
.animation11{
	animation-name: arrovz1;
	animation-duration: 22s;
	animation-iteration-count: infinite;
	animation-direction: alternate;
	animation-timing-function: ease-in-out;
}
.animation12{
	animation-name: arrovz1;
	animation-duration: 24s;
	animation-iteration-count: infinite;
	animation-direction: alternate;
	animation-timing-function: ease-in-out;
}

.animation_dr1{
	animation-name: arrovz2;
	animation-duration: 2s;
	animation-iteration-count: infinite;
	animation-direction: alternate;
	animation-timing-function: ease-in;
}


.absolute{
	position: absolute;
	font-size: 1.5em;
}

.upper_text {
	text-align: center;
	font-size:18px;
}
.vacum_pump{
	position: absolute;
}
.r-small{
	position: absolute;
	font-size: 1em;
}

.round_signature{
	margin-top: 30px;

	
}
.waste_cros{
	position: absolute;
	width:6px;
	height: 6px;
	background: rgba(0.49, 0.49, 0.49,0);		/*#7d7d7d*/
}
.waste_tri{
	position: absolute;
	border: 7px solid transparent;
	border-left: 7px solid rgba(0.49, 0.49, 0.49,0);
}
.small_round{	
	width:23px;
	height: 23px;
	border-radius: 50%;
	background:  radial-gradient(white, grey);
	
}

.green_round{
	width:23px;
	height: 23px;
	border-radius: 50%;
	background:  radial-gradient(white, green);

}
.rotate-180{
	transform: rotate(180deg);
}
.rotate-270{
	transform: rotate(270deg);
}
.rotate-90{
	transform: rotate(90deg);
}
.faucet{
	
	position: absolute;

	/*background: gold;*/
}

.crossroad{
	position: absolute;
	width:6px;
	height: 6px;
	background:rgba(0.25, 0.33, 0.53, 0);
	
}
.point{
	width: 3px;
	height: 3px;
	background: rgba(0.25, 0.33, 0.53, 0);
	position: absolute;
}
.in_table{
	background: black;
	border: 1px solid white;
	color: #00ff00 ;
	
}

.in_table1{
	background: white;
	border: 1px solid white;
	color: #F17900;
	
}

.in_table2{
	font-size: 15px;
	margin-left: 15px;
	margin-right: 2px;
	padding-bottom: 2px;
	color: #111111;
	
}

.tablo{
	position: absolute;
	width: 70px;
	height: 20px;
	background: #b5c1a6;
	border: 1px solid black;
}

.tablo1{
	position: absolute;
	width: 90px;
	height: 24px;
	vertical-align: middle;
	background: white;
	border: 1px solid black;
	border-radius: 10px;
}

.tablo_vos{
	position: absolute;
	width: 70px;
	height: 24px;
	vertical-align: middle;
	background: white;
	border: 1px solid black;
	border-radius: 10px;
}
.probe{
	background: #00ffff;
	position: absolute;
	width:3px;
	height: 3px;
	border-radius: 50%;
	border: 1px solid black;
}
.triangle{
	position: absolute;
	width:20px;
	height: 10px;
}
.triangle_visible{
	position: absolute;
	border: 6px solid transparent; 
	border-left: 14px solid #3f5487;
	
}
.round{
	position: absolute;
	width:30px;
	height: 30px;
	border-radius: 50%;
	border: 5px solid #3f5487;
}
a{text-decoration: none;}
.header{
	background: #a6afa7;
	height:45px;
	display: flex;
}

.content{
	background:#c0c0c0;
	height: 835px;
}



.plavych_table{
	width:400px;
	height: 300px;
	background:#008f00;
	


}

.footer{
	background: #a6afa7;
	height:45px;
	display: flex;
	
	
}
.title{color:#e8f7e4;font-size:22px;}
.header div a{color:black;padding:5px 30px 5px 30px; background:#a2a1a7;border:1px solid black;box-shadow: inset 1px 1px white;margin-left:30px;margin-bottom: 20px;}
.header div{margin-top:12px;}
.header div a:active{ background: #008f00;}
.footer div a{color:black;padding:5px 30px 5px 30px; background:#a2a1a7;border:1px solid black;box-shadow: inset 1px 1px white;margin-left:30px;margin-bottom: 20px;}
.footer div{margin-top:12px;}
.footer div a:active{ background: #008f00;}
.specialist{
	display:flex;
	justify-content:space-between;
	min-height:400px;
	background:#BABABA;
	width:100%;
	margin:30px auto;
}


#id_username{margin-left:12px;font-family: light; font-size: 20px; width:350px; border: 1px solid #008f00;border-radius: 10px;}
#id_password{font-family: light; font-size: 20px; width: 350px; border: 1px solid #008f00;border-radius: 10px;}
#id_username:hover{background: #32C732;}
#id_password:hover{background: #32C732;}
.btn{margin-left: 10px; width: 300px;height: 50px;font-family: light; font-size: 20px;border: 1px solid #008f00;border-radius: 10px; background: #5AC75A;cursor: pointer;}

