@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;
	}
}
/*Конец Заголовок*/



/*Таблица цен*/
.tablePriceSection{
	width: 100%;
	background: #f1f1f1;
}
	.tablePriceMainBlock{
		overflow: hidden;
		width: 100%;
		margin: auto;
		max-width: 1050px;
		padding: 30px 10px 30px 10px;
	}
		.tablePriceMainBlock h2{
			font: 33px Roboto;
			margin: 0 0 15px 5px;
		}
		.servicePriceBlock{
			float: left;
			width: 25%;
			padding: 0 5px;
			text-align: center;
		}
			.servicePriceCell{
				padding: 10px 15px;
				border: 1px solid #555;
				font: 15px RobotoMedium;
				margin: 0 0 15px 0;
				cursor: pointer;
				-webkit-transition: all 0.4s ease;
				-moz-transition: all 0.4s ease;
				-o-transition: all 0.4s ease;
				transition: all 0.4s ease;
			}
			.servicePriceCell:hover{
				background: rgb(0, 108, 146);
				color: #fff;
			}
			.activeServicePriceCell{
				background: rgb(0, 108, 146);
				color: #fff;
			}
		.tablePriceBlock{
			float: left;
			width: 75%;
			padding: 0 0 0 40px;
			display: none;
		}
		.activeTablePriceBlock{
			display: block;
		}
			.tablePriceLine1{
				font: 21px RobotoMedium;
				color: #fff;
				padding: 15px 10px;
				overflow: hidden;
				background: rgb(0, 108, 146);
				margin: 0 0 10px 0;
			}
			.tablePriceLine2{
				font: 17px RobotoMedium;
				color: #000;
				padding: 15px 10px;
				overflow: hidden;
			}
			.tablePriceLine3{
				font: 17px RobotoMedium;
				color: #000;
				padding: 15px 10px;
				overflow: hidden;
				background: #fafafa;
			}
				.tablePriceCell1{
					float: left;
					width: 70%;
					text-align: left;
					line-height: 22px;
				}
				.tablePriceCell2{
					float: left;
					width: 30%;
					text-align: right;
				}
					.tablePriceCell2 span{
						font: 21px RobotoBold;
						color: rgb(0, 108, 146);
					}

@media screen and (min-width: 615px) and (max-width: 980px){
	.tablePriceMainBlock{
		padding: 24px 10px;
	}
		.tablePriceMainBlock h2{
			font: 28px Roboto;
		}
		.servicePriceBlock{
			width: 30%;
			padding: 0;
		}
		.tablePriceBlock{
			width: 70%;
			padding: 0 0 0 10px;
		}
			.tablePriceLine1{
				font: 19px RobotoMedium;
			}
			.tablePriceLine2{
				font: 16px RobotoMedium;
			}
			.tablePriceLine3{
				font: 16px RobotoMedium;
			}
					.tablePriceCell2 span{
						font: 19px RobotoBold;
					}
}
@media screen and (max-width: 614px){
	.tablePriceMainBlock{
		padding: 15px 6px;
	}
		.tablePriceMainBlock h2{
			font: 27px Roboto;
			margin: 0 0 15px 5px;
		}
		.servicePriceBlock{
			display: none;
		}
		.tablePriceBlock{
			float: none;
			width: 100%;
			padding: 0;
			display: block;
			margin: 0 0 10px 0;
		}
			.tablePriceLine1{
				font: 18px RobotoMedium;
				padding: 15px 10px;
				margin: 0 0 5px 0;
			}
			.tablePriceLine2{
				font: 15px RobotoMedium;
				padding: 10px 5px;
			}
			.tablePriceLine3{
				font: 15px RobotoMedium;
				padding: 10px 5px;
			}
				.tablePriceCell1{
					width: 65%;
					line-height: 19px;
				}
				.tablePriceCell2{
					width: 35%;
				}
					.tablePriceCell2 span{
						font: 17px RobotoBold;
					}
}
/*Конец Таблица цен*/
					
					
					
/*Калькулятор*/
.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;
			}
}
/*Конец Подвал*/