html * /* perwoe - 4toby ramki wxodili w zadawaemyj razmer elementow, potom prosto parametry shriftow*/
		{
			box-sizing:border-box;
			font-family:Verdana;
		}
		body
		{		
			margin:0 0 120px;
		}
		html
		{	
			min-height:100%;
			width:100%;
			margin:0;
			background:#fff;
			position:relative;
		}
		.pop ul {
			text-align: left;
		}

		.blue{color: #0fafff}
		.orange{color: #ffaf0f}

		a:link {color: #2a94cb}
		a:visited {color: #2a94cb;}
		
		
		#logoimg{
			margin:15px;
		}
		#menucol
		{
			text-align:right;
		}
			
		
		.menu {
			list-style:none;
			white-space:nowrap;
			padding:0;
		}

		.menu li {
			display:inline;
			margin-left:3px;
			margin-right:3px;
		}


		.menu li a:hover {
			border-top:1px solid #2a94cb;border-bottom:1px solid #2a94cb;
		}
		.menu li a:active {
			border-top:1px solid #2a94cb;border-bottom:1px solid #2a94cb;
		}
		.activelink {
			border-top:1px solid #2a94cb;border-bottom:1px solid #2a94cb;
		}

		.menu li a
		{
			/*border:1px solid black;
			border-radius:7px*/
			padding-top:8px;
			padding-left:8px;
			padding-right:8px;
			font-size:24px;
			font-family:Lucida Console;
			text-decoration:none;
		}
		#akt {
			/*border-top:1px solid #2d5336;border-bottom:1px solid #2d5336;*/
			/*border:2px solid black;
			border-radius:7px;*/
			font-weight:bolder;
			background-color:rgb(255,255,255);
			padding-bottom:4px;
			
			/*background:linear-gradient(to right,rgb(209,233,201),rgb(244,253,235),rgb(209,233,201));*/
		}

		.maintitle
		{
			text-align:center;
			padding-top:65px;
			padding-left:40px;
			padding-right:40px;
		}
		
		.text
		{
			max-width:1320px;
			margin-left:auto;
			margin-right:auto;
			font-size:17px;
		}
		
.calctable {
  border-collapse: collapse;
  border-radius: 1em;
  overflow: hidden;
  margin: 0px auto;
}

.calctable th, .calctable  td {
  padding: 1em;
  background: rgba(112, 128, 144, 0.2);
  border: 1px solid white; 
}
		td
		{
			max-width:430px;
			
		}
		
		label
		{
			padding-left:20px;
			padding-right:10px;
		}
		
		.divtable
		{
			display: flex; flex-wrap: wrap;
		}
		.tablecell
		{
			box-sizing: border-box;
			flex-grow: 1;
			width: 33.33%;
			padding: 0.8em 1.2em;
			overflow: hidden;
			list-style: none;
			border: solid 3px white;
			background: rgba(112, 128, 144, 0.2);
		}
		.tablecell2
		{
			box-sizing: border-box;
			flex-grow: 1;
			width: 50%;
			padding: 0.8em 1.2em;
			overflow: hidden;
			list-style: none;
			border: solid 3px white;
			background: rgba(112, 128, 144, 0.2);
		}
		.tablecell3
		{
			box-sizing: border-box;
			flex-grow: 1;
			width: 100%;
			padding: 0.8em 1.2em;
			overflow: hidden;
			list-style: none;
			border: solid 3px white;
			background: rgba(112, 128, 144, 0.2);
		}
		.tablehead
		{
			background-color: slategrey;
  border-color: darken(@tableColour,10%);
  color: white; > h1, > h2, > h3, > h4, > h5, > h6 { color: white; }
		}
		
		.tablecontent:hover
		{
			cursor: cell;
		}		
		
		.checkbox
		{
			transform:scale(1.5);
		}
		
		.logotext{font:32px Lucida Console;}
		
		.tile
		{
			
			margin-top:50px;
			text-align:center;
		}
		.tile:hover
		{			

			
		}
		.frame
		{		
			border:0.25px solid white;
			
			width:310px;height:240px;margin:auto;padding:20px;
			
			animation: ani 0.25s;
			animation-delay:0.1s;
		}
		.frame:hover
		{		
			border:0.25px solid grey;width:290px;height:200px;margin:auto;padding:20px;
			
			animation: ani 0.25s;
			animation-delay:0.1s;
			box-shadow:1px 1px 3px;
		}
		.pcenter
		{
			text-align:center;
		}
		
		@keyframes ani
		{
			from {padding-bottom:0px};
			to {padding-bottom:20px};
		}
		

/* Float Shadow */
.hvr-float-shadow {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  position: relative;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: transform;
  transition-property: transform;
}
.hvr-float-shadow:before {
  pointer-events: none;
  position: absolute;
  z-index: -1;
  content: '';
  top: 100%;
  left: 5%;
  height: 10px;
  width: 90%;
  opacity: 0;
  background: -webkit-radial-gradient(center, ellipse, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 80%);
  background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 80%);
  /* W3C */
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: transform, opacity;
  transition-property: transform, opacity;
}
.hvr-float-shadow:hover, .hvr-float-shadow:focus, .hvr-float-shadow:active {
  -webkit-transform: translateY(-9px);
  transform: translateY(-9px);
    -webkit-transform: scale(1.1);
  transform: scale(1.1);
  
  /* move the element up by 5px */
}
.hvr-float-shadow:hover:before, .hvr-float-shadow:focus:before, .hvr-float-shadow:active:before {
  opacity: 1;
  -webkit-transform: translateY(9px);
  transform: translateY(9px);
  /* move the element down by 5px (it will stay in place because it's attached to the element that also moves up 5px) */
}
#grad{
background: rgb(255,255,255); /* Old browsers */
background: -moz-radial-gradient(center, ellipse cover, rgba(255,255,255,1) 0%, rgba(235,235,235,1) 58%, rgba(255,255,255,1) 100%); /* FF3.6-15 */
background: -webkit-radial-gradient(center, ellipse cover, rgba(255,255,255,1) 0%, rgba(235,235,235,1) 58%, rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: radial-gradient(ellipse at center, rgba(255,255,255,1) 0%, rgba(235,235,235,1) 58%, rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
padding-bottom:30px;
}
#grad2{
background: rgb(255,255,255); /* Old browsers */
background: -moz-radial-gradient(center, ellipse cover, rgba(255,255,255,1) 0%, rgba(239,239,230,1) 58%, rgba(255,255,255,1) 100%); /* FF3.6-15 */
background: -webkit-radial-gradient(center, ellipse cover, rgba(255,255,255,1) 0%, rgba(239,239,230,1) 58%, rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: radial-gradient(ellipse at center, rgba(255,255,255,1) 0%, rgba(239,239,230,1) 58%, rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
padding-bottom:30px;
}

/* Grow Shadow */
.hvr-grow-shadow {
  display: inline-block;
  vertical-align: middle;
/*  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);*/
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: box-shadow, transform;
  transition-property: box-shadow, transform;
}
.hvr-grow-shadow:hover, .hvr-grow-shadow:focus, .hvr-grow-shadow:active {
  box-shadow: 5px 5px 5px 5px rgba(0, 0, 0, 0.5);
/*  -webkit-transform: scale(1.1);
  transform: scale(1.1);*/
}
.pop{visibility:hidden;position:absolute;z-index:99;
  display: block;
  vertical-align: middle;
/*  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);*/
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: box-shadow, transform;
  transition-property: box-shadow, transform;
  width:100%;
 }
.hvr-grow-shadow:hover + .pop{visibility:visible;background:rgba(251,251,251,1);  box-shadow: 5px 5px 5px 5px rgba(0, 0, 0, 0.5);}
	
.pop ul{
	 text-align:left;
}

/* Shadow Radial */
.hvr-shadow-radial {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  position: relative;
}
.hvr-shadow-radial:before, .hvr-shadow-radial:after {
  pointer-events: none;
  position: absolute;
  content: '';
  left: 0;
  width: 100%;
  box-sizing: border-box;
  background-repeat: no-repeat;
  height: 5px;
  opacity: 0;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: opacity;
  transition-property: opacity;
}
.hvr-shadow-radial:before {
  bottom: 100%;
  background: -webkit-radial-gradient(50% 150%, ellipse, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 80%);
  background: radial-gradient(ellipse at 50% 150%, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 80%);
}
.hvr-shadow-radial:after {
  top: 100%;
  background: -webkit-radial-gradient(50% -50%, ellipse, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 80%);
  background: radial-gradient(ellipse at 50% -50%, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 80%);
}
.hvr-shadow-radial:hover:before, .hvr-shadow-radial:focus:before, .hvr-shadow-radial:active:before, .hvr-shadow-radial:hover:after, .hvr-shadow-radial:focus:after, .hvr-shadow-radial:active:after {
  opacity: 1;
}	
		
	
.row-text {
    padding-left: 11%;
    padding-right: 11%;
	display:initial;
}	
		
		#footerrow
		{
			position:absolute;
			bottom:0;
			left:0;
			height:120px;
			width:100%;
			background:linear-gradient(rgb(255,255,255),RGB(204,222,211));
			/*background:linear-gradient(rgb(209,233,201),rgb(255,255,255));*/
			/*background:rgb(209,233,201);*/
		}
		#footercol
		{
			position:absolute;
			bottom:0;
			text-align:center;width:100%;
			font:11px Arial; 
			color:black;
		}
		#footercol a
		{
			font:11px Arial; 
			color:black;
		}
		/*nuzhno sprjatatj menu pri melkoj shirine i sdelatj wyezhajushim*/
		
		
		.nobr{white-space:nowrap;}


		.tooltip
		{
			visibility:hidden;
		}
		.tile:hover .tooltip /*pri nawedenii na jarlyk - sosednij span - widimyj, za4em tut fon - xz, mozhet sbros wydelenija*/
		{
			visibility:visible;
			animation:emerge 1s
		}
		@keyframes emerge
		{
			from {opacity:0};
			to {opacity:1.5};
		}


*/
		/*pri okne boljshe razmera w @media shirina otobrazhajushix kontejnerow, 4toby pomeshalisj rjadom w stroku */
		.col-1{width:8.33%;}
		.col-14{width:12.5%;}
		.col-15{width:21%;}
		.col-16{width:4%;}
		.col-17{width:10%;}
		.col-18{width:15%;}		
		.col-19{width:23.5%;}
		.col-20{width:4.5%;}
		/**/
		.col-2{width:16.66%;}
		.col-3{width:25%;}
		.col-4{width:33.33%;}
		.col-5{width:41.66%;}
		.col-6{width:50%;}
		.col-7{width:58.33%;}
		.col-8{width:66.66%;}
		.col-9{width:75%;}
		.col-10{width:83.33%;}
		.col-11{width:91.66%;}
		.col-12{width:100%;}
		
		
		/*tipa o4ishaem prostranstwo posle stroki..*/
		.row:after, .row-head:after,.row-head-2:after, .row-content:after
		{
			content:"";
			clear:both;
			display:block;
		}
						
		.row /*prosto formatiruem stroku, ramka, wneshnij otstup wrode ne tak 4toby nuzhen, wnutrennij otstup, shirina.. */
		{
			border: 2px solid #1c2a8f;
			/*margin:10px;*/
			margin-top:20px;
			margin-bottom:20px;
			margin-left:2%;
			margin-right:2%;
			width:96%;
			padding:5px;
			/*display:table;*/
			/*sdelatj, 4toby ugly strok byli kruglymi */
			border-radius:6px;
			box-shadow:3px 5px 2px #aaaaaa;
			background-color:#ffffff
		}
		.row-content
		{
			display: flex; 
			align-items: center;
			justify-content: center;
		}
		.row-content-flex
		{
			display: flex; 
			align-items: center;
			justify-content: center;
		}
		[class*="col-"] /*wse kolonki pareniem stawim drug rjadom s drugom */
		{
			position:relative;
			/* border:2px solid green; */
			float:left;
			/*display:table-cell;*/
			padding-top:4px;
			padding-bottom:4px;
		}


		


		@media only screen and (max-width:1039px)
		{

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

			
		}
		
		@media only screen and (max-width:768px)
		{
			[class*="col-"]
			{
				width:100%;
			}
			
			.row-content
			{
				display:block;
			}
			
						
			#logocol
			{
				text-align:center;
				display:block;
			}
			
			
			#menucol
			{
				text-align:center;
			}
			#logoimg{
				margin:10px;
				width:190px;
			}

			.menu li a
			{
/*				margin-top:10px;
				margin-bottom:10px;*/
				font-size:18px;
			}			
					

			/*pri melkix shirinax nuzhno otzentrirowatj polja wybora*/
			
/*			.menu li{
				display:none;
			}*/
			#menulabel{
				
				display:inline;	
				z-index:5;
			}
			
			




			

			#menulabel
			{
				top:8px
			}
			#logoimgdiv
			{
				/*position:fixed;*/
				z-index:15;
				left:42px;
			}


			.respImg
			{
				width:100%;
			}
			
			
			#num0img
			{
				 background-attachment: scroll;
			}
			#num1img
			{
				 background-attachment: scroll;
			}
			#num2img
			{
				 background-attachment: scroll;
			}
			
			.divtable
			{
				display: block;
			}
			.tablecell
			{
				width:100%;
			}
			.tablecell2
			{
				width:100%;
			}
		}
		


	
	
