@import url(http://fonts.googleapis.com/css?family=PT+Sans&subset=latin,cyrillic);
.price-rouble {
font-family: rub;
}
  
  
	/*==== основа (начало) ===*/
@font-face {
    font-family: "PFA";
    src: url('/templates/fonts/pfsquaresanspro-regular-webfont.eot');
    src: url('/templates/fonts/pfsquaresanspro-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('/templates/fonts/pfsquaresanspro-regular-webfont.woff') format('woff'),
         url('/templates/fonts/pfsquaresanspro-regular-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: "PFAi";
    src: url("/templates/fonts/PFSquareSansPro-Italic.eot");
    src: local('PFA'), url("/templates/fonts/PFSquareSansPro-Italic.eot?#iefix") format("embedded-opentype"),url("/templates/fonts/PFSquareSansPro-Italic.ttf") format("truetype"),url("/templates/fonts/PFSquareSansPro-Italic.svg#PFSquareSansPro-Italic") format("svg");
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: "PFAb";
    src: url('/templates/fonts/pfsquaresanspro-medium-webfont.eot');
    src: url('/templates/fonts/pfsquaresanspro-medium-webfont.eot?#iefix') format('embedded-opentype'),
         url('/templates/fonts/pfsquaresanspro-medium-webfont.woff') format('woff'),
         url('/templates/fonts/pfsquaresanspro-medium-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: "PFAbi";
    src: url('/templates/fonts/pfsquaresanspro-meditalic-webfont.eot');
    src: url('/templates/fonts/pfsquaresanspro-meditalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('/templates/fonts/pfsquaresanspro-meditalic-webfont.woff') format('woff'),
         url('/templates/fonts/pfsquaresanspro-meditalic-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
  font-family: 'rub';
  src: url('/templates/fonts/alsrubl-tahoma-regular.eot');
  src: url('/templates/fonts/alsrubl-tahoma-regular.eot?#iefix') format('embedded-opentype'),url('/templates/fonts/alsrubl-tahoma-regular.woff') format('woff'), url('/templates/fonts/alsrubl-tahoma-regular.ttf') format('truetype'), url('/templates/fonts/alsrubl-tahoma-regular.svg#ALSRublTahomaItalic') format('svg');
  font-weight: normal;
  font-style: normal;
}
*{
font-family: PFA;
margin:0;
padding:0;
}
	body{
	background-color: #0f7cb0;
	background:-moz-linear-gradient(top, rgba(32,187,234,0.15) 0%, rgba(32,187,234,0.3) 25%, rgba(32,187,234,0.5) 100%), -moz-linear-gradient(left, #00306b 0%, #055289 100%);
	background:-webkit-gradient(linear,left top, left bottom, color-stop(0%, rgba(32,187,234,0.15)), color-stop(25%, rgba(32,187,234,0.3)), color-stop(100%, rgba(32,187,234,0.5))), -webkit-gradient(linear,left top, right top, color-stop(0%, #00306b), color-stop(100%, #055289));
	background:-webkit-linear-gradient(top, rgba(32,187,234,0.15) 0%, rgba(32,187,234,0.3) 25%, rgba(32,187,234,0.5) 100%), -webkit-linear-gradient(left, #00306b 0%, #055289 100%);
	background:-o-linear-gradient(top, rgba(32,187,234,0.15) 0%, rgba(32,187,234,0.3) 25%, rgba(32,187,234,0.5) 100%), -o-linear-gradient(left, #00306b 0%, #055289 100%);
	background:-ms-linear-gradient(top, rgba(32,187,234,0.15) 0%, rgba(32,187,234,0.3) 25%, rgba(32,187,234,0.5) 100%), -ms-linear-gradient(left, #00306b 0%, #055289 100%);
	background:linear-gradient(to bottom, rgba(32,187,234,0.15) 0%, rgba(32,187,234,0.3) 25%,rgba(32,187,234,0.5) 100%), linear-gradient(to right, #00306b 0%, #055289 100%);
	padding-top:385px;
	}
		.kubs {
		text-align:center;
		display:table;
		max-width: 1350px;
		z-index:1000;
		position:relative;
		margin:0 auto;
		padding: 0;
		font-size:0;
		}
        .kubs li {
            width: 188px;
            height: 188px;
			border-left: solid 1px rgba(50,165,192,1);
			border-top: solid 1px rgba(50,165,192,1);				
			color: #000000;
            cursor:pointer;
			font-size:14px;
			vertical-align:top;
			margin: 0;
			padding: 0;
			list-style: none;
			display: inline-block;
			*display:inline; /* ie7 */
			position:relative;
        }
        .kubs li div {
		margin: 0;
		padding: 0;
		font-size:18px;
		}
	

	
		.ramka {
		width: 980px;
		position: relative;
		margin: 2% auto;
		padding:20px;
		background: rgba(175, 233, 224, 0.3);  
		    z-index: 1001;
		}
		.ramka > div {
		width: 980px;
		position: relative;
		background: rgba(255, 255, 255, 1);
		    z-index: 1002;
		}
		.ramka > div img{
			max-width:100%;
		}

		.close {

		background: url("/templates/close.png");
		position: absolute;
		right: 20px;
		text-align: center;
		top: 20px;
		width: 21px;
		height:21px;

		}

.close:hover { 	background: url("/templates/close_hover.png"); }

#leftside,#rightside{
	display:inline-block;
	vertical-align:top;
}

	
	#k9{
		width:941px;
		height:auto;
		border:none;
	}
	#maincenter{
		color:#fff;
		padding:0px;
		font-size:0;
		border-left: solid 1px rgba(50,165,192,1);
			border-top: solid 1px rgba(50,165,192,1);
	}
	#maincenter>*{
		color:#fff;
		font-size:14px;
	}
	#maincenter h1{
			font-size:25px;
	}
		
		@media screen and (max-width: 800px) 
and (min-device-width : 768px) 
and (orientation : portrait) {
			#k1,#k7,#k33,#k39,#k40,#k38,#k45,#k46,#k5,#k36,#k41,#leftside,#rightside{display:none;}
			.kubs{max-width:800px;}
			
				.ramka,.ramka > div  {
					width: 500px ;
					z-index:1999;
				}
			#k9{
				width:576px ; 
				
			}
			#maincenter{
				padding:20px;
			}
		}
		
		 @media screen and (max-width: 1000px) {
			#k1,#k7,#k33,#k39,#k40,#k46,#k5,#k36,#k41,#leftside,#rightside{display:none;}
			.kubs{max-width:1000px;}
			
				.ramka,.ramka > div  {
					width: 600px ;
				}
				
			#k9{
				width:752px ; 
				
			}
			#maincenter{
				padding:50px;
			}
				.razdelp {
		width:auto !important;
	}
		}
		
		
        @media screen and (max-width: 1380px) {
			#k1,#k7,#k33,#k39,#k40,#k46,#leftside,#rightside{display:none;}
			.kubs{max-width:1000px;}
			#k9{
				border: solid 1px rgba(50,165,192,1);
			}
		}
		
       
		#k1 div,#k5 div,#k7 div,#k8 div,#k10 div,#k11 div,#k12 div,#k14 div,#k15 div,#k16 div,#k17 div,#k18 div, #k19 div, #k20 div,#k21 div,#k22 div,#k23 div,#k24 div,#k25 div,#k26 div, #k27 div, #k28 div,#k29 div,#k30 div,#k31 div,#k32 div,#k33 div,#k39 div,#k40 div,#k41 div,#k42 div,#k44 div,#k45 div,#k46 div{
			opacity: 0.1; /* Полупрозрачный фон */
			filter: alpha(Opacity=10); /* Прозрачность в IE */
			width:100%;
			height:100%;
		}
		
	 a{
		color:#cefbff;
		text-decoration:none;
		}
		
	 a:hover{
		color:#ffffff;
		text-decoration:none;
		}
		
		.coverlay{
    background: rgba(0, 0, 0, 0.5);
    display: none;
	position: fixed;
    bottom: 0; left: 0; top: 0; right: 0;
   
    text-align: center;
    z-index: 1000;
		}
		
		h2{font-size:18px;}

	.website{
		background:url("/templates/website.jpg") no-repeat;
		padding:0 0 0 24px;
		height: 19px;
		width: 19px;
		margin: 20px 0 20px 0;
		
	}
	.website a{
		color:#0cbda1;
		font-weight:bold;
	}

	.website a:hover{
		color:#90d9ca;
		font-weight:bold;
	}
	
	.todo{
		margin:0 0 0 20px;
		padding:5px 10px 5px 10px;
		border-left:1px solid black;
		line-height: 1.5;
	}
	
	.price{
		font-size:25px; 
		margin-top:50px;
		float:left;
		width:150px;
	}
	
	.zayavka{
	margin-top:50px;
	float:right;
		font-size:25px; 
	
	}
	
	.zayavka a{
		border-bottom:1px dotted #0cbda1;
		color:#0cbda1;
	}
	.zayavka a:hover{
		border-bottom:1px dotted #90d9ca;
		color:#90d9ca;
	}
	
	
/*----------блок контактов --------------*/
	#k6 {cursor:default;}
	#k6 div{
		font-size:18px;
		font-weight:bold;
	}
	#gray{
		color:#cecece;
		font-weight:normal;
	}
	#leftline {
		border-left:1px solid #bababa;
		margin:10px 0 10px 40px;
		padding:0px 0 0px 10px;	
	}
	#leftline span{
		font-size:16px;
	}
	#skype{
		font-weight:normal;
			font-size:18px;
			background:url("/templates/images/skype.png") no-repeat; 
			padding:0px 5px 2px 18px;
			margin:0 0 0 35px;
	}
/*---------- //блок контактов --------------*/

/*---------- блок контактов --------------*/
.map{
	width:100%;
	height:563px;
	background:url("/templates/images/map.jpg") no-repeat;
	background-size:100%;	
	
}

.contacts{
	width:295px; 
	border:1px; 
	padding:0; 
	float:left;
	padding:20px 0 0 20px !important;
	cursor:default;
	
}

.office{
	width:188px;
	height:188px;
	background:url("/templates/images/office.jpg");
	float:left;
}


.razr{
	width:188px;
	height:188px;
	background:url("/templates/images/razr.jpg");
	float:left;
}

.mcocos{
	width:188px;
	height:188px;
	background:url("/templates/images/mcocos.jpg");
	float:left;
}
/*---------- //блок контактов --------------*/


.work_portf{
width:188px;
height:188px;
display:inline-block;
vertical-align:top;
 border-left: solid 1px rgba(50,165,192,1);
border-top: solid 1px rgba(50,165,192,1);	
cursor:pointer;
position:relative;
}
.work_portf div{
	position:absolute;
	bottom:0;
	display:table;
	width:100%;
	background: rgba(14, 149, 181, 0.77);  
	font-size:14px !important;
	text-align:center;
	color:#ffffff;
	height: 50px;
	padding:10px 0 !important;
}
.work_portf div a{
	display:table-cell;
	vertical-align:middle;
    line-height: 1.1;	
}
.razdelp{
	width:751px;
	margin:0 !important;
	padding:28px 10px 10px 42px !important;
	display:inline-block;
	vertical-align:top;
}
.razdelp h3{
	padding: 0 0 10px;
}
.zakaz_block{
	background:#21b8ea;
	width:188px;
	height:187px;
	display:inline-block;
	vertical-align:top;
	padding: 15px 0 0 10px !important;
}
.zakaz_block2{
	background:#21b8ea;
	width:188px;
	height:188px;
	display:inline-block;
	vertical-align:top;
	text-align:center;
	font-size:30px !important;
	padding: 60px 0 0 0px !important;
	line-height:80%;
}
.zakaz_block2 span{
	font-size:20px !important;
	color:#afe9e0;
}
	#leftlinewhite {
		border-left:1px solid #ffffff;
		margin: 10px 0 10px 15px;
		padding: 0px 0 0px 15px;
		text-align: left;
	}
	
	#leftlinewhite a{
		font-size:14px;
	}
	#skype a{
	color:#000000;
	}
	#skype a:hover{
	color:#21b8ea;
	}
	
	.workramka{
	width:226px;
	display:none;
	height:225px;
	position:absolute;
	top:0;
	left:0;
	background:url("/templates/images/ramawork.png");
	cursor:pointer;
	}
	
	
#k34{
	background-image:url('/templates/images/part1.png');
}
#k34:hover{
	background-image:url('/templates/images/part1on.png');
}
#k35{
	background-image:url('/templates/images/part2.png');
}
#k35:hover{
	background-image:url('/templates/images/part2on.png');
}
#k36{
	background-image:url('/templates/images/part3.png');
}
#k36:hover{
	background-image:url('/templates/images/part3on.png');
}
#k37{
	background-image:url('/templates/images/part4.png');
}
#k37:hover{
	background-image:url('/templates/images/part4on.png');
}
#k38{
	background-image:url('/templates/images/part5.png');
}
#k38:hover{
	background-image:url('/templates/images/part5on.png');
}
#k4 div{
margin-top:15px !important;
line-height:25px !important;
}
header{
	overflow: hidden;
	position:absolute;
	width:100%;
	height:452px;
	top:0;
	z-index:100;
	left:0;
}
header,header *,.fix,.fix * {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
	font-family: "Open Sans", sans-serif;
}
header .bg{
	padding-top:71px;
	height:386px;
}
header .bg:before{
	content: " ";
	display:block;
	margin:0 auto;
	margin-top:-512px;
	height:500px;
	width:500px;
	background-color: #00437b;
	background: -moz-linear-gradient(-45deg, rgba(32,187,234,0) 0%, rgba(32,187,234,0.25) 75%, rgba(32,187,234,0.48) 100%), #00437b;
	background: -webkit-gradient(linear,left top, right bottom, color-stop(0%, rgba(32,187,234,0)), color-stop(75%, rgba(32,187,234,0.25)), color-stop(100%, rgba(32,187,234,0.48))), #00437b;
	background: -webkit-linear-gradient(-45deg, rgba(32,187,234,0) 0%, rgba(32,187,234,0.25) 75%, rgba(32,187,234,0.48) 100%), #00437b;
	background: -o-linear-gradient(-45deg, rgba(32,187,234,0) 0%, rgba(32,187,234,0.25) 75%, rgba(32,187,234,0.48) 100%), #00437b;
	background: -ms-linear-gradient(-45deg, rgba(32,187,234,0) 0%, rgba(32,187,234,0.25) 75%, rgba(32,187,234,0.48) 100%), #00437b;
	background: linear-gradient(135deg, rgba(32,187,234,0) 0%, rgba(32,187,234,0.25) 75%, rgba(32,187,234,0.48) 100%), #00437b;
	-moz-transform: matrix(1.15,1.0,-1.5,1.3,112,104);
	-webkit-transform: matrix(1.15,1.0,-1.5,1.3,112,104);
	-o-transform: matrix(1.15,1.0,-1.5,1.3,112,104);
	-ms-transform: matrix(1.15,1.0,-1.5,1.3,112,104);
	transform: matrix(1.15,0.9,-1.6,1.255,112,104);
}
.fix .logo{
	display:block;
	font-size:0px;
	color:transparent;
	width:46px;
	height:51px;
	background:url(../images/logo_main.png);
	margin:10px auto;
}
.fix{
	top:0;
	position: fixed;
	width: 100%;
	z-index: 1000000;
	border-bottom:1px solid rgba(32,186,234,0.16);
}
.fix .contacts{
	width:auto !important;
	float:none !important;
	padding:0 !important;
	border:none !important;
}
.fix .top_menu,.fix .contacts{
	list-style-type: none;
	padding:0;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-box-pack:justify;
    -webkit-justify-content:space-around;
    -ms-justify-content:space-around;
    justify-content:space-around;
	height:51px;
	align-items:center;
	-moz-align-items:center;
	-webkit-align-items:center;
	-webkit-box-align:center;
	-ms-flex-align:center;
    -ms-align-items:center;
	margin:10px auto;
}
.fix .top_menu li{
	position:relative;
}
.fix .top_menu li a{
	color:#fff;
	font-size:18px;
	font-weight:300;
	border-bottom:2px dotted #21b8ea;
	padding-bottom:1px;

}
.fix .top_menu li a:hover{
	color:#75e6f0;
	border-color:transparent;
}
.fix .top_menu ul{
	list-style-type: none;
	padding:0;
	margin:0;
	background: rgb(6, 88, 143);
	position:absolute;
	left:-5px;
	padding:5px 10px;
	-webkit-border-radius:4px;
	-moz-border-radius:4px;
	border-radius:4px;
	top:100%;
    -ms-transform-origin: top center;
    -webkit-transform-origin: top center;
    -o-transform-origin: top center;
    -moz-transform-origin: top center;
    transform-origin: top center;
    -webkit-transform: scaleY(0);
    -moz-transform: scaleY(0);
    -o-transform: scaleY(0);
    transform: scaleY(0);
    -webkit-transition: all .2s ease-out;
    -moz-transition: all .2s ease-out;
    -o-transition: all .2s ease-out;
    transition: all .2s ease-out;
}
.fix .top_menu li:hover ul{
    -webkit-transform: scaleY(1);
    -moz-transform: scaleY(1);
    -o-transform: scaleY(1);
    transform: scaleY(1);	
}
.fix .top_menu ul a{
	white-space:nowrap;
}
.fix .top_menu ul li{
	padding:2px 0;
}
.fix .icon-email:hover,.fix .icon-vk:hover,.fix .icon-skype:hover:before{
	opacity: 1;
}
.fix .icon-email,.fix .icon-vk,.fix .icon-skype{
	opacity: 0.7;
	font-size:0px;
	color:transparent;
	position:relative;
	width:34px;
	height:34px;
	display:block;
}	
.fix .icon-email,.fix .icon-vk{
	-webkit-border-radius:50%;
	-moz-border-radius:50%;
	border-radius:50%;
	background:#29caef;
	display:table;
}
.fix .icon-email:before{
	display: table;
	font-size:20px;
	color:#06588f;
	margin:8px auto 0;
}
.fix .icon-skype:before{
	opacity: 0.7;
	display: table;
	font-size:32px;
	color:#80fbff;
	margin:0 auto -22px;
}
.fix .icon-vk{
	background:#00b0e7;
}
.fix .icon-vk:before{
	display: table;
	font-size:20px;
	color:#06588f;
	margin:8px auto 0;
}
.fix .tel{
	font-size:18px;
	font-weight:300;
	color:#75e6f0;
	margin-top: 24px;
}
.fix .tel b{
	color:#fff;
}
header h1{
	font-size:42px !important;
	color:#fff;
	text-transform: uppercase;
	text-align: center;
	padding:0 75px;
	margin:30px 0 10px;
}
header p{
	font-size:24px;
	color:#75e6f0;
	text-align: center;
	font-weight:300;
	padding:0 125px 20px;
}
header .next1{
	position:relative;
	display:table;
	margin:0 auto -10px;
	font-size:18px;
	font-weight:700;
	color:#fff;
}
header .next1 span{
	border-bottom:2px dotted #21b8ea;
	padding-bottom:1px;
}
header .next1:after {
    content: " ";
    position: absolute;
    width: 31px;
    height: 50px;
    background: url(../images/str.png) bottom no-repeat;
    top: 20px;
    left: 31px;
}

@media only screen and (max-width: 1199px) {
	body {
		padding-top: 338px;
	}
	header{
		height: 378px;
	}
	.fix .top_menu li a,.fix .tel {
		font-size:16px;
	}
	header .bg {
		padding-top: 57px;
	}
	header h1 {
		font-size:36px !important;
	}
	header p {
		font-size:20px;
		padding-bottom:0;
	}
	header .bg:before {
		-moz-transform: matrix(1.15,0.9,-1.6,1.255,112,45);
		-webkit-transform: matrix(1.15,0.9,-1.6,1.255,112,45);
		-o-transform: matrix(1.15,0.9,-1.6,1.255,112,45);
		-ms-transform: matrix(1.15,0.9,-1.6,1.255,112,45);
		transform: matrix(1.15,0.9,-1.6,1.255,112,45);
	}
}

@media only screen and (max-width: 991px) {
	.fix{
	  position:absolute;
	}
	.fix .contacts{
		height:34px;
		margin: 10px 0 0 0;
	}
	.fix .tel{
	  margin-top: 5px;
	  text-align:center;
	}
	header h1{
		padding:0;
		margin-bottom:10px;
	}
	header p {
		padding:0 50px;
		margin-bottom:10px;
	}
	header .bg:before {
		-moz-transform: matrix(1.15,0.9,-1.6,1.255,114,17);
		-webkit-transform: matrix(1.15,0.9,-1.6,1.255,114,17);
		-o-transform: matrix(1.15,0.9,-1.6,1.255,114,17);
		-ms-transform: matrix(1.15,0.9,-1.6,1.255,114,17);
		transform: matrix(1.15,0.9,-1.6,1.255,114,17);
	}
	header{
		height: 351px;
	}
	.fix .top_menu ul{
		display:none;
	}
}

@media only screen and (max-width: 767px) {
	.fix{
	  background: rgb(6, 88, 143);
	  position:relative;
	}
	.fa-bars{
		position:absolute;
		top:14px;
		right:16px;
		font-size:0px;
		color:transparent;
		cursor:pointer;
	}
	.fa-bars:before{
		font-size:35px;
		color:#fff;
		font-family: FontAwesome;
	}
	.fix .top_menu{
		display:none;
		height:auto;
		margin:0;
		width: 80%;
	}
	.fix .top_menu li{
		margin:12px 0;
	}
	.fix .top_menu li a{
		font-size:20px;
	}
	header h1{
		font-size:20px !important;
	}
	header p {
		font-size:14px;
		padding: 0;
	}
	header .bg{
		height:auto;
		background: #0f7cb0;
		padding-top:0;
	}
	header .bg:before {
		display:none;
	}
	header {
		position:relative;
		height:auto;
	}
	header .next1{
		display:none;
	}
	body {
		padding-top:0;
	}
	#k9{
		width:564px;
	}
	#k6,#k1,#k7,#k33,#k39,#k40,#k38,#k45,#k46,#k5,#k36,#k41,#leftside,#rightside{display:none;}	.kubs{max-width:600px;}
		
				.ramka,.ramka > div  {
					width: 400px !important;
				}
				
			#maincenter{
				padding:10px !important;
			}
}
@media screen and (max-width: 580px) {
	#k9{
		width:376px;
	}
	#k4,#k42,#k44{
		display:none;
	}
}
@media screen and (max-width: 392px) {
	#k9,#k43{
		width:300px;
	}
	.kubs li {
		width: 99px;
		height: 99px;
		-webkit-background-size:cover;
		-moz-background-size:cover;
		-o-background-size:cover;
		background-size:cover;
	}
	#k4{
		display:inline-block;
	}
	#k43>div{
		padding-top:15px !important;
	}
}

@media (min-width: 768px){
	.fix .fa-bars {
		display: none;
	}
	.fix .top_menu{
		display: -webkit-box !important;
		display: -moz-box !important;
		display: -ms-flexbox !important;
		display: -webkit-flex !important;
		display: flex !important;
	}
}