@charset "utf-8";

html, body{
	margin: 0;
	padding: 0;
	height: 100%;
	background: url(../images/background.jpg) repeat-x top center #81bef8;
	font-family: 'OpenSans-Light';
	font-size: 14px;
	color: #484848;
	line-height: 1.4em;}
.ppz {display:none}
h1{
	font-family: 'OpenSans-Bold';
	font-weight: normal;
	font-size: 30px;
	color: #000;
	text-transform: uppercase;
	margin: 0;
	line-height: 0.8em;}
h2{
	font-family: 'OpenSans-Bold';
	font-weight: normal;
	font-size: 24px;
	color: #000;
	text-transform: uppercase;
	margin: 0;
	line-height: 0.8em;}
h3, h4, h5{
	font-family: 'OpenSans-Bold';
	font-weight: normal;
	font-size: 20px;
	color: #000;
	text-transform: uppercase;
	margin: 0;
	line-height: 0.8em;}

a{
	color: #0266aa;
	text-decoration: underline;}
a:hover{
	text-decoration: none;}

img{
	border:none;}

:focus{
	outline: none;}

.main{
	min-height: 100%;
	width: 100%;
	float: left;
	position: relative;
	z-index: 1;}

.container{
	width: calc(100% - 30px);
	max-width: 1140px;
	padding: 0 15px;
	margin: 0 auto;
	position: relative;}

@font-face {
	font-family: 'OpenSans';
	src: url('../font/OpenSans.eot?') format('eot'),
	     url('../font/OpenSans.woff') format('woff'),
	     url('../font/OpenSans.ttf')  format('truetype'),
	     url('../font/OpenSans.svg#OpenSans') format('svg');}

@font-face {
	font-family: 'OpenSans-Light';
	src: url('../font/OpenSans-Light.eot?') format('eot'),
	     url('../font/OpenSans-Light.woff') format('woff'),
	     url('../font/OpenSans-Light.ttf')  format('truetype'),
	     url('../font/OpenSans-Light.svg#OpenSans-Light') format('svg');}

@font-face {
	font-family: 'OpenSans-Bold';
	src: url('../font/OpenSans-Bold.eot?') format('eot'),
	     url('../font/OpenSans-Bold.woff') format('woff'),
	     url('../font/OpenSans-Bold.ttf')  format('truetype'),
	     url('../font/OpenSans-Bold.svg#OpenSans-Bold') format('svg');}

@font-face {
    font-family: 'RobotoMedium';
    src: url('../font/roboto-medium.eot');
    src: url('../font/roboto-medium.eot') format('embedded-opentype'),
         url('../font/roboto-medium.woff') format('woff'),
         url('../font/roboto-medium.ttf') format('truetype'),
         url('../font/roboto-medium.svg#RobotoMedium') format('svg');}

/*------------------------slider-----------------------*/
#slider{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
	z-index: 0;}
  #slider ul{
	  margin: 0;
	  padding: 0;
	  list-style: none;
	  width: 100%;
	  height: 100%;}
	#slider ul li{
		position: relative;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		background-position: center center;
		background-repeat: no-repeat;
		background-size: cover;}

/*------------------------header-----------------------*/
#header{
	position: relative;
	float: left;
	width: 100%;
	height: 155px;
	font-family: 'OpenSans';
	font-size: 13px;
	color: #FFF;
	line-height: normal;
	z-index: 2;}
#header:before{
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 77px;
	background: #0266aa;}

  .logotip{
	  position: absolute;
	  top: 0;
	  left: 15px;}

  .adress{
	  position: absolute;
	  top: 30px;
	  left: 390px;
	  padding: 0 0 0 20px;
	  background: url(../images/adress.png) left top no-repeat;
	  min-height: 20px;
	  text-shadow: 0 -1px 0 #025e9d;}

  .email{
	  position: absolute;
	  top: 30px;
	  right: 15px;
	  padding: 0 0 0 26px;
	  background: url(../images/email.png) left top no-repeat;
	  min-height: 20px;
	  text-shadow: 0 -1px 0 #025e9d;}
	.email a{
		color: #FFF;
		text-decoration: none;}
	.email a:hover{
		text-decoration: underline;}

  .tel{
	  position: absolute;
	  top: 112px;
	  left: 346px;
	  width: 575px;
	  font-family: 'OpenSans-Bold';
	  font-size: 28px;
	  text-shadow: 0 -1px 0 #4883c4;
	  line-height: 0.9em;}
	.tel_box{
		position: relative;
		float: left;
		width: 50%;
		text-align: right;}
	  .tel_box span{
		  display: block;
		  font-family: 'OpenSans';
		  font-size: 12px;
		  text-shadow: none;}

  a.call_back{
	  position: absolute;
	  top: 115px;
	  right: 15px;
	  display: inline-block;
	  padding: 11px 11px 9px 33px;
	  text-decoration: none;
	  font-family: 'OpenSans-Bold';
	  font-size: 13px;
	  color: #fefefe;
	  text-shadow: 0 -1px 0 #ebb60f;
	  text-transform: uppercase;
	  background: url(../images/call_back.png) 11px 12px no-repeat #ffc610;
	  border-bottom: 2px solid #deac0c;}
  a.call_back:hover{
	  background: url(../images/call_back.png) 11px 12px no-repeat #fac10b;}

/*------------------------navigation-------------------*/
a.menu{
	display: none;
	position: absolute;
	top: 15px;
	left: 15px;
	width: 55px;
	height: 49px;
	background: url(../images/menu.png) no-repeat;
	z-index: 2;}

.navigation{
	position: relative;
	float: left;
	width: 100%;
	margin: 35px 0 0 0;
	line-height: normal;
	z-index: 3;}

  .navigation ul{
	  border-bottom: 3px solid #00b9f2;
	  margin: 0;
	  padding: 0;
	  list-style: none;
	  display: table;
	  width: 100%;
	  background: #0266aa;
	  z-index: 1;}
	.navigation ul li{
		position: relative;
		display: table-cell;
	    font-family: 'OpenSans-Bold';
		color: #FFF;
		text-transform: uppercase;
		text-shadow: 0 -1px 0 #00aadf;
		text-align: center;
		z-index: 1;}
	  .navigation ul li a{
		  position: relative;
		  display: block;
		  color: #FFF;
		  text-decoration: none;
		  padding: 20px 0 17px 0;}

	.navigation ul li a:hover, .navigation ul li.active a{
		background: #00b9f2;}
	  .navigation ul li.active a{
		  cursor: text;}

	.navigation ul li:before{
		content: "";
		position: absolute;
		top: 0;
		left: 0;
		width: 1px;
		height: 100%;
		background: #017ebf;
		z-index: 2;}
	.navigation ul li:first-child:before, .navigation ul li ul li:before{
		background: none;}

	.navigation ul li.full a span{
		position: relative;}
	.navigation ul li.full a span:after{
		content: "";
		position: absolute;
		top: 1px;
		right: -21px;
		width: 15px;
		height: 16px;
		background: url(../images/full_arrow.png) no-repeat;
		z-index: 2;}

	.navigation ul li:last-child ul{
		right: 0;
		left: auto;}


		@media screen and (min-width: 961px) {
		  .navigation ul li:hover ul{
			  display: block;}
			}

	  .navigation ul li ul{
		  display: none;
		  position: absolute;
		  top: 57px;
		  left: 0;
		  padding: 17px 0 0 0;
		  min-width: 274px;
		  background: #00b9f2;
		  border-bottom: none;}
		.navigation ul li ul li{
			display: block;
			text-align: left;
            font-family: 'RobotoMedium';}
		  .navigation ul li ul li a{
			  padding: 9px 0 8px 57px;
			  text-decoration: underline;}
		  .navigation ul li ul li a:hover{
			  text-decoration: none;
			  background: #ffc610;
			  text-shadow: 0 -1px 0 #ebb60f;}
		  .navigation ul li ul li a:before{
			  content: "";
			  position: absolute;
			  top: 17px;
			  left: 28px;
			  width: 6px;
			  height: 5px;
			  background: url(../images/nav_marker.png) no-repeat;
			  z-index: 2;}

/*------------------------wrapper----------------------*/
h1 {
position: relative;
	  float: left;
	  width: 100%;
	  margin: 0 0 11px 0;
	  font-family: 'OpenSans-Bold';
	  font-size: 18px;
	  color: #000;
	  text-transform: uppercase;
}
#wrapper{
	position: relative;
	float: left;
	width: 100%;
	margin: 35px 0 0 0;}

  .cont{
	  position: relative;
	  float: left;
	  width: calc(100% - 46px);
	  padding: 25px 23px 10px 23px;
	  background: #FFF;}

  .title{
	  position: relative;
	  float: left;
	  width: 100%;
	  margin: 0 0 11px 0;
	  font-family: 'OpenSans-Bold';
	  font-size: 18px;
	  color: #000;
	  text-transform: uppercase;}

  .about_block{
	  position: relative;
	  float: left;
	  width: 100%;
	  font-size: 13px;}

  .hr{
	  position: relative;
	  float: left;
	  width: calc(100% + 46px);
	  margin: 8px -23px 19px -23px;
	  height: 1px;
	  background: #edf4f9;}

  .use_block{
	  position: relative;
	  float: left;
	  width: 100%;}
    .use_block .line{
		position: relative;
		float: left;
		width: calc(100% + 24px);
		margin: 8px 0 0 -24px;}
	  .use_box{
		  position: relative;
		  float: left;
		  width: 115px;
		  height: 98px;
		  margin: 0 0 24px 24px;
		  background: #0266aa;}
		.use_box a{
			display: block;
			width: 115px;
			height: 98px;
			color: #FFF;}
		.use_box span.img{
			position: relative;
			width: 115px;
			height: 80px;
			display: table-cell;
			vertical-align: middle;
			text-align: center;
			z-index: 1;}
		.use_box span.text{
			position: absolute;
			left: 0;
			top: 60px;
			width: 100%;
			text-align: center;
			font-size: 13px;
			text-decoration: underline;
			z-index: 2;}
		.use_box a:hover span.text{
			text-decoration: none;}

  .preparations_block{
	  position: relative;
	  float: left;
	  width: 100%;}
	.preparations_block .line{
		position: relative;
		float: left;
		width: calc(100% + 24px);
		margin: 10px 0 0 -24px;}
	  .preparations_box{
		  position: relative;
		  float: left;
		  width: 190px;
		  height: 330px;
		  padding: 0 5px;
		  margin: 0 0 14px 23px;
		  font-size: 13px;
		  color: #FFF;
		  text-align: center;
		  background: url(../images/preparations_box_bg.png) bottom center no-repeat #0266aa;
		  border-bottom: 1px solid #d9d9d9;}
		.preparations_box .name{
			position: relative;
			float: left;
			width: 100%;
			margin: 24px 0 21px 0;
	        font-family: 'OpenSans-Bold';
			font-size: 14px;
			line-height: 1.75em;
			text-transform: uppercase;}
		  .preparations_box .name a{
			  color: #FFF;
			  text-decoration: none;}
			.preparations_box .name a:hover span{
				border-bottom: none;}
			.preparations_box .name span{
				display: inline;
				padding: 0 8px 2px 8px;
				border-bottom: 3px solid #ffc610;}
		.center{
			position: relative;
			float: left;
			width: 100%;
			text-align: center;}
		.preparations_box .center{
			position: absolute;
			left: 0;
			bottom: 34px;}
		  a.more{
			  display: inline-block;
			  padding: 9px 28px 8px 28px;
			  font-family: 'OpenSans-Bold';
			  font-size: 13px;
			  color: #FFF;
			  text-decoration: none;
			  text-transform: uppercase;
			  text-shadow: 0 -1px 0 #ebb60f;
			  background: #ffc610;
			  border-bottom: 2px solid #deac0c;}
     	  a.more:hover{
			  background: #fac10b;}

.content{
	position: relative;
	margin: 0 0 0 281px;
	z-index: 1;}

  .content article{
	  margin: 0 0 37px 0;}
	.content article p{
		line-height: 1.55em;}

/*------------------------column-----------------------*/
.column{
	position: relative;
	float: left;
	width: 253px;
	margin: 0 0 25px 0;
	z-index: 2;}

  .sidebar_preparation{
	  position: relative;
	  float: left;
	  width: 100%;
	  margin: 0 0 8px 0;}
	.col_preparation_box{
		position: relative;
		display: table;
		margin: 0 0 22px 0;
		width: 100%;
		height: 81px;
		font-family: 'OpenSans-Bold';
		font-size: 18px;
		color: #FFF;
		line-height: 1.75em;
		text-transform: uppercase;
		background: url(../images/col_preparation_box_bg.png) bottom center no-repeat #0266aa;}
	 .col_preparation_box a{
		  position: relative;
		  display: table-cell;
		  vertical-align: middle;
		  text-align: center;
		  text-decoration: none;
		  color: #FFF;}
	 .col_preparation_box a:hover span{
		 border-bottom: none;}
	   .col_preparation_box span{
			padding: 0 8px 2px 8px;
			border-bottom: 3px solid #ffc610;}

  .sidebar{
	  position: relative;
	  float: left;
	  width: calc(100% - 33px);
	  padding: 18px 12px 20px 19px;
	  margin: 0 0 27px 0;
	  border: 1px solid #e1e1e1;}
	.sidebar .title{
		margin: 0 0 15px 0;}

	.news_box{
		position: relative;
		float: left;
		width: 100%;
		margin: 0 0 20px 0;
		font-size: 13px;}
	 .news_box span.date{
		 display: block;
		 float: left;
		 width: 100%;
		 margin: 0 0 3px 0;
		 font-family: 'OpenSans-Bold';
		 font-size: 12px;
		 color: #ffc610;}
	  a.more_news{
		  display: inline-block;
		  margin: 4px 0 0 0;
		  padding: 3px 6px;
		  font-family: 'OpenSans-Bold';
		  font-size: 10px;
		  color: #FFF;
		  text-decoration: none;
		  text-transform: uppercase;
		  background: #0266aa;}
	  a.more_news:hover{
		  background: #0260a0;}

/*------------------------footer-----------------------*/
.hfooter{
	width: 100%;
	height: 63px;
	float: left;}

.hfooter.main_hfooter{
	height: 171px;}

#footer{
	position: relative;
	float: left;
	width: 100%;
	height: 63px;
	margin-top: -63px;
	font-size: 13px;
	color: #FFF;
	z-index: 2;}

  #footer a{
	  color: #FFF;}

  .copy{
	  position: absolute;
	  top: 21px;
	  left: 15px;
	  text-transform: uppercase;}

  .footer_tel{
	  position: absolute;
	  top: 21px;
	  left: 390px;
	  padding: 0 0 0 21px;
	  min-height: 15px;
	  background: url(../images/footer_tel.png) left 3px no-repeat;}

  .creator{
	  position: absolute;
	  top: 21px;
	  right:15px;}

/*------------------------mob--------------------------*/
@media screen and (max-width: 1200px) {

.adress{
	top: 15px;
	padding: 2px 0 0 26px;
	line-height: 1em;}

.email{
	top: 45px;
	left: 390px;
	right: auto;}

.tel{
	top: 86px;
	font-size: 24px;
	left: 390px;
	width: 250px;}

.tel_box{
	width: 100%;
	text-align: left;
	margin: 0 0 10px 0;}

}

@media screen and (max-width: 1181px){


.use_block .line{
	width: 100%;
	margin: 10px 0 0 0;
	text-align: center;}

.use_box{
	display: inline-block;
	float: none;
	margin: 0 33px 12px 33px;}

.preparations_block .line{
	width: 100%;
	margin: 10px 0 0 0;
	text-align: center;}

.preparations_box{
	display: inline-block;
	float: none;
	margin: 0 53px 14px 53px;
	vertical-align: top;
	}

.title{
	text-align: center;}

h1, h2, h3, h4, h5{
	text-align: center;}

	}
h4 {
font-size: 12px;
}
@media screen and (max-width: 1024px) {

.logotip img{
	width: 85%;
	height: auto;}

.adress{
	top: 10px;
	left: 333px;
	font-size: 12px;}

.email{
	top: 40px;
	left: 333px;
	font-size: 12px;}

.tel{
	top: 77px;
	left: 333px;
	font-size: 18px;}

.tel_box span{
	font-size: 11px;}

#header::before{
	height: 65px;}

a.call_back{
	top: 92px;}

.preparations_box{
	margin: 0 30px 14px 30px;}

}

@media screen and (max-width: 960px) {

.navigation{
	margin: 20px 0 10px 0;
	min-height: 49px;}

a.menu{
	display: block;}

.navigation ul{
	display: none;
	margin: 0;
	padding: 70px 0 15px 0;}

.navigation ul li{
	display: block;
	text-align: left;}

.navigation ul li:before{
	background: none;}

.navigation ul li a{
	padding: 8px 0 8px 15px;}

.navigation ul li:hover a, .navigation ul li.active a{
	background: none;
	text-decoration: underline;}

.navigation ul li ul{
	position: relative;
	padding: 0;
	top: auto;
	left: auto;
	background: none;}

.navigation ul li ul li a{
	padding: 4px 0 4px 50px;}

.navigation ul li ul li a::before{
	top: 11px;}

.navigation ul li ul li a:hover{
	background: none;
	text-shadow: 0 -1px 0 #00aadf;}

.column{
	width: 100%;}

.sidebar_preparation .line{
	width: 100%;
	margin: 0;
	text-align: center;}

.col_preparation_box{
	display: inline-block;
	float: none;
	margin: 0 17px 22px 17px;
	width: 253px;}

.col_preparation_box a{
	display: table-cell;
	width: 253px;
	height: 81px;}

.preparations_box{
	margin: 0 16px 14px 16px;}

.use_box{
	margin: 0 20px 12px 20px;}

.content{
	float: left;
	width: 100%;
	margin: 0;}

}

@media screen and (max-width: 800px) {

#header{
	height: 300px;}

.adress{
	left: 15px;
	top: 145px;
	padding: 3px 0 0 26px;}

.email{
	left: 15px;
	top: 175px;}

.tel{
	left: 15px;
	top: 216px;}

a.call_back{
	top: 231px;}

.logotip img{
	width: 75%;}

.hfooter{
	height: 171px;}

#footer{
	height: 171px;
	margin-top: -171px;}

.footer_tel{
	top: 21px;
	left: 15px;}

.copy{
	top: 110px;}

.creator{
	left: 15px;
	right: auto;
	top: 135px;}

}

@media screen and (max-width: 626px){

.col_preparation_box{
	width: 210px;
	margin: 0 5px 22px;
	font-size: 14px;}
.col_preparation_box a{
	width: 210px;}

}

@media screen and (max-width: 480px){

#header{
	height: 350px;}

a.call_back{
	top: 290px;
	left: 15px;
	right: auto;}

}

@media screen and (max-width: 349px){

.preparations_box{
	width: 210px;
	font-size: 11px;
	margin: 0 0 14px 0;}

}
/* news */

.news_block .block-row img {
    max-width: 61px;
    height: auto;
}

.news_id .site_dynamic h1, .news_id .site_dynamic h2, .news_id .site_dynamic h3 {
    margin: 20px 0px 0px 0px;
}

.news_id .site_dynamic {
    float: right;
    width: 400px;
    background-color: #fff;
    padding: 20px;
    margin: 20px;
}
/*------------------------END--------------------------*/