@font-face {
    font-family: Roboto;
    src: url(font/1.ttf);
	font-size: 400;
}
@font-face {
    font-family: RobotoBold;
    src: url(font/gothampro-bold.ttf);
	font-size: 700;
}
@font-face {
    font-family: RobotoMedium;
    src: url(font/gothampro-medium.ttf);
}
@font-face {
    font-family: RobotoLight;
    src: url(font/gothampro-light.ttf);
}

*{
	box-sizing: border-box;
}

body{
	font-family: Roboto, Verdana;
	width: 100% !important;
	margin: 0;
	padding: 0;
	font-size: 16px;
}

/*Заголовок*/
header{
	width: 100%;
}
		
	.menuSection{
		width: 100%;
		background: rgba(0, 96, 174, 0.16);
		font: 12px RobotoBold;
		text-transform: uppercase;
		position: relative;
	}
		.navbar-header{
			display: none;
		}
		.menuBlock{
			width: 100%;
			max-width: 1000px;
			margin: auto;
		}
			.navbar-nav li{
				padding: 17px 11px 23px 11px;
			}
			
			.logoMobile{
				display: none;
			}
			
	.headerInfoSection{
		overflow: hidden;
		width: 100%;
		padding: 7px 10px;
		max-width: 1100px;
		margin: auto;
	}
		.headerInfo-1{
			
		}
			.headerInfo-1 img{
				max-width: 65px;
				float: left;
				margin-right: 10px;
			}
			.logoText{
				float: left;
				font: 17px RobotoMedium;
				padding-top: 10px;
				color: #000;
			}
			.logoText span{
				font: 23px RobotoMedium;
			}
			
		.headerInfo-2{
			text-align: center;
			font: 19px RobotoBold;
			margin-top: 10px;
		}
			.headerInfoTime{
				font: 12px Roboto;
				color: #555;
				margin-top: 7px;
			}
		.headerInfo-3{

		}
			.socialHeaderBlock{
				float: right;
			}
			.socialHeaderBlock div{
				background: rgba(0, 0, 0, 0.1);
				padding: 10px;
				border-radius: 50%;
				margin: 10px 7px;
				float: left;
				opacity: 1;
				-webkit-transition: all 0.3s ease;;
				-moz-transition: all 0.3s ease;;
				-o-transition: all 0.3s ease;;
				transition: all 0.3s ease;
			}
			.socialHeaderBlock div:hover{
				opacity: 0.80;
			}
				.headerInfo-3 img{
					width: 24px;
				}
				
	#slider_volna {
		height: 16px;
		width: 100%;
		background: url(../img/css/volna-bg.png) repeat-x;
		position: absolute;
		bottom: -7px;
		left: 0;
		z-index: 10;
	}

@media screen and (min-width: 820px) and (max-width: 1000px){
.menuSection{
	font: 11px RobotoBold;
}
	#navbarCollapse{
		padding: 0 5px;
	}
		.menuBlock{
			max-width: 815px;
		}
			.navbar-nav li{
				padding: 17px 5px 20px 5px;
			}
}

@media screen and (min-width: 769px) and (max-width: 819px){
.menuSection{
	font: 10px RobotoBold;
}
	#navbarCollapse{
		padding: 0 5px;
	}
		.menuBlock{
			max-width: 740px;
		}
			.navbar-nav li{
				padding: 17px 5px 20px 5px;
			}
}

@media screen and (max-width: 768px){
.menuSection{
	font: 12px RobotoBold;
}
	#navbarCollapse{
		overflow: hidden;
	}
		.menuBlock{
			max-width: 768px;
		}
			.navbar-header{
				display: block;
			}
			.navbar-nav li{
				text-align: center;
				padding: 10px 5px;
			}
			.logoMobile{
				display: block;
			}
			.headerInfo-1{
				text-transform: none;
			}
				.headerInfo-1 img{
					max-width: 45px;
					margin: 4px 10px 0 0;
				}
				.logoText{
					font: 13px RobotoMedium;
					padding-top: 8px;
					color: #000;
				}
				.logoText span{
					font: 17px RobotoMedium;
				}
				
	.headerInfoSection{
		padding: 7px 5px;
	}
		.headerInfo-2{
			text-align: left;
		}
}

@media screen and (max-width: 370px){
.headerInfo-2{
	text-align: center;
	font: 17px RobotoBold;
	margin-top: 10px;
	width: 100%;
}
	.headerInfoTime{
		font: 11px Roboto;
		margin-top: 7px;
	}
.headerInfo-3{
	width: 100%;
}
	.socialHeaderBlock{
		float: none;
		width: 115px;
		margin: auto;
	}
	.socialHeaderBlock div{
		padding: 10px;
		margin: 10px 7px;
		float: left;
	}
		.headerInfo-3 img{
			width: 20px;
		}
}

@media screen and (max-width: 300px){
.headerInfo-1 img{
	max-width: 40px;
	margin: 4px 10px 0 0;
}
.logoText{
	font: 12px RobotoMedium;
	padding-top: 8px;
	color: #000;
}
	.logoText span{
		font: 15px RobotoMedium;
	}
}
/*Конец Заголовок*/



/*О нас*/	
.aboutSection{
	width: 100%;
	background: rgb(247, 245, 245);
}
	.aboutBlock{
		overflow: hidden;
		width: 100%;
	}
			.aboutTextBlock{
				padding: 30px 20px 20px 4%;
				width: 56%;
				float: left;
			}
				.aboutTitle{
					font: 25px Roboto;
					height: 58px;
					margin: 0 0 10px 0;
					background: url(../img/css/blue-volna.svg) no-repeat 0 86%;
					background-size: 75px 5px;
				}			
				.aboutText{
					font: 15px Roboto;
					color: #444;
					line-height: 1.2;
				}
					.aboutText ul{
						list-style-image: url(../img/css/icon11.png);
						margin: 0;
						padding: 0 0 0 30px;
					}
			.aboutImg{
				background: rgb(247, 245, 245);
				padding: 0;
				width: 44%;
				float: left;
			}
				.aboutImg img{
					width: 100%;
				}


@media screen and (min-width: 1135px) and (max-width: 1270px){		
	.aboutTextBlock{
		padding: 25px 10px 10px 25px;
		width: 50%;
	}
		.aboutTitle{
			font: 23px Roboto;
			height: 50px;
		}	
	.aboutImg{
		background: rgb(247, 245, 245);
		width: 50%;
	}	
}

@media screen and (min-width: 1000px) and (max-width: 1135px){			
	.aboutTextBlock{
		padding: 20px 10px 0 20px;
		width: 45%;
		float: left;
	}
		.aboutTitle{
			font: 22px Roboto;
			height: 48px;
			margin: 0 0 10px 0;
		}			
		.aboutText{
			font: 14px Roboto;
		}
			.aboutText p{
				margin-bottom: 5px;
			}
			.aboutText ul{
				padding: 0 0 0 25px;
			}
	.aboutImg{
		width: 55%;
	}
}

@media screen and (min-width: 950px) and (max-width: 1000px){	
	.aboutTextBlock{
		padding: 15px;
		width: 45%;
	}
		.aboutTitle{
			font: 20px Roboto;
			height: 40px;
			margin: 0 0 10px 0;
			background-size: 65px 5px;
		}			
		.aboutText{
			font: 14px Roboto;
		}
			.aboutText p{
				
			}
			.aboutTextHidden{
				display: none;
			}
			.aboutText ul{
				padding: 0 0 0 22px;
			}
	.aboutImg{
		width: 55%;
	}
}

@media screen and (min-width: 500px) and (max-width: 950px){	
	.aboutSection{
		background: url(../img/css/bg3.png) center center;
		background-size: cover;
	}
		.aboutBlock{
			background: rgba(235, 235, 235, 0.85);
		}
			.aboutTextBlock{
				padding: 30px 20px;
				width: 100%;
				float: none;
			}
				.aboutTitle{
					font: 23px Roboto;
					height: 50px;
					background: url(../img/css/blue-volna.svg) no-repeat 50% 86%;
					background-size: 70px 5px;
					text-align: center;
				}	
			.aboutImg{
				display: none;
			}
}

@media screen and (min-width: 350px) and (max-width: 500px){	
	.aboutSection{
		background: url(../img/css/bg3.png) center center;
		background-size: cover;
	}

		.aboutBlock{
			background: rgba(235, 235, 235, 0.85);
		}
				.aboutTextBlock{
					padding: 20px 10px;
					width: 100%;
					float: none;
				}
					.aboutTitle{
						font: 18px Roboto;
						height: 50px;
						background: url(../img/css/blue-volna.svg) no-repeat 50% 86%;
						background-size: 70px 5px;
						text-align: center;
					}			
					.aboutText{
						font: 14px Roboto;
					}
				.aboutImg{
					display: none;
				}
}

@media screen and (max-width: 350px){	
	.aboutSection{
		background: url(../img/css/bg3.png) center center;
		background-size: cover;
	}

		.aboutBlock{
			background: rgba(235, 235, 235, 0.85);
		}
				.aboutTextBlock{
					padding: 20px 10px;
					width: 100%;
					float: none;
				}
					.aboutTitle{
						font: 16px Roboto;
						height: 50px;
						background: url(../img/css/blue-volna.svg) no-repeat 50% 86%;
						background-size: 70px 5px;
						text-align: center;
					}			
					.aboutText{
						font: 13px Roboto;
					}
						.aboutTextHidden{
							display: none;
						}
						.aboutText ul{
							padding: 0 0 0 17px;
						}
				.aboutImg{
					display: none;
				}
}
/*Конец О нас*/	



/*Почему мы*/
.whySection{
	width: 100%;
	max-width: 1800px;
	background: url(../img/css/bg2.jpg) center center;
	background-size: cover;
	min-height: 450px;
}
	.whyBlock{
		width: 100%;
		min-height: 450px;
		padding: 100px 30px;
		background: rgba(28, 28, 28, 0.8);
	}
		.whyWidth1{
			width: 28%;
			float: left;
			position: relative;
			padding: 0 15px;
		}
		.whyWidth2{
			width: 36%;
			float: left;
			position: relative;
			padding: 0 15px;
		}
			.titleWhyBlock{
				max-width: 300px;
				color: #fff;
			}
				.titleWhy1{
					font: 75px RobotoLight;
					padding: 0;
					margin: 0;
					line-height: 1;
					letter-spacing: 1px;
				}
				.titleWhy2{
					font: 24px RobotoLight;
					padding: 0;
					margin: 0;
					line-height: 1.2;
					margin: 0 0 15px 0;
				}
				.titleWhy3{
					font: 17px RobotoLight;
					padding: 0;
				}
			
			.whyReasonBlock{
				overflow: hidden;
				margin-bottom: 40px;
			}
				.whyReasonImg{
					padding: 20px;
					border: 1px solid #99CFF0;
					float: left;
					margin-right: 20px;
				}
					.whyReasonImg img{
						width: 100%;
						max-width: 45px;
					}
				.whyReasonText{
					margin-top: 13px;
				}
					.whyReasonText h3{
						font: 18px RobotoMedium;
						color: #eee;
						margin: 0;
					}
					.whyReasonText p{
						font: 14px Roboto;
						color: #a8a5ab;
						line-height: 1.3;
					}

@media screen and (min-width: 953px) and (max-width: 1150px){				
	.whySection{
		min-height: 420px;
	}
		.whyBlock{
			min-height: 420px;
			padding: 120px 10px 0 10px;
		}
			.whyWidth1{
				padding: 0 10px;
			}
			.whyWidth2{
				padding: 0 10px;
			}
					.titleWhy1{
						font: 55px RobotoLight;
					}
					.titleWhy2{
						font: 19px RobotoLight;
						margin: 0 0 12px 0;
					}
					.titleWhy3{
						font: 15px RobotoLight;
					}

					.whyReasonImg{
						padding: 14px;
						margin-right: 10px;
					}
						.whyReasonImg img{
							max-width: 40px;
						}
					.whyReasonText{
						margin-top: 10px;
					}
						.whyReasonText h3{
							font: 17px RobotoMedium;
						}
						.whyReasonText p{
							font: 13px Roboto;
						}			
}	

@media screen and (min-width: 768px) and (max-width: 953px){	
	.whySection{
		min-height: 500px;
	}
		.whyBlock{
			min-height: 500px;
			padding: 20px;
		}
			.whyWidth1{
				width: 100%;
				float: none;
				padding: 0 0 15px 0;
				text-align: center;
			}
			.whyWidth2{
				width: 50%;
				padding: 15px 0;
			}
				.titleWhyBlock{
					max-width: 350px;
					margin: auto;
				}
					.titleWhy1{
						font: 65px RobotoLight;
					}
}

@media screen and (min-width: 640px) and (max-width: 768px){
	.whySection{
		min-height: 450px;
	}
		.whyBlock{
			min-height: 450px;
			padding: 20px;
		}
			.whyWidth1{
				width: 100%;
				float: none;
				padding: 0 0 15px 0;
				text-align: center;
			}
			.whyWidth2{
				width: 50%;
				padding: 15px 5px;
			}
				.titleWhyBlock{
					max-width: 350px;
					margin: auto;
				}
					.titleWhy1{
						font: 65px RobotoLight;
					}
					.titleWhy2{
						font: 19px RobotoLight;
						margin: 0 0 12px 0;
					}
					.titleWhy3{
						font: 15px RobotoLight;
					}
				
					.whyReasonImg{
						padding: 10px;
						margin-right: 10px;
					}
						.whyReasonImg img{
							max-width: 30px;
						}
					.whyReasonText{
						margin-top: 0px;
					}
						.whyReasonText h3{
							font: 16px RobotoMedium;
						}
						.whyReasonText p{
							font: 13px Roboto;
						}
}

@media screen and (min-width: 370px) and (max-width: 640px){
	.whySection{
		min-height: 550px;
	}
		.whyBlock{
			min-height: 550px;
			padding: 20px;
		}
			.whyWidth1{
				width: 100%;
				float: none;
				padding: 10px 0;
			}
			.whyWidth2{
				width: 100%;
				float: none;
				padding: 0;
			}
				.titleWhyBlock{
					max-width: 300px;
					text-align: center;
					margin: auto;
				}
					.titleWhy1{
						font: 45px RobotoLight;
					}
					.titleWhy2{
						font: 18px RobotoLight;
						margin: 0 0 15px 0;
					}
					.titleWhy3{
						font: 14px RobotoLight;
					}
				
				.whyReasonBlock{
					margin-bottom: 10px;
				}
					.whyReasonImg{
						text-align: center;
						padding: 15px;
						margin-right: 10px;
					}
						.whyReasonImg img{
							max-width: 35px;
						}
					.whyReasonText{
						margin-top: 10px;
					}
						.whyReasonText h3{
							font: 17px RobotoMedium;
						}
						.whyReasonText p{
							font: 14px Roboto;
						}
}

@media screen and (max-width: 370px){
	.whySection{
		min-height: 500px;
	}
		.whyBlock{
			min-height: 500px;
			padding: 20px 5px;
		}
			.whyWidth1{
				width: 100%;
				float: none;
				padding: 10px 0;
			}
			.whyWidth2{
				width: 100%;
				float: none;
				padding: 0;
			}
				.titleWhyBlock{
					max-width: 300px;
					text-align: center;
					margin: auto;
				}
					.titleWhy1{
						font: 40px RobotoLight;
					}
					.titleWhy2{
						font: 17px RobotoLight;
						margin: 0 0 15px 0;
					}
					.titleWhy3{
						font: 13px RobotoLight;
					}
				
				.whyReasonBlock{
					margin-bottom: 10px;
				}
					.whyReasonImg{
						padding: 10px;
						margin-right: 10px;
					}
						.whyReasonImg img{
							max-width: 30px;
						}
					.whyReasonText{
						margin-top: 0;
					}
						.whyReasonText h3{
							font: 14px RobotoMedium;
						}
						.whyReasonText p{
							font: 13px Roboto;
						}
}
/*Конец Почему мы*/



/*Наши клиенты*/			
.clientSection{
	width: 100%;
	max-width: 1100px;
	margin: auto;
}
	.clientBlock{
		overflow: hidden;
		padding: 60px 20px 30px 20px;
	}
		.borderClientBlock1{
			position: relative;
			height: 50px;
			border-top: 5px solid #0060ae;
			border-left: 5px solid #0060ae;
			border-right: 5px solid #0060ae;
			margin-bottom: 15px;
		}
			.clientTitle{
				position: absolute;
				left: 20%;
				top: -48px;
				background: #fff;
				padding: 0 20px;
			}
				.clientTitle h2{
					font: 32px RobotoBold;
					text-transform: uppercase;
					margin: 0;
					color: #000;
				}
				.clientTitle h2 span{
					font: 40px RobotoBold;
				}
				
		.borderClientBlock2{
			height: 50px;
			border-bottom: 5px solid #0060ae;
			border-left: 5px solid #0060ae;
			border-right: 5px solid #0060ae;
			margin-top: 5px;
		}
		.client{
			padding: 0 15px;
			text-align: center;
		}
			.client img{
				width: 100%;
				max-width: 200px;
				margin: auto;
			}
			#owl-example2 .owl-controls{
				display: none !important;
			}

@media screen and (max-width: 500px){	
	.clientBlock{
		padding: 60px 20px 30px 20px;
	}
		.borderClientBlock1{
			margin-bottom: 5px;
		}
			.clientTitle{
				left: 7%;
				top: -30px;
				padding: 0 10px;
			}
				.clientTitle h2{
					font: 20px RobotoBold;
				}
					.clientTitle h2 span{
						font: 24px RobotoBold;
					}	
		.borderClientBlock2{
			height: 30px;
		}
}	
/*Конец Наши клиенты*/



/*Услуги*/
.serviceSection{
	width: 100%;
	background: #efefef;
	padding: 40px 5px;
}
	.serviceMainBlock{
		width: 100%;
		max-width: 1350px;
		margin: auto;
	}
		.serviceBlock1{
			overflow: hidden;
		}
			.serviceBlock{
				width: 50%;
				float: left;
				padding: 10px;
			}
				.textServiceBlock{
					width: 60%;
					float: left;
					padding: 5px 20px;
				}
					.headTextServiceBlock{
						
					}
						.headTextServiceBlock h3{
							font: 20px RobotoBold;
							color: #000;
							margin: 0 0 5px;
						}
						.headTextServiceBlock p{
							font: 13px Roboto;
						}
					.infoServiceMainBlock{
						overflow: hidden;
						margin: 15px 0;
					}
						.infoServiceBlock{
							width: 50%;
						}
							.headInfoService{
								margin: 0;
							}
								.headInfoService p{
									padding: 0 0 5px 0;
									margin: 0;
									color: #222;
									font: 14px RobotoMedium;
								}
								.lineHeadInfoService{
									border-bottom: 1px solid #333;
									width: 144px;
								}
							.textInfoService{
								padding: 5px 0;
							}
								.textInfoService p{
									font: 15px Roboto;
									margin: 0;
								}
									.textInfoService p span{
										font: 23px RobotoMedium;
										color: #0060ae;
									}
					.buttonServiceBlock{
						padding: 5px 10px;
						border: 2px solid #555;
						color: #222;
						display: inline-block;
						font: 15px RobotoMedium;
						-webkit-transition: all 0.5s linear 0.1s;
						 -moz-transition: all 0.5s linear 0.1s;
						 -o-transition: all 0.5s linear 0.1s;
						 transition: all 0.5s linear 0.1s;
					}
					.buttonServiceBlock:hover{
						color: #0060ae;
						border: 2px solid transparent;
					}
				
				.imgServiceBlock{
					width: 40%;
					float: left;
					text-align: center;
				}
					.imgServiceBlock img{
						width: 100%;
						max-width: 300px;
					}		

@media screen and (min-width: 700px) and (max-width: 1190px){
	.serviceSection{
		padding: 30px 5px;
	}
		.serviceMainBlock{
			max-width: 800px;
		}
			.serviceBlock{
				width: 100%;
				padding: 15px 10px;
			}
						.headTextServiceBlock h3{
							font: 23px RobotoBold;
						}
						.headTextServiceBlock p{
							font: 15px Roboto;
						}
					.infoServiceMainBlock{
						margin: 25px 0;
					}
						.infoServiceBlock{
							max-width: 190px;
						}
}

@media screen and (min-width: 580px) and (max-width: 699px){
	.serviceSection{
		padding: 20px 5px;
	}
				.textServiceBlock{
					width: 100%;
					padding: 5px;
				}
						.headTextServiceBlock h3{
							font: 16px RobotoBold;
						}
						.headTextServiceBlock p{
							font: 12px Roboto;
						}
								.headInfoService p{
									font: 12px RobotoMedium;
								}
								.lineHeadInfoService{
									width: 124px;
								}
				.imgServiceBlock{
					display: none;
				}	
}

@media screen and (min-width: 450px) and (max-width: 579px){
	.serviceSection{
		padding: 20px 5px;
	}
			.serviceBlock{
				width: 100%;
				padding: 10px;
			}
				.textServiceBlock{
					width: 60%;
					padding: 0 7px;
				}
						.headTextServiceBlock h3{
							font: 16px RobotoBold;
						}
						.headTextServiceBlock p{
							font: 11px Roboto;
						}
					.infoServiceMainBlock{
						margin: 5px 0;
					}
								.headInfoService p{
									font: 12px RobotoMedium;
								}
								.lineHeadInfoService{
									width: 114px;
								}
								.textInfoService p{
									font: 13px Roboto;
									margin: 0;
								}
									.textInfoService p span{
										font: 20px RobotoMedium;
									}
					.buttonServiceBlock{
						padding: 3px 10px;
						font: 13px RobotoMedium;
					}
}

@media screen and (max-width: 449px){
	.serviceSection{
		padding: 10px 5px;
	}
			.serviceBlock{
				width: 100%;
				padding: 0;
			}
				.textServiceBlock{
					width: 100%;
					padding: 10px 5px;
				}
						.headTextServiceBlock h3{
							font: 20px RobotoBold;
						}
						.infoServiceBlock{
							width: 50%;
							max-width: 130px;
						}
								.headInfoService p{
									font: 12px RobotoMedium;
								}
								.lineHeadInfoService{
									width: 100px;
								}
								.textInfoService p{
									font: 14px Roboto;
								}
									.textInfoService p span{
										font: 21px RobotoMedium;
									}
					.buttonServiceBlock{
						font: 14px RobotoMedium;
					}
				
				.imgServiceBlock{
					display: none;
				}
}
/*Конец Услуги*/	

/*Калькулятор*/
.priceSection{
	width: 100%;
	background: url(../img/css/bg5.jpg) center center;
	background-size: cover;
}
	.priceMainBlock{
		width: 100%;
		max-width: 1100px;
		margin: auto;
		padding: 60px 10px;
	}
		.priceMainBlock h2{
			font: 35px RobotoBold;
			color: #000;
			margin: 0 0 40px 10px;
			background: #fff;
			line-height: 1.5;
			padding: 2px 15px;
			display: inline-block;
		}
		.priceBlock{
			overflow: hidden;
		}	
			.optionPriceMainBlock{
				width: 33.3%;
				float: left;
				padding: 0 8px;
				position: relative;
			}
			.optionPriceMainBlock:after {
			  content: "";
			  background: url(../img/css/icon13.png);
			  position: absolute;
			  top: 14%;
			  right: -16px;
			  width: 32px;
			  height: 32px;
			  z-index: 999;
			}
			.optionPriceMainBlock:last-child:after {
			  content: "";
			  background: none;
			}
				.optionPriceBlock{
					width: 100%;
					background: #fff;
					padding: 25px 20px;
				}
					.headOptionPrice{
						font: 19px RobotoMedium;
						color: #666;
						margin: 0 0 20px 0;
					}
					.textOptionPrice{
						font: 12px RobotoMedium;
						color: #999;
						margin: 0 0 7px 0;
					}
					.selectPrice{
						padding: 6px 30px 6px 8px;
						font: 15px Roboto;
						cursor: pointer;
						outline: none;
						border: 1px solid #aaa;
						background-image: url(../img/css/icon16.png);
						background-repeat: no-repeat;
						background-position: calc(100% - 12px) 50%, 104% 50%;
						-webkit-appearance: none !important;
						-moz-appearance: none !important;
					}
					.inputPrice{
						padding: 6px 8px;
						font: 15px Roboto;
						outline: none;
						border: 1px solid #aaa;
					}
		.resultPriceBlock{
			margin: 37px 0 0 10px;
		}
			.resultPriceBlock p{
				font: 11px RobotoMedium;
				color: #000;
				margin: 0 0 5px 0;
			}
			.resultPrice{
				padding: 15px 20px;
				background: rgba(255,255,255,.7);
				border: 1px solid #0060ae;
				font: 15px Roboto;
				color: #222;
				display: inline-block;
				line-height: 25px;
			}
				.resultPrice span{
					font: 21px RobotoBold;
					color: #222;
				}
			.orderText{
				background: #0060ae;
				padding: 16px 20px;
				font: 16px RobotoMedium;
				line-height: 26px;
				color: #fff;
				display: inline-block;
				text-transform: uppercase;
				margin-left: -5px;
				border-top: 1px solid #0060ae;
			}

@media screen and (min-width: 860px) and (max-width: 960px){
	.priceMainBlock h2{
		font: 33px RobotoBold;
		padding: 5px 15px;
	}
			.optionPriceBlock{
				padding: 25px 13px;
			}
				.headOptionPrice{
					font: 18px RobotoMedium;
				}
				.selectPrice{
					padding: 6px 25px 6px 5px;
					font: 14px Roboto;
					background-position: calc(100% - 5px) 50%, 104% 50%;
				}
				.inputPrice{
					font: 14px Roboto;
				}
}
			
@media screen and (min-width: 768px) and (max-width: 859px){
	.priceMainBlock h2{
		font: 32px RobotoBold;
		padding: 5px 15px;
	}
			.optionPriceBlock{
				padding: 25px 10px;
			}
				.headOptionPrice{
					font: 17px RobotoMedium;
				}
				.selectPrice{
					padding: 6px 25px 6px 5px;
					font: 12px Roboto;
					background-position: calc(100% - 6px) 50%, 104% 50%;
				}
				.inputPrice{
					font: 13px Roboto;
				}
		.resultPrice{
			padding: 12px 20px;
		}
		.orderText{
			padding: 13px 20px;
		}
}

@media screen and (min-width: 400px) and (max-width: 767px){
	.priceMainBlock{
		padding: 50px 10px;
	}
		.priceMainBlock h2{
			font: 30px RobotoBold;
			display: block;
			text-align: center;
			margin: 0 0 30px 0;
			padding: 5px 15px;
		}
			.optionPriceMainBlock{
				width: 100%;
				max-width: 320px;
				margin: 10px auto;
				float: none;
				padding: 0;
			}
			.optionPriceMainBlock:after {
				top: -21px;
				left: 45%;
			}
			.optionPriceMainBlock:first-child:after {
			  content: "";
			  background: none;
			}
			.optionPriceMainBlock:last-child:after {
				content: "";
				background: url(../img/css/icon13.png);
				position: absolute;
				top: -21px;
				left: 45%;
				width: 32px;
				height: 32px;
				z-index: 999;
			}
				.optionPriceBlock{
					padding: 25px 20px;
				}
		.resultPriceBlock{
			margin: 32px auto 0 auto;
			max-width: 320px;
		}
			.resultPrice{
				padding: 15px 10px;
			}
			.orderText{
				padding: 16px 10px;
			}
}

@media screen and (max-width: 399px){
	.priceMainBlock{
		padding: 40px 5px;
	}
		.priceMainBlock h2{
			font: 24px RobotoBold;
			display: block;
			text-align: center;
			margin: 0 0 20px 0;
			padding: 5px 15px;
		}
			.optionPriceMainBlock{
				width: 100%;
				max-width: 230px;
				margin: 10px auto;
				float: none;
				padding: 0;
			}
			.optionPriceMainBlock:after {
				top: -21px;
				left: 43%;
			}
			.optionPriceMainBlock:first-child:after {
			  content: "";
			  background: none;
			}
			.optionPriceMainBlock:last-child:after {
				content: "";
				background: url(../img/css/icon13.png);
				position: absolute;
				top: -21px;
				left: 43%;
				width: 32px;
				height: 32px;
				z-index: 999;
			}
				.optionPriceBlock{
					padding: 20px 10px 22px 10px;
				}
					.headOptionPrice{
						font: 17px RobotoMedium;
						margin: 0 0 17px 0;
					}
					.textOptionPrice{
						font: 12px RobotoMedium;
					}
					.selectPrice{
						padding: 6px 25px 6px 3px;
						font: 12px Roboto;
						background-position: calc(100% - 6px) 50%, 104% 50%;
					}
					.inputPrice{
						padding: 6px 3px;
						font: 13px Roboto;
					}
		.resultPriceBlock{
			margin: 27px auto 0 auto;
			max-width: 230px;
		}
			.resultPriceBlock p{
				font: 11px RobotoMedium;
				color: #000;
				padding: 3px;
				margin: 0 0 8px 0;
				background: #fff;
			}
			.resultPrice{
				padding: 13px 5px;
				font: 11px Roboto;
			}
				.resultPrice span{
					font: 16px RobotoBold;
				}
			.orderText{
				padding: 13px 5px 9px 5px;
				font: 12px RobotoMedium;
				border-top: none;
				line-height: 24px;
			}
}
/*Конец Калькулятор*/



/*Контакты*/
.contactSection{
	width: 100%;
	background: rgba(0, 96, 174, 0.46);
	padding: 37px 15px;
}
	.contactMainBlock{
		width: 100%;
		max-width: 1050px;
		margin: auto;
		overflow: hidden;
	}
		.vkBlock{
			width: 45%;
			float: left;
		}
			.contactTextVK{
				text-align: center;
				padding: 5px;
				font: 16px RobotoMedium;
				color: #fff;
				max-width: 300px;
				width: 70%;
				margin: auto;
				position: relative;
				margin: 0 0 21px 27% !important;
			}
			.contactTextVK:after{
				content:'';
				background: url(../img/css/icon17.png) center center;
				width: 80px;
				height: 43px;
				position: absolute;
				bottom: -10px;
				left: -70px;
			}
		.contactInfoBlock{
			width: 55%;
			float: left;
			padding: 0 0 0 30px;
			position: relative;
			min-height: 250px;
		}
			.contactInfoBlock p{
				margin: 0;
			}
			.contactText{
				background: #fff;
				padding: 15px 25px;
				font: 20px RobotoBold;
				color: #333;
				text-transform: uppercase;
				text-align: center;
				margin: 0 0 10px 0 !important;
			}
			.contactTextBlock{
				background: #fff;
				padding: 35px 15px;
				min-height: 200px;
			}
				.contactText1{
					font: 26px RobotoBold;
					color: #0060ae;
					text-align: center;
					text-transform: uppercase;
				}
				.contactText2{
					text-align: center;
					padding: 18px 5px 25px 5px;
					font: 39px RobotoBold;
					color: #000;
				}
				.contactText3{
					text-align: center;
					font: 14px RobotoMedium;
					color: #777;
					text-transform: uppercase;
				}

@media screen and (min-width: 700px) and (max-width: 790px){
		.contactTextVK{
			font: 15px RobotoMedium;
		}
	.contactInfoBlock{
		padding: 0 0 0 20px;
	}
		.contactText{
			font: 18px RobotoBold;
		}
			.contactText1{
				font: 23px RobotoBold;
			}
			.contactText2{
				font: 34px RobotoBold;
			}
			.contactText3{
				font: 13px RobotoMedium;
			}
}

@media screen and (min-width: 400px) and (max-width: 699px){
	.contactSection{
		padding: 27px 10px 37px 10px;
	}
			.vkBlock{
				width: 100%;
				max-width: 400px;
				margin: 0 auto 20px auto;
				float: none;
			}
			.contactInfoBlock{
				width: 100%;
				max-width: 400px;
				margin: auto;
				float: none;
				padding: 0;
			}
				.contactTextBlock{
					padding: 25px 15px;
					min-height: 150px;
				}
					.contactText1{
						font: 25px RobotoBold;
					}
					.contactText2{
						font: 36px RobotoBold;
					}
					.contactText3{
						font: 13px RobotoMedium;
					}
}

@media screen and (max-width: 399px){
	.contactSection{
		padding: 24px 5px 35px 5px;
	}
			.vkBlock{
				width: 100%;
				margin: 0 auto 20px auto;
				float: none;
			}
				.contactTextVK{
					padding: 0;
					font: 14px RobotoMedium;
					margin: 0 0 21px 25% !important;
				}
				.contactTextVK:after{
					content:'';
					background: url(../img/css/icon17.png) left center;
					width: 50px;
					height: 43px;
					position: absolute;
					bottom: -10px;
					left: -55px;
				}
			.contactInfoBlock{
				width: 100%;
				margin: auto;
				float: none;
				padding: 0;
				min-height: auto;
			}
				.contactText{
					padding: 15px 5px;
					font: 16px RobotoBold;
				}
				.contactTextBlock{
					padding: 25px 5px;
					min-height: 150px;
				}
					.contactText1{
						font: 16px RobotoBold;
					}
					.contactText2{
						padding: 18px 5px 25px 5px;
						font: 24px RobotoBold;
					}
					.contactText3{
						font: 11px RobotoMedium;
					}
}
/*Конец Контакты*/



/*Подвал*/
footer{
	width: 100%;
}	
	.footerMainBlock{
		width: 100%;
		position: relative;
	}	
		#slider_volna_footer {
			height: 16px;
			width: 100%;
			background: url(../img/css/volna-bg.png) repeat-x;
			position: absolute;
			top: -8px;
			left: 0;
			z-index: 10;
		}
		.footerBlock{
			overflow: hidden;
			max-width: 1050px;
			padding: 15px 5px;	
			margin: auto;
		}
			.footerSubBlock1{
				width: 70%;
				float: left;
			}
				.serviceBlockFooter{
					width: 100%;
					overflow: hidden;
				}
				.serviceSubBlockFooter1{
					width: 20%;
					float: left;
					padding: 0 8px;
					font: 20px RobotoBold;
					color: #000;
				}
				.serviceSubBlockFooter2{
					width: 40%;
					float: left;
					padding: 0 8px;
				}
					.serviceSubBlockFooter2 p{
						margin: 0;
					}
					.serviceSubBlockFooter2 p a{
						font: 15px RobotoBold;
						color: #0060ae;
					}
		.footerSubBlock2{
			width: 30%;
			float: left;
			text-align: right;
		}
			.footerSubBlock2 img{
				width: 14px;
				margin-right: 5px;
			}
			.footerSubBlock2 a{
				font: 15px RobotoBold;
				color: #0060ae;
			}

@media screen and (min-width: 400px) and (max-width: 680px){
	.footerBlock{
		padding: 12px 5px;	
	}
		.footerSubBlock1{
			width: 100%;
		}
			.serviceSubBlockFooter1{
				width: 100%;
				font: 17px RobotoBold;
				text-align: center;
			}
			.serviceSubBlockFooter2{
				width: 50%;
			}
				.serviceSubBlockFooter2 p{
					text-align: center;
				}
				.serviceSubBlockFooter2 p a{
					font: 14px RobotoBold;
				}
	.footerSubBlock2{
		width: 100%;
		text-align: center;
		margin: 10px 0 0 0;
	}
		.footerSubBlock2 a{
			font: 15px RobotoBold;
		}
}

@media screen and (max-width: 399px){
		.footerBlock{
			padding: 12px 5px;	
		}
			.footerSubBlock1{
				width: 100%;
			}
				.serviceBlockFooter{
					width: 100%;
				}
				.serviceSubBlockFooter1{
					width: 100%;
					font: 17px RobotoBold;
					text-align: center;
					margin: 0 0 6px 0;
				}
				.serviceSubBlockFooter2{
					width: 100%;
				}
					.serviceSubBlockFooter2 p{
						text-align: center;
					}
					.serviceSubBlockFooter2 p a{
						font: 14px RobotoBold;
					}
		.footerSubBlock2{
			width: 100%;
			text-align: center;
			margin: 10px 0 0 0;
		}
			.footerSubBlock2 a{
				font: 15px RobotoBold;
			}
}
/*Конец Подвал*/




/*Необработанное*/
.sliderSection{
	width: 100%;
	max-width: 1500px;
	position: relative;
	display: none;
}
	.slideBlock{
		position: relative;
	}
		.slideTextBlock{
			position: absolute;
			top: 20%;
			width: 100%;
		}
			.slideText{
				min-width: 500px;
				width: 50%;
				margin: auto;
				background: rgba(255, 255, 255, 0.65);
				padding: 50px 20px;
				text-align: center;
			}
				.slideText h4{
					font: 22px RobotoMedium;
					color: #000;
					margin: 0 0 20px 0;
				}
				.slideText p{
					font: 16px Roboto;
					color: #555;
				}

.item img{
	display: block;
	width: 100%;
	height: auto;
}

.titleH2{
	font: 30px Roboto;
    height: 58px;
    text-align: center;
    margin-bottom: 25px;
    background: url(../img/css/blue-volna.svg) no-repeat 50% 97%;
    background-size: 75px 5px;
}	
				
.floatLeft{
	float: left;
}
.floatRight{
	float: right;
}
.alignLeft{
	text-align: left;
}
.alignRight{
	text-align: right;
}