img.animate1 {

    filter: alpha (Opacity=50);

    opacity: 0.50;    

}

img.animate1:hover {

    filter: alpha (Opacity=100);

    opacity: 1;

}



body {
	margin: 0px;
	padding: 0px;
	font-size: 6.25vw;
	position: relative;
	background-color: rgb(0, 163, 182);
}

p {
	margin: 0px;
	text-indent: 1em;
}

input {
	outline: 0px;
}
a{	
font-family: "Arial Verdana",Arial,Sans-serif;
cursor: url(images/cursor.cur), pointer;
}
a:visited {

    color: #71c6da;
}
a:link{
 color: #71c6da;
}
a:hover{
 color: #e33015;
}
div.content1{
	font-size: 10%;
}

div.lendenpage {
	width: 100%;
	height: 100vh;
	position: absolute;
	top: 0px;
}
div.menu {
	display: table;
	background-color: rgb(41, 41, 41);
	color: white;
	width: 100%;
	font-size: 0.24em;
	font-family: Arial;
	text-align: center;
	height: 7.3%;
	position: absolute;
}
td{
border-color: "white";
}

div.menu div {
	display: table-cell;
	vertical-align: middle;	
}

div.menu div:hover {
	background-color: black;
	color: rgb(120, 199, 211);	
	cursor: url(images/cursor.cur), pointer;
}

div.menu a:hover {
    color: rgb(120, 199, 211);
	text-decoration: none;
}

div.menu a {
    color: white;
	text-decoration: none;
}
div.content {
	background: -webkit-linear-gradient(top, rgb(0, 23, 51), rgb(0, 163, 182));
	background: -moz-linear-gradient(top, rgb(0, 23, 51), rgb(0, 163, 182));
	background: -o-linear-gradient(top, rgb(0, 23, 51), rgb(0, 163, 182));
	background: -ms-linear-gradient(top, rgb(0, 23, 51), rgb(0, 163, 182));
	height: 85%;
	position: absolute;
	top: 7.2%;
	width: 100%;
}
div.content1 {
	background: -webkit-linear-gradient(top, rgb(0, 23, 51), rgb(0, 77, 77));
	background: -moz-linear-gradient(top, rgb(0, 23, 51), rgb(0, 77, 77));
	background: -o-linear-gradient(top, rgb(0, 23, 51), rgb(0, 77, 77));
	background: -ms-linear-gradient(top, rgb(0, 23, 51), rgb(0, 77, 77));
	height: 82%;
	position: absolute;
	top: 25%;
	left: 5%;
	width: 90%;
	font-size: 20%;
}
div.content2 {
	height: 82%;
	position: absolute;
	top: 25%;
	left: 5%;
	width: 90%;
	font-size: 20%;
}
div.left-text {
    overflow: auto;
	height: 100%;
	position: absolute;
    left: 1%;
	top: 0%;
	width: 50%;
}
div.right-text {
    overflow: auto;
	height: 100%;
	position: absolute;
	right: -1%;
	top: 2%;
	width: 48%;
	color: white;
	font-size: 100%;
	text-align: justify;	

}
div.header {
	display: block;
	width: 97%;
	height: 25%;
	margin-left: 2%;
}

div.header>div {
	display: inline-block;
	vertical-align: top;
	white-space: nowrap;
}

div.header>div>div {
	display: inline-block;
	vertical-align: top;
}


div.login-form {
	background-color: rgb(206, 206, 206);
	border-radius: 0.3em;
	overflow: hidden;
	font-family: Arial;
	font-size: 0.2em;
}

div.login-form1{
	background-color: rgb(26, 26, 26);
	border-radius: 0.3em;
	overflow: hidden;
	font-family: Arial;
	font-size: 0.2em;
}

div.role-selector {
	border-radius: 0.3em;
	cursor: url(images/cursor.cur), pointer;
}

div.role-selector.active {
	color: white;
	background-color: rgb(0, 88, 112);
}

div.login-marker {
	vertical-align: middle;
	display: none;
}

div.role-selector.active div.login-marker {
	display: table-cell;
}

div.login-form input[type="submit"] {
	color: white;
	background-color: rgb(152, 88, 112);
	width: 100%;
	border: 0px solid black;
	height: 100%;
	border-radius: 0.3em;
	font-family: Arial;
	padding: 0px;
	font-size: 1em;
	cursor: url(images/cursor.cur), pointer;
}
div.login-form1 input[type="submit"] {
	color: white;
	background-color: rgb(152, 88, 112);
	width: 100%;
	border: 0px solid black;
	height: 100%;
	border-radius: 0.3em;
	font-family: Arial;
	padding: 0px;
	font-size: 1em;
	cursor: url(images/cursor.cur), pointer;
}

div.login-title {
	background: -webkit-linear-gradient(top, rgb(101, 101, 101), rgb(64, 64, 64));
	background: -moz-linear-gradient(top, rgb(101, 101, 101), rgb(64, 64, 64));
	background: -o-linear-gradient(top, rgb(101, 101, 101), rgb(64, 64, 64));
	background: -ms-linear-gradient(top, rgb(101, 101, 101), rgb(64, 64, 64));
	color: white;
	width: 100%;
	text-align: center;
}
div.login-title1 {
	background: -webkit-linear-gradient(top, rgb(158, 202, 58), rgb(58, 140, 0));
	background: -moz-linear-gradient(top, rgb(158, 202, 58), rgb(58, 140, 0));
	background: -o-linear-gradient(top, rgb(158, 202, 58), rgb(58, 140, 0));
	background: -ms-linear-gradient(top, rgb(158, 202, 58), rgb(58, 140, 0));
	color: white;
	width: 100%;
	text-align: center;
}


div.system-wrapper {
	margin-left: 2%;
	position: relative;
}

div.system-wrapper:after {
	content: '';
	display: block;
	padding-top: 50%;
}
div.result {
	position: relative;
    left: 5%;
}

div.system {
	position: absolute;
	left: 0px;
	top: 0px;
	right: 0px;
	bottom: 0px;
}

div.system>div {
	position: absolute;
}

div.system>div>img {
	width: 100%;
}

div.item0.img {
	left: 0px;
	top: 0px;
	width: 16%;
	cursor: url(images/cursor.cur), pointer;
}

div.item0.line {
	left: 10%;
	top: 50%;
	width: 4%;
	border-bottom: 1px solid rgb(149, 166, 171);
}

div.item0.menu-item {
	left: 14.5%;
	top: 48%;
	cursor: url(images/cursor.cur), pointer;
}

div.item1.img {
	left: 32.6%;
	top: 13%;
	width: 14%;
	cursor: url(images/cursor.cur), pointer;
}

div.item1.line {
	left: 28%;
	top: 24%;
	width: 4%;
	border-bottom: 1px solid rgb(149, 166, 171);
}

div.item1.menu-item {
	right: 73%;
	top: 22%;
	cursor: url(images/cursor.cur), pointer;
}

div.item2.img {
	left: 25.6%;
	top: 62.5%;
	width: 27.3%;
	cursor: url(images/cursor.cur), pointer;
}

div.item2.line {
	left: 32%;
	top: 80%;
	height: 8%;
	border-left: 1px solid rgb(149, 166, 171);
}

div.item2.menu-item {
	left: 30%;
	top: 90%;
	cursor: url(images/cursor.cur), pointer;
}

div.item3.img {
	left: 52.6%;
	top: 26.5%;
	width: 14%;
	cursor: url(images/cursor.cur), pointer;
}

div.item3.line {
	left: 55%;
	top: 58%;
	height: 8%;
	width: 4%;
	border-right: 2px solid rgb(149, 166, 171);
	border-bottom: 2px solid rgb(149, 166, 171);
	border-radius: 0 0 0.1em 0;
}

div.item3.menu-item {
	right: 47%;
	top: 63.5%;
	cursor: url(images/cursor.cur), pointer;
}

div.item4.img {
	left: 75.7%;
	top: 45.6%;
	width: 15.4%;
	cursor: url(images/cursor.cur), pointer;
}

div.item4.line {
	left: 80%;
	top: 67%;
	height: 8%;
	border-left: 2px solid rgb(149, 166, 171);
}

div.item4.menu-item {
	left: 70%;
	top: 77%;
	cursor: url(images/cursor.cur), pointer;
}

div.item5.img {
	left: 78.6%;
	top: 8.8%;
	width: 15%;
	cursor: url(images/cursor.cur), pointer;
}

div.item5.line {
	left: 74%;
	top: 12%;
	width: 4%;
	border-bottom: 2px solid rgb(149, 166, 171);
}

div.item5.menu-item {
	right: 28%;
	top: 10%;
	cursor: url(images/cursor.cur), pointer;
}

div.item6.img {
	position: absolute;
	height: 30vh;
	width: 18.27vh;
	right: 0px;
	bottom: 0px;
	cursor: url(images/cursor.cur), pointer;
	overflow: hidden;
	font-size: 0px;
	z-index: 50;
}

div.belka.img {
	position: absolute;
	width: 50%;

	left: 1%;
	bottom: 10%;
	cursor: url(images/cursor.cur), pointer;
	overflow: hidden;
	font-size: 0px;
	z-index: 49;
}
div.polyana.img {
	position: absolute;
	
    width: 50%;
	left: -1%;
	bottom: 4%;
	cursor: url(images/cursor.cur), pointer;
	overflow: hidden;
	font-size: 0px;
	z-index: 10;
}
div.item6.line {
	position: absolute;
	right: 5%;
	bottom: 25%;
	height: 6%;
	border-left: 2px solid rgb(149, 166, 171);
}

div.item6.menu-item {
	position: absolute;
	right: 1%;
	bottom: 33%;
	cursor: url(images/cursor.cur), pointer;
	z-index: 60;
}

img.item-overlay {
	position: absolute;
	left: 0px;
	top: 0px;
	opacity: 0;
	-webkit-transition: opacity 0.5s ease;
	-moz-transition: opacity 0.5s ease;
	-o-transition: opacity 0.5s ease;
	-ms-transition: opacity 0.5s ease;
}

img.item-overlay:hover {
	opacity: 0.4;
}

div.menu-item {
	background-color: rgba(0, 0, 0, 0.5);
	font-family: Arial;
	color: rgb(200, 200, 200);
	font-size: 0.2em;
	padding-top: 0.1em;
	padding-bottom: 0.1em;
	position: absolute;
	padding-left: 2em;
	padding-right: 2em;
	border-radius: 0.2em;
}

div.menu-item:before {
	content: '';
	position: absolute;
	left: 0.6em;
	top: 0.4em;
	height: 0.55em;
	width: 0.55em;
	background-color: rgb(227, 48, 21);
	border-radius: 50%;
}

div.footer {
	background-color: rgb(41, 41, 41);
	width: 100%;
	display: table;
	font-size: 0.15em;
	font-family: Arial;
	position: absolute;
	bottom: 0px;
	left: 0px;
	height: 6%;
	z-index: 40;
	padding-top: 0%;
}

div.footer>div {
	display: table-cell;
	width: 50%;
}

a.a_blue{
color: #71c6da;
text-decoration: none;
text-align: left;
font-size: 100%;
text-transform: uppercase;
}
a.a_red{
color: #FF0000;
text-decoration: none;
text-align: left;
font-size: 100%;
text-transform: uppercase;
}
a.a_black{
color: #000000;
text-align: left;
font-size: 100%;
}
a.a_white{
color: #FFFFFF;
text-align: left;
font-size: 100%;
}
a.a_white:hover{
color: #71c6da;
text-align: left;
font-size: 100%;
}

a.a_black:hover{
color: #FF0000;
text-align: left;
font-size: 100%;
}

.blue_text{
color: #71c6da;
text-transform: uppercase;
font-weight: bold;
text-align: center;
font-size: 100%;
}

.new {
	float:left;
	position: relative;
	 overflow:hidden;
	color: #FF0000;
	font-family: "Arial Verdana",Arial,Sans-serif;    
	width: 95%;	
	background: url("images/day.png");
	background-repeat: no-repeat; 
    padding: 1%;	
	background-size: 100% 100%; /* растягиваю изображение по размерам окна для всех браузеров поддерживающих технологию CSS3 */
}
.new1 {
	float:left;
	position: relative;
	 overflow:hidden;
	color: #FF0000;
	font-family: "Arial Verdana",Arial,Sans-serif;    
	width: 95%;	
	background: url("images/day1.png");
	background-repeat: no-repeat; 
    padding: 1%;	
	background-size: 100% 100%; /* растягиваю изображение по размерам окна для всех браузеров поддерживающих технологию CSS3 */
}
.big-pane{
    height:95%;
    min-height:95%;
    padding: 0px 1% 0px 1%;
	
    overflow: auto;
	width: 95%;
 
    margin: 1% 1%; 
    text-align: justify;  	
}
@media screen and (max-aspect-ratio: 9/5) {
	div.system-wrapper {
		width: 73%;
		margin-left: 9%;
		margin-top: -16.25vw;
		top: 31vh;
	}
}

@media screen and (min-aspect-ratio: 9/5) {
	div.system-wrapper {
		width: 124vh;
		left: 44%;
		margin-left: -62vh;
	}
}

@media screen and (max-aspect-ratio: 11/5) {
	div.header>div {
		width: 50%;
	}
	
	div#header1 {
		width: 50%;
	}
	
	div#header2 {
		width: 50%;
	
	}
	
	div#header3 {
		width: 30%;
	}
	
	div#header4 {
	padding-left: 0%; 
		width: 30%;
	}
	div#header5 {
	padding-left: 0%; 
		width: 30%;		

	}
		
	div#tab-container {
		width: 100%;
		margin-left: 0%;
	}
	
	div#header1 img {
		width: 100%;
	}
	
	div.login-form {
		width: 100%;
	}
	div.login-form1 {
		width: 100%;
	}
	
	div.login-form form {
		width: 100%:
	}
	div.login-form1 form {
		width: 100%:
	}
	
	div.login-title {
		padding-top: 0.2em;
		padding-bottom: 0.2em;
	}
	
	div#form-first-row {
		display: block;
		width: 94%;
		padding-left: 3%;
		padding-top: 3%;
		padding-bottom: 3%;
	}
	
	div#form-first-row>div {
		display: table-row;
		width: 100%;
		text-align: left;
	}
	
	div#form-first-row>div>div {
		vertical-align: top;
		display: table-cell;
		/*padding-left: 3%;*/
	}
	
	div#form-first-1 {
		width: 20%;
	}
	
	div#form-first-2 {
		width: 80%;
		padding-left: 2%;
	}
	
	div#form-first-row img {
		width: 100%;
	}
	
	div#form-second-row {
		padding-left: 3%;
		padding-bottom: 3%;
		display: table;
		width: 94%;
	}
	
	div#form-second-row>div {
		display: table-row;
		width: 100%;
	}
	
	div#form-second-row>div>div {
		vertical-align: middle;
		display: table-cell;
	}
	
	div#form-second-1 {
		width: 35%;		
		padding: 2%;
		
	}
	
	div#form-second-2 {
		width: 5%;
	}
	
	div#form-second-3 {
		width: 35%;
		padding: 2%;
		vertical-align: middle;
	}
	
	div#form-second-4 {
		width: 5%;
	}
	
	div#form-second-5 {
		width: 20%;
	}
	
	div#form-second-1>div {
		display: table;
		width: 100%;
	}
	
	div#form-second-1>div>div {
		width: 20%;
	}
	
	div.role-selector.active div.login-marker {
		display: table-cell;
	}
	
	div#form-second-1>div>div:first-child {
		display: table-cell;
		width: 80%;
	}
	
	div#form-second-1 img {
		width: 100%;
	}
	
	div#form-second-3>div {
		display: table;
		width: 100%;
	}
	
	div#form-second-3>div>div {
		width: 20%;
	}
	div#form-second-3>div>div:first-child {
		display: table-cell;
		width: 80%;
	}
	
	div#form-second-3 img {
		width: 100%;
	}
	
	div.login-form input[type="text"], input[type="password"] {
		width: 100%;
		border: 0px solid black;
		outline: 0px;
		border-radius: 0.4em;
		height: 2.1vw;
		line-height: 180%;
		font-family: Arial;
		padding: 0px;
		font-size: 0.9em;
		padding-left: 0.4em;
		color: rgb(145, 145, 145);
	}
	div.login-form1 input[type="text"], input[type="password"] {
		width: 100%;
		border: 0px solid black;
		outline: 0px;
		border-radius: 0.4em;
		height: 2.1vw;
		line-height: 180%;
		font-family: Arial;
		padding: 0px;
		font-size: 0.9em;
		padding-left: 0.4em;
		color: rgb(145, 145, 145);
	}
	
	div.login-form input[type="text"]:first-child {
		margin-bottom: 1%;
	}
	div.login-form1 input[type="text"]:first-child {
		margin-bottom: 1%;
	}	
}

@media screen and (min-aspect-ratio: 11/5) {

	div.header>div {
		height: 100%;
		width: 50%;
	}
	
	div.header>div>div {
		height: 100%;
	}
	
	div#first-pair {
		text-align: left;
		
	}
	
	div#second-pair {
		text-align: right;
		
	}
 
	
	div#header1 {
		width: 50%;
	}
	
	div#header1 img {
		width: 100%;		
	}
	
	div.login-form {
		height: 137%;
	}
	div.login-form1 {
		height: 137%;
	}	
	div.login-title {
		height: 20%;
		display: table;
		width: 101%;
	}
	
	div.login-title>div {
		display: table-cell;
		width: 100%;
		height: 100%;
		vertical-align: middle;
	}
	
	div.login-form form {
		height: 80%;
	}
	div.login-form1 form {
		height: 80%;
	}	
	div.form-sep {
		display: block;
		height: 5%;
	}
	
	div#form-first-row {
		display: block;
		height: 62%;
	}
	
	div#form-first-row>div {
		height: 100%;
		display: block;
		text-align: left;
	}
	
	div#form-first-row>div>div {
		height: 100%;
		display: inline-block;
	}
	
	div#form-first-1 {
		margin-left: 0.3em;
	}
	
	div#form-first-2 {
		vertical-align: top;
		margin-left: 0.3em;
		margin-right: 0.3em;
	}
	
	div#form-first-row img {
		height: 100%;
	}
	
	div#form-second-row {
		display: block;
		height: 23%;
	}
	
	div#form-second-row>div {
		display: block;
		height: 100%;
		text-align: left;
	}
	
	div#form-second-row>div>div {
		height: 100%;
		display: inline-block;
		vertical-align: top;
	}
	
	div#form-second-1 {
		margin-left: 0.3em;
		white-space: nowrap;
	
	}
	
	div#form-second-3 {
		margin-left: 0.3em;
	}
	
	div#form-second-5 {
		margin-left: 0.3em;
		margin-right: 0.3em;
	}
	
	div#form-second-1>div {
		display: inline-block;
		height: 100%;
		padding-left: 0.5em;
		padding-right: 0.5em;
	}
	
	div#form-second-1>div>div{
		height: 100%;
	}
	
	div#form-second-1>div>div:first-child {
		display: inline-block;
		vertical-align: middle;
	}
	
	div#form-second-3>div {
		display: inline-block;
		height: 100%;
		padding-left: 0.5em;
		padding-right: 0.5em;
	}
	
	div#form-second-3>div>div{
		height: 100%;
	}
	
	div#form-second-3>div>div:first-child {
		display: inline-block;
		vertical-align: middle;
	}
	
	div.role-selector.active div.login-marker {
		display: inline-block;
	}
	
	div.login-marker {
		padding-left: 0.3em;
	}
	
	div.login-marker img {
		height: 80%;
	}
	
	div.role-selector {
		
	}
	
	div.login-form input[type="submit"] {
		padding-left: 0.5em;
		padding-right: 0.5em;
	}
	div.login-form1 input[type="submit"] {
		padding-left: 0.5em;
		padding-right: 0.5em;
	}	
	div.login-form input[type="text"], input[type="password"] {
		border: 0px solid black;
		outline: 0px;
		border-radius: 0.4em;
		height: 48%;
		font-family: Arial;
		padding: 0px;
		font-size: 0.9em;
		padding-left: 0.4em;
		color: rgb(145, 145, 145);
	}
	div.login-form1 input[type="text"], input[type="password"] {
		border: 0px solid black;
		outline: 0px;
		border-radius: 0.4em;
		height: 48%;
		font-family: Arial;
		padding: 0px;
		font-size: 0.9em;
		padding-left: 0.4em;
		color: rgb(145, 145, 145);
	}
	
	div.login-form input[type="text"]:first-child {
		margin-bottom: 1%;
	}
	div.login-form1 input[type="text"]:first-child {
		margin-bottom: 1%;
	}
	
	div.footer>div {
		height: 100%;
	}
	
	div.footer>div:first-child>img {
		height: 100%;
	}
}