@charset "utf-8";
/* CSS Document */

*{
  margin:0;
  padding:0;
  box-sizing:border-box;	
}
body{
	margin: 0;
    font:100%/1.5em Arial,Helvetica, sens-serif;
    text-align:justify;
}
article, aside, footer, section, nav{
	display:block;
}
p.link{
	text-align:center;
	margin-top:3%;
}
a.link{
	background-color:#0e61a7;
	color:white;
	padding:1%;
}
.blue{
	background-color:#0e61a7;
	margin:-0.5em;
	padding:1em 1em;
	text-align:center;
	color:#FFF;
}
h2{
	font: bold 22px Arial, Helvetica, sans-serif;
}
article{
	padding:20px 1% 10px 1%;/*10px 1% 10px 1%*/
	width:79%;
    color:#0e61a7;
	float:left;
}
article.main {
	color:#006;
	width:100%;
	float:none;
	text-align:justify;
	padding:20px 1% 10px 1%;/*10px 1% 10px 1%*/
}
aside.index {
	padding:20px 1% 10px 1%;/*10px 1% 10px 1%*/
	width:20%;
	float:left;
	text-align:center;
}
footer{
	font: bold 15px Arial, Helvetica, sans-serif;
	background-color:#0e61a7;
	color:#FFF;
	padding-left:15px;
	padding-right:15px;
	padding-top:15px;
	padding-bottom:15px;
}

/*menu*/
.nav {
	margin: 0;
	position: relative;
}
.nav ul {
	margin: 0;
	padding: 0;
	background-color:#0e61a7;
}
.nav li {
	list-style: none;
	display: inline-block;
	padding-top: 10px;
	padding-bottom: 10px;
}
.nav a {
	font:bold 15px Arial, Helvetica, sans-serif;
	padding-left:9px;
	padding-right:8px;
	text-decoration: none;
	color:#FFF;
	line-height: 100%;
}
.nav a:hover {
	color:#FFF;
}
.nav .current a {
	color: #fff;
}


/*flexible media*/
section.cols {
	margin: 0;
}
/*fluid grid*/
.container{
	width:100%;/*основа - 960,650, 320px*/
/*	margin:0 auto;*/
}
.container .cols{
	float:left;
/*	margin:0 0 1em;
	padding: 0 1em;*/
}
.container .cols.col-1{width:8.333333333%;}/*100/12столбцов*/
.container .cols.col-2{width:16.66666667%;}/*100/12*2столбцов*/
.container .cols.col-3{width:25%;}/*100/12*3столбцов*/
.container .cols.col-4{width:33.33333333%;}
.container .cols.col-5{width:41.66666667%;}
.container .cols.col-6{width:50%; }
.container .cols.col-7{width:58,33333333%;}
.container .cols.col-8{width:66,66666667%;}
.container .cols.col-9{width:75%;}
.container .cols.col-10{width:83,33333333%;}
.container .cols.col-11{width:91,66666667%;}
.container .cols.col-12{width:100%;}
.container:before,
.container:after,
.row:after,
.row:before,
.clear:before,
.clear:after{
	content: " ";
	display: table;
}
.container:after,
.row:after,
.clear:after{
	clear:both;
}

@media screen and (min-width:1200px){
	article{
		padding:20px 1% 10px 1%;/*10px 1% 10px 1%*/
		width:85%;
		color:#0e61a7;
		float:left;
	}
	aside.index {
		padding:20px 1% 10px 1%;/*10px 1% 10px 1%*/
		width:12%;
		float:left;
		text-align:center;
	}
}
@media screen and (max-width:650px){
	.container .cols.col-1,
	.container .cols.col-2,
	.container .cols.col-3,
	.container .cols.col-4,
	.container .cols.col-5,
	.container .cols.col-6,
	.container .cols.col-7,
	.container .cols.col-8,
	.container .cols.col-9,
	.container .cols.col-10,
	.container .cols.col-11,
	.container .cols.col-12{width:100%;  }

	a.link{
	padding:3%;
	margin-top:3%;
        }
	.blue{
	background-color:#0e61a7;
	padding:0.6em 0.6em;
	text-align:center;
	color:#FFF;
	}
	h2{
		font:bold 16px Arial, Helvetica, sans-serif;
	}
	article{
		width:100%;
		color:#0e61a7;
		padding:4%;
	}
	aside.index {
		text-align:center;
		width:100%;
	}
	footer{
		font: bold 12px Arial, Helvetica, sans-serif;
	}
	/*menu*/
	.nav {
		position: relative;
		min-height: 40px;
	}	
	.nav ul {
		width: 100%;
		padding: 0;
		position: absolute;
		top: 0;
		left: 0;
		background: #0e61a7 url(img/icon-menu.png) no-repeat 10px 18px;
	}
	.nav li {
		display: none; /* скройте все элементы <li> */
		margin: 0;
	}
	.nav .current {
		display: block; /* показывайте только текущий элемент <li> */
	}
	.nav a {
		font:bold 15px Arial, Helvetica, sans-serif;
		text-decoration: none;
		display: block;
		padding: 5px 0px 5px 30px;
		text-align: left;
		color:#FFF;
	}
	.nav .current a {
		background: none;
		color:#FFF;
	}

	/* при проведении мышью */
	.nav ul:hover {
		position: relative;
		background-image: none;
	}
	.nav ul:hover li {
		display: block;
	}
	.nav ul:hover .current {
		background: url(img/icon-check.png) no-repeat 10px 18px;
	}
}