/* GENERAL STYLES*/
* {
	margin: 0;
	padding: 0; 
}
body {
	font: 0.95em/1.2 Arial, San-Serif;
	width: 100%;
	box-sizing: border-box;
	border-left: 1px solid #777;	
	border-right: 1px solid #777;	
}
ul {
	margin: 0;
	padding: 0;
}
ul li {
	list-style-type: none;
}
a {
	color: #777;
	text-decoration: none;
	font-size: 1.05em;
	font-weight: bold;
}
a:hover {
	color: yellowgreen;
}
p {
	margin: 0;
	padding: 0;
	line-height: 200%;
	text-align: justify; 
}

p:last-child {
	padding-bottom: 25px;
}
.mini {
font-size: 70%;
color:grey;
}

/* HEADER */
.header {
	position: relative;
	height: 160px;
	width: 100%;
	box-sizing: border-box;
	background-color: black;
	/*border: 1px solid yellowgreen;*/
}
.header-img {
	position: absolute;
	top: 8px;
	left: 8px;
	bottom: 10px;
	max-height: 90%;
	width: auto;
}
.header-title {
	position: inherit;
	top: 40%;
	color: yellowgreen;
	text-align: center;
	font-size: 1.7em;
}
.header-line {
	position: inherit;
	top: 43%;
	left: 35%;
	width: 30%;
	border-bottom: 1px solid #777;
}
.header-text {
	position: inherit;
	top: 55%;
	color: #777;
	text-align: center;
	font-size: 0.95em;
	/*border: 1px solid orange;*/
}

/* RIBBON */
.ribbon {
	width: 100%;
	height: 50px;
	background-color: #32382D;
	/*border: solid 1px red;*/
}
.ribbon-title {
	padding-top: 15px;
	width: 100%;
	color: yellowgreen;
	text-align: center;
	font-size: 1.05em;	
	/*border: 1px solid red;*/
}

/* NAVIGATION */
.left-menu {
	float: left;
	padding-top: 40px;
	padding-left: 1.5%;
	padding-right: 1%;
	min-height: 250px;
	width: 12%;
	box-sizing: border-box;
}
.left-menu li{
	margin: 0px;
	padding: 0px;
}
.left-menu a {
	display: block; 
	margin: 0;
	margin-bottom: 30px;
	color: #777;
	font-weight: bold;
	text-align: left;
}
.left-menu li a:hover {
	color: yellowgreen;
}

/* MAIN PART */
.main-container {
	float: left;
	padding-top: 35px;
	padding-right: 15px;	
	padding-left: 25px;
	min-height: 350px;
	width: 88%;
	box-sizing: border-box;
	border-left: 1px solid #777;
	/*border: solid green;*/
}
.main-container h1 {
	font-size: 1.2em;
	color: #777;
}
.main-container h2 {
	font-size: 1.08em;
	color: #777;
        line-height: 250%;
}

.articles {
	margin-bottom: 5px;
	padding: 0;
	height: 110px;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}
.articles p {
	overflow: visible;
	white-space: normal;
}
.articles p:last-child {
	display: inline;/*убираем перенос строки после тэга р*/
}
.articles img {
	position: relative;
	display: block;
	width: auto;
}

.read-more {
	display: block;
	margin-bottom: 10px;
	font-size: 0.9em;
}
/* FOOTER */
.footer {
    clear: both;
	height: 50px;
	background-color: #32382D;
}
.footer h2 {
	padding-top: 16px;
	margin-right: 15px;
	color: #777;
	text-align: right;
	font-size: 0.95em;	
}
@media all and (max-width:800px) and (max-height: 800px){
    .header {
		height: 100px;
	}
	.header-img {
		top: 3px;
		left: 5px;
		bottom: 10px;
		max-height: 95%;
	}
	.header-title {
		font-size: 1.1em;
	}
	.header-text {
		font-size: 0.87em;
	}
	.ribbon {
		height: 30px;
		padding-bottom: 8px;
	}
	.ribbon-title {
		padding-top: 10px;
		font-size: 0.85em;	
	}
    .left-menu {
		width: 20%;
		padding-top: 3%;
		padding-left: 1%;
		padding-right: 5px;
	}
	.main-container {
		width: 80%;
		padding-top: 2.4%;
		padding-left: 15px;
	}
	.footer {
    	height: 30px;
    	padding-bottom: 8px;
	}
	.footer h2 {
	margin-top: 10px;
	font-size: 0.85em;	
	}
}
@media all and (max-width:480px) and (max-height: 480px){
	.header {
		height: 80px;
	}
	.header-img {
		top: 6px;
		left: 4px;
		bottom: 10px;
		max-height: 85%;
	}
	.header-title {
	top: 38%;
    }
    .header-line {
	    top: 41%;
	    left: 26%;
	    width: 48%;
    }
    .header-text {
	    top: 48%;
    }
	.ribbon {
		height: 25px;
		padding-bottom: 8px;
	}
    .left-menu {
		width: 16%;
		padding-top: 3%;
		padding-left: 5px;
		padding-right: 5px;
		font-size: 0.7em;
	}
	.main-container {
		width: 75%;
		padding-top: 2.4%;
		padding-left: 5px;
		padding-right: 5px;
		font-size: 0.8em;
	}
}
.socseti{
	width: 270px; 
	height: 95px;
	/*background: url(../images/sprite_sm.png) no-repeat;*/
	/*padding: 15px;
	border: 1px solid red;*/
}
	/*.socseti p{
		font:14px 'PT-sans', Arial, sans-serif;
		text-transform: uppercase;
		text-align: center;	
		margin-top: 10px;
	}*/
	.socseti ul{
		overflow: hidden;
		width: 270px;
		margin: 0;
	}
		.socseti ul li{
			float: left;
			margin-left:2px;
		}
		.socseti ul li:last-child{
			margin-right: 2px
		}
			.socseti ul li a{
				display: block;
				width: 59px;
				height: 59px;
			}
				a.vk{
					background: url(../images/sprite_sm.png) 0 -59px no-repeat;
				}
					a.vk:hover{
						background: url(../images/sprite_sm.png) 0 0 no-repeat;
					}
				a.tvitter{
					background: url(../images/sprite_sm.png) -59px -59px no-repeat;
				}
					a.tvitter:hover{
						background: url(../images/sprite_sm.png) -59px 0px no-repeat;
				}
				a.googlePlus{
					background: url(../images/sprite_sm.png) -118px -59px no-repeat;
				}
					a.googlePlus:hover{
						background: url(../images/sprite_sm.png) -118px 0 no-repeat;
					}
			
				a.facebook{
					background: url(../images/sprite_sm.png) -177px -59px no-repeat;
				}
					a.facebook:hover{
						background: url(../images/sprite_sm.png) -177px 0 no-repeat;
					}