@import url(https://fonts.googleapis.com/css?family=Philosopher:400,400italic,700,700italic&subset=latin,cyrillic);

p{
	font: 15px 'Philosopher', sans-serif;
	color: #000000;
}
span.bigtext{
	font: italic bold 41px/34px 'Philosopher', sans-serif;
	color: #000000;
}
.js-hover-on-click .back{
	display: none !important;
}
.js-hover-on-click .front{
	display: block !important;
}
.js-hover-on-click:hover .back, .js-hover-on-click.hover .back{
	display: block !important;
}
.js-hover-on-click:hover .front, .js-hover-on-click.hover .front{
	display: none !important;
}

.wrapper{
	width: 888px;
	margin: 0 auto;
	overflow: hidden;
}
#head{
	height: 260px;
	position: relative;
}
	#head #logo{
		position: absolute;
		display: block;
		left: 0px;
		top: 30px;
		width: 200px;
		height: 200px;
		cursor: pointer;
		background: url('../img/logo.png') no-repeat;
	}
	#head .bigtext{
		display: block;
		position: absolute;
		left: 255px;
		top: 145px;
		text-decoration: none;
		width: 610px;
	}

.textblock{
	min-height: 120px;
	margin-bottom: 30px;
	position: relative;	
	padding: 20px 240px 20px 14px;
}
	.textblock p{
		margin-bottom: 10px;
	}
	.textblock a{
		font-family: 'Philosopher', sans-serif;
	}
	.textblock .blocklink {
		height: 200px;
		margin-top: -100px;
		position: absolute;
		right: 0;
		top: 50%;
		width: 200px;
	}
		.textblock .blocklink .back, .textblock .blocklink .front{
			width: 200px;
			height: 177px;
			text-align: center;
			padding-top: 23px;
		}
		.textblock .blocklink .back{
			cursor: pointer;
			background-color: #ed1c24;
		}
		.textblock .blocklink .back{
			display: none;
		}
		.textblock .blocklink:hover .back{
			display: block;
		}
		.textblock .blocklink:hover .front{
			display: none;
		}
		.textblock .blocklink a.back{
			text-decoration: underline;
			color: #ffffff;
			font: 21px/27px 'Philosopher', sans-serif;
		}
		.textblock .blocklink .front{
			display: block;
		}
		.textblock .blocklink .front{
			background-color: #808080;
			
		}


	
.blocklist{
	margin-bottom: 5px;
	width: 920px;
}
	.blocklist .blockcontainer{
		width: 430px;
		height: 200px;
		float: left;
		margin-right: 30px;
		margin-bottom: 30px;
		display: block;
		text-decoration: none;
		position: relative;
	}
	.blocklist .blockcontainer.text{
		background-color: #e6e6e6;
		padding: 15px 10px;
		height: 170px;
		width: 410px;
	}
	.blocklist .blockcontainer.different{
		background-color: #e6e6e6;
	}
	.blocklist .blockcontainer.different .back{
		display: none;
	}	
	.blocklist .blockcontainer.different:hover .back{
		display: block;
	}
	.blocklist .blockcontainer.different:hover .front{
		display: none;
	}
	.blocklist .blockcontainer.center{
		text-align: center;
	}
		.blocklist .blockcontainer.text > img{
			margin: 10px 0;
		}
		.blocklist .blockcontainer .normal,.blocklist .blockcontainer .bold{
			color: #000000;
			font: 14px 'Philosopher', sans-serif; 
		}
		.blocklist .blockcontainer .bold{
			font-weight: bold;
		}
		.blocklist .blockcontainer > .front{
			display: block;
		}
		.blocklist .blockcontainer.different > .front, .blocklist .blockcontainer.different .back{
			position: relative;
		}
			.blocklist .blockcontainer.different .name, .blocklist .blockcontainer.different > .back .name{
				position: absolute;
				left: 16px;
				top: 60px;
				font: bold 41px 'Philosopher', sans-serif; 
				color: #010000;
			}
			.blocklist .blockcontainer.different .icon, .blocklist .blockcontainer.different > .back .icon{
				width: 130px;
				height: 112px;
				position: absolute;
				display: block;
				right: 35px;
				top: 41px;
			}
			.blocklist .blockcontainer.different > .back .name{
				color: #ffffff;
			}
		.blocklist .blockcontainer .back{
			background-color: #ed1c24;
			position: absolute;
			left: 0px;
			top: 0px;
			padding: 10px;
			padding-top: 28px;
			width: 410px;
			height: 162px;
			display: block;
			z-index: 500;
		}
			.blocklist .blockcontainer  .back .name, .blocklist .blockcontainer .smallblock.left  .back .name{
				display: block;
				color: #ffffff;
				font: italic bold 20px/24px 'Philosopher', sans-serif;
				text-transform: uppercase;
				text-decoration: none;
				padding-bottom: 5px;
				width: 179px;
			}
			.blocklist .blockcontainer .smallblock.right .back .name{
				padding-left: 230px;
			}		
			.blocklist .blockcontainer .smallblock.right .back{
				position: absolute;
				right: 0px;
				left: auto !important;
			}		
			.blocklist .blockcontainer .smallblock .back .linklist, .blocklist .blockcontainer .smallblock .back .linklist a{
				text-transform: uppercase;
				color: #ffffff;
				font: italic 16px 'Philosopher', sans-serif;
			}
			.blocklist .blockcontainer > .back .linklist a{
				text-decoration: underline;
			}
			.blocklist  .blockcontainer .smallblock{
				float: left;
				width: 200px;
				height: 200px;
				margin-right: 30px;
				background-color: #e6e6e6;
				position: relative;		
			}
				.blocklist  .blockcontainer .smallblock img{
					position: absolute;
					right: 1px;
					bottom: 1px;
				}

				.blocklist  .blockcontainer .smallblock .front .name{
					display: block;
					padding: 10px;
					padding-top: 28px;	
					padding-bottom: 20px;		
					width: 179px;
					color: #000000;
					font: italic bold 20px/24px 'Philosopher', sans-serif;
					text-transform: uppercase;
					text-decoration: none;
				}
#footer{
	padding-top: 15px;
	height: 135px;
	padding-left: 5px;
}
	#footer p{
		font: 18px 'Philosopher', sans-serif;
		color: #000000;
	}