@charset "utf-8";
/**
 * © °dewpoint
 * @date 02.2014
 */

body, html {
	margin: 0;
	padding: 0;
	width: 100%;
	height: 100%;
	background-color: #fff;
	font-family: Georgia;
	font-weight: normal;
	font-size: 12px;
	color: #3b3838;
}

 * html #contain {height: expression(document.body.clientHeight > 50 ? "100%" :"50px");}

a {color: #105f8e; outline: none; -moz-appearance: none;}
a:hover {color: #1c83b9;}

h1, h2, h3, h4, h5, h6 {color: #000000;}
h1, h2, h3 {font-family: 'intro_regular',sans-serif;}

input, textarea {outline: none; -moz-appearance: none;}
input:focus, textarea:focus {border: medium none; background: none repeat scroll 0 0 #fff;}

@font-face {
    font-family: 'intro_regular';
    src: url('../fonts/intro-webfont.eot');
    src: url('../fonts/intro-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/intro-webfont.woff') format('woff'),
         url('../fonts/intro-webfont.ttf') format('truetype'),
         url('../fonts/intro-webfont.svg#intro_regular') format('svg');
    font-weight: normal;
    font-style: normal;
}

.wrapper {
	width: 980px;
    margin: 0 auto;
	padding: 0 10px;
	position: relative;
}

#contain {
	overflow: hidden;
    position: relative;
	min-height: 100%;
	min-width: 1000px;
	margin: 0 auto;
	z-index: 5;
}

/*---------------------------------- header -----------------------------------*/
header {
	height: 104px;
    position: relative;
    z-index: 10;
}

.nav-container {
	background-color: #FFFFFF;
    height: 104px;
    position: fixed;
    width: 100%;
	z-index: 100;
}

	#logo {
		float: left;
    	padding: 46px 0 20px;
	}

	nav {
		float: right;
		padding: 20px 0 0;
	}
	
			nav ul li {				
				float: left;
    			margin: 0 0 0 40px;				
			}
			
				nav ul li a {
					font-size: 16px;
				    text-transform: uppercase;
					color: #000000;
					font-family: 'intro_regular';
					text-decoration: none;
					padding: 36px 0 0;
					display: block;
				}
				
				nav ul li a.turquoise.selected, nav ul li.hover a.turquoise {background: url("../images/nav.png") no-repeat scroll center -1px transparent;}
				nav ul li a.grey.selected, nav ul li.hover a.grey {background: url("../images/nav.png") no-repeat scroll center -99px transparent;}
				nav ul li a.green.selected, nav ul li.hover a.green {background: url("../images/nav.png") no-repeat scroll center -199px transparent;}
				nav ul li a.violet.selected, nav ul li.hover a.violet {background: url("../images/nav.png") no-repeat scroll center -299px transparent;}
				nav ul li a.orange.selected, nav ul li.hover a.orange {background: url("../images/nav.png") no-repeat scroll center -399px transparent;}
				nav ul li a.black.selected, nav ul li.hover a.black {background: url("../images/nav.png") no-repeat scroll center -499px transparent;}
				
				.hover .turquoise, span.turquoise, .turquoise.selected {color:#00aa9f}
				.hover .grey, span.grey, .grey.selected {color:#454545}
				.hover .green, span.green, .green.selected {color:#6dc112}
				.hover .violet, span.violet, .violet.selected {color:#5f24a2}
				.hover .orange, span.orange, .orange.selected {color:#f8823c}
				.hover .black, span.black, .black.selected {color:#242121}

/*------------------------------------------------ main ----------------------------------------------*/
.first_screen,
#chapter-2, 
#chapter-4 {
	min-height: 530px;
}

.first_screen {
	position: relative;
	z-index: 1;
}
				
.section_nav {
	position: fixed;
    top: 104px;
    width: 100%;
	height: 100%;
}

	.nav_center {
		float: left;
	    height: 50%;
	    margin-bottom: -265px;
    	width: 100%;
	}

		.floatFiller {
			height: 100%;
		    width: 100%;
		}
		
	.nav_box {
		clear: both;
    	height: 530px;
	    position: relative;
		margin: 0 auto;
    	width: 980px;
	}
		
		.nav_box .nav_item {
			float: left;
		    height: 240px;
		    margin: 0 28px 50px;
		    position: relative;
		    width: 270px;
		}
	
			.nav_box .nav_item a {
				height: 100%;
			    overflow: hidden;
			    width: 100%;
				display: block;
			}
		
				.nav_box .nav_item a img {
					display: block;
				    position: relative;
				}
	
				.nav_box .nav_item.nav1 img {left: 0; top: 0;}
				.nav_box .nav_item.nav2 img {left: -270px; top: 0;}
				.nav_box .nav_item.nav3 img {left: -540px; top: 0;}
				.nav_box .nav_item.nav4 img {left: 0; top: -240px;}
				.nav_box .nav_item.nav5 img {left: -270px; top: -240px;}
				.nav_box .nav_item.nav6 img {left: -540px; top: -240px;}
				
				.nav_box .nav_item.nav1:hover img {left: 0; top: -480px;}
				.nav_box .nav_item.nav2:hover img {left: -270px; top: -480px;}
				.nav_box .nav_item.nav3:hover img {left: -540px; top: -480px;}
				.nav_box .nav_item.nav4:hover img {left: 0; top: -720px;}
				.nav_box .nav_item.nav5:hover img {left: -270px; top: -720px;}
				.nav_box .nav_item.nav6:hover img {left: -540px; top: -720px;}
		
			.nav_box .nav_item span {
				display: none;
			    font-family: 'intro_regular';
			    font-size: 20px;
			    margin: 15px 0 0;
			    position: absolute;
				top: 240px;
				left: 0;
			    text-align: center;
			    width: 100%;
				z-index: 10;
			}
			
			.nav_box .nav_item:hover span {
			    display: block;
			}
			
/*------------------ page -------------------*/								
.page {
	position: relative;
	z-index: 5;
}				
				
.main {	
	padding: 15px 0 30px;
	position: relative;
    z-index: 2;
}

#chapter-1 {z-index: 5;}
#chapter-2 {z-index: 6;}
#chapter-3 {z-index: 7;}
#chapter-4 {z-index: 8;}
#chapter-5 {z-index: 9;}
#chapter-6 {z-index: 10;}

#chapter-1 .middle {background-color: #00aa9f;}
#chapter-2 .middle {background: url("../images/bg2.jpg") no-repeat fixed center 0 #2f2f2f;}
#chapter-3 .middle {background: url("../images/bg3.jpg") repeat scroll 0 0 #f0f0f0;}
#chapter-4 .middle {background-color: #5f24a2;}
#chapter-5 .middle {background-color: #f8823c;}
#chapter-6 .middle {background-color: #ffffff;}
		
section {
	width: 100%;
	position: relative;
}

section.moving {
	padding-bottom: 120px;
}
	section .middle {
		height: 100%;
		width: 100%;
		top: 104px;
		z-index: 5;
	}
	
	.middle .wrapper {
		padding: 90px 10px 10px;
		z-index: 5;
	}
	
		.middle h1, .middle .h1 {
			font-size: 50px;
			line-height: 54px;
			display: inline-block;
			margin-bottom: 60px;
		}
		
		.middle .h1 {
			color: #000000;
			font-family: 'intro_regular',sans-serif;
		}
			
		.middle .content {
			padding: 0 0 30px 80px;
		    position: relative;
		    z-index: 5;
		}
		
		.middle .icon {
			left: 10px;
		    position: absolute;
		    top: 195px;
		    z-index: 1;
		}
		
			.middle .icon img {
				display: inline;
			}
			
		.mov_bg {
			background-repeat: no-repeat !important;
		    bottom: 0;
		    display: block;
		    left: 0;
		    position: absolute;
		    right: 0;
		    top: 0;
		    width: 100%;
			z-index: 2;
		}
		
		/*----------------*/
		.about h1 {color: #ffffff;}				
		.about .content {color: #FFFFFF;}		
		.about .mov_bg {background: url("../images/move_bg11.png") no-repeat scroll center 0 transparent;}		
		.about .mov_bg.slow {background: url("../images/move_bg12.png") no-repeat scroll center 0 transparent;}
		
		/*----------------*/
		.promo .wrapper {
			padding: 0 10px;
			height: 100%;
		}
		
		.promo .content {
			text-align: center;
			padding: 0 80px 30px;
			color: #FFFFFF;
			width: 820px;
		}
		
			.promo .promo_img {
				margin-bottom: 40px;
			}
			
		.promo_center {
			float: left;
		    height: 50%;
		    margin-bottom: -210px;
	    	width: 100%;
		}
			
		.promo_box {
			clear: both;
	    	height: 420px;
		    position: relative;
			margin: 0 auto;
	    	width: 980px;
		}
		
		.promo .icon {
		    top: 23px;
			left: 0;
		}
		
		/*----------------*/
		.services .h1 {color: #242121;}	
			
		.services .content {
			color: #525252;
		    width: 515px;
		}
		
			.services .content .announce {
				color: #000000;
			}
			
			.services .phone {
				background: url("../images/phone.png") no-repeat scroll 0 0 transparent;
			    height: 808px;
			    position: absolute;
			    right: -60px;
			    top: 100%;
			    width: 458px;
			    z-index: 10;
			}
		
		/*----------------*/
		.team .h1 {color:#242121;}	
			
		.team .wrapper {
			left: 50%;
		    margin: 0 0 0 -500px;
		    position: absolute;
		    top: 0;
		    z-index: 5;
		}
		
		/*----------------*/
		.technologies .h1 {color: #ffffff;}		
		
			.technologies .tech_list .tech_item {
				float: left;
			    padding: 0 20px;
			}
			
		.technologies .mov_bg {background: url("../images/move_bg51.png") no-repeat scroll center 0 transparent;}		
		.technologies .mov_bg.slow {background: url("../images/move_bg52.png") no-repeat scroll center 0 transparent;}
		
		/*----------------*/
		.contacts .h1 {color: #242121;}	
		
			.contacts .our_socials {
				border-bottom: 1px solid #00AA9F;
			    padding-bottom: 36px;
				margin-bottom: 38px;
			}
	
				.contacts .our_socials .soc_icon {
					background: url("../images/icons.png") no-repeat scroll 0 0 transparent;
					display: inline-block;					    
				    margin: 0 17px 0 0;
				    vertical-align: middle;					    
					height: 37px;
				}
				
				.contacts .our_socials .social {
					display: inline-block;
				    margin-right: 40px;
				    vertical-align: middle;
				}
				
				.contacts .our_socials .mail .soc_icon {background-position: 0 2px; width: 52px;}
				.contacts .our_socials .yt .soc_icon {background-position: 0 -96px; width: 52px;} 
				.contacts .our_socials .fb .soc_icon {background-position: -10px -199px; width: 32px;}
	
				.contacts .our_socials a {
					color: #000000;
					border-bottom: 1px solid #999999; 
				    font-size: 14px;
					vertical-align: middle;
					text-decoration: none;
				}
				
				.contacts .our_socials a:hover {
					border-bottom: medium none;
				}
				
		.feedback {
			margin: -13px 0 100px;
			position: relative;
	    }
    
			.feedback .form_item {
				margin-bottom: 20px;
		    	position: relative;
		    	text-align: left;
			}
			    
		    	.feedback input,
		    	.feedback textarea,
		    	.feedback label {
		    		color: #ffffff;
				    font-size: 14px;
					font-family: Georgia;
					font-style: italic;				
					padding: 10px 20px 14px;
				}
				
				.feedback .error input,
		    	.feedback .error textarea {
					background-color: #D71F1F;
				}
		    	
				.feedback input,
		    	.feedback label {
		    		height: 16px;
					width: 370px;
		    	}
		    	    	
				.feedback label {
					display: block;
				    left: 0;
				    position: absolute;
				    top: 0;
				    z-index: 10;
		    		cursor: text;	    
		    	}
	    	
		    	.feedback input,    	
		    	.feedback textarea {
					background: none repeat scroll 0 0 #00aa9f;
				    border: medium none;			    
		    	}
		    	
				.feedback input {
					margin-right: 10px;  			    
		    	}
		    	
		    	.feedback textarea {
					width: 860px;		    		    
				    resize: none;	    			    
		    	}
		    	
		    	.feedback .button {
					background-color: #242121;
				    color: #FFFFFF;
				    display: inline-block;
				    font-size: 14px;
				    line-height: 16px;
				    padding: 11px 20px 13px;
				    text-decoration: none;
		    	}
		    	
		    	.error em {
		    		background: url("../images/error.png") no-repeat scroll 0 12px transparent;
					color: #D71F1F;
				    display: inline-block;
				    font-size: 14px;				    
				    padding: 12px 0 4px 23px;
				    vertical-align: top;
				    white-space: nowrap;
		    	}
		    	
		.success {
			background-color: #FFFFFF;
		    border: 1px solid #00AA9F;
		    font-size: 20px;
		    left: 50%;
		    line-height: 30px;
		    margin-left: -300px;
		    padding: 20px;
		    position: absolute;
		    text-align: center;
		    top: 64px;
		    width: 560px;
		    z-index: 100;
		}
		    	
		.inner .contacts {	
			position: relative;		
		}
		
			.inner .contacts_box {
				padding: 34px 0 0 80px;
				position: relative;
				z-index: 5;
			}
		    	
			.inner .icon {
			    left: 10px;
			    position: absolute;
			    top: 28px;
			    z-index: 1;
			}		    	
			
/*------------------ text -------------------*/
.text {
	font-size: 14px;
    font-style: italic;
    line-height: 24px;
}

.text p {
	margin: 0 0 12px;
}

.text p.announce {
	font-size: 20px;
    font-style: normal;
    line-height: 30px;
    margin-bottom: 21px;
}

/*--------------------------------------------- inner -------------------------------------------------*/
.inner {}

	.inner .page {
		background-color: #F5F5F5;
	    padding: 88px 0 60px;
	}
	
		.inner .ttl {
			border-bottom: 6px solid #00AA9F;
		    margin-bottom: 88px;
		    padding-bottom: 17px;
		}

			.inner h1 {
				color: #242121;
			    font-size: 50px;
			    line-height: 60px;
				margin-bottom: 23px;
			}
			
			.inner .date {
				background: url("../images/date.png") no-repeat scroll 0 0 transparent;
				color: #545454;
			    font-size: 17px;
			    font-style: italic;
			    line-height: 19px;
			    padding: 0 0 0 30px;
			}
			
		.inner .content {
			position: relative;
		}
			
			.inner .content .icon {
				left: 0;
    			top: 7px;
			}
	
			.inner .text {
				color: #000000;
				font-size: 17px;
    		    font-style: normal;
			    line-height: 30px;
			    padding: 0 0 0 80px;
			}		
		
				.inner .text img {
					display: block;
				    margin: 0 auto 17px;
				    max-width: 100%;
				}
		
				.inner .text p {
					margin-bottom: 30px;
				}
		
				.inner .text p.announce {
					font-style: italic;
				}
		
				.inner .text ul {
					margin: 0 0 30px 10px;
				}
		
					.inner .text ul li {
						background: url("../images/bg_li.png") no-repeat scroll 0 9px transparent;
						padding: 0 0 0 27px;
					}

/*----------------------------------------------- 404 -------------------------------------------------*/
#contain_404 {
	background: url("../images/bg2.jpg") repeat scroll center 0 transparent;
	height: 100%;
    min-height: 210px;
    min-width: 850px;
    position: relative;
}
	
	.wrapper_404 {
		margin: 0 auto;
		width: 850px;
		height: 100%;
	}
		
	.content_404 {
		clear: both;
    	height: 380px;
	    position: relative;
	}
	
	.content_404_bg {
		float: left;
	    height: 50%;
	    margin-bottom: -190px;
    	width: 100%;
	}
	
		.floatFiller {
			height: 100%;
		    width: 100%;
		}
		
		.img_404 {
			margin: 0 auto 43px;
			display: block;
		}
		
		.text_404 {
			color: #FFFFFF;
		    font-size: 20px;
		    font-style: italic;
		    position: relative;
		    text-align: center;
		    z-index: 5;
		}

			.text_404 a {
				color: #00aa9f;
			}
									
/*--------------------------------------------- footer ------------------------------------------------*/
footer {
	height: 146px;
	background-color: #242121;
	position: relative;
    z-index: 10;
}

	#coo {
		float: left;
	    padding: 52px 0 0;
	}

	#info {
		float: right;
    	padding: 50px 0 0;
	}

		#info .text {
			color: #b4b4b4;
		    font-style: normal;
		    text-align: right;
			float: left;
		}
		
			#info .text span {
				display: block;
			}

		#info .soc_links {
			float: left;
			padding: 7px 0 0 10px;
		}

			#info .soc_links a {
				background: url("../images/icons.png") no-repeat scroll 0 0 transparent;
				display: inline-block;
				vertical-align: middle;
				margin: 0 0 0 10px;
			}

			#info .soc_links .fb {
				background-position: -10px -302px;			    
			    height: 32px;			    
			    width: 32px;
			}

			#info .soc_links .yt {
				background-position: 0 -397px;
			    height: 37px;
			    width: 52px;
			}	

/* ------------------------------- align ----------------------------------- */
.justify {
	width: 100%;
	text-align: justify;
    line-height: 0;
	font-size: 14px;
    font-size: 1px; /* 1px для Opera */
    text-justify: newspaper;
    text-align-last: justify;
}

.justify:after {
    width: 100%;
    height: 0px;
    visibility: hidden;
    overflow: hidden;
    content: '';
    display: inline-block;
}

	.justify_item {
		display: inline-block;
	    text-align: left;
        line-height: normal;
        vertical-align: top;
	}