#menu-button {
	width: 50px;
	height: 50px;
	border: 1px solid #fc0;
	border-radius: 3px;
	padding: 11px 5px;
	position: absolute;
	top: 15px;
	left: 50%;
	margin: 0 0 0 -25px;
	cursor: pointer;
	z-index: 110;
	display: none;
	transition: all .5s linear 0s;
}
#menu-button:hover {
	background: #fff2;
}
#menu-button i {
	display: block;
	height: 4px;
	background: #fc0;
	margin: 0 0 7px;
	transition: all .5s linear 0s;
}
#menu-button.opened {
	background: rgba(255,255,255,.3);
}
#menu-button.opened i {
	background: #fff;
}
#menu-button.opened i:nth-child(1) {
	transform: translateY(11px) rotate(45deg);
}
#menu-button.opened i:nth-child(2) {
	transform: scale(0,10);
	opacity: 0;
	border-radius: 100%;
}
#menu-button.opened i:nth-child(3) {
	transform: translateY(-11px) rotate(-45deg);
}
#menu-shadow {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0,0,0,.5);
	z-index: 100;
	display: none;
}
#menu-shadow.opened {
	display: block;
}


@media only screen and (max-width:1850px){
	header .wrap {
		position: relative;
	}
	.logo {
		left: 0;
		margin: 0;
	}
	#menu {
		margin: 0 200px 0 0;
	}
	#phones {
		margin: -32px 200px 0 0;
	}
	#request {
		right: 0;
		margin: 0;
	}
}


@media only screen and (max-width:1430px){
	.container {
		min-width: 1200px;
	}
	.wrap {
		width: 1200px;
	}
	#menu li {
		margin: 0 30px;
	}
	#services ul li {
		margin: 0 20px 0 0;
	}
	#services ul li a {
		width: 290px;
	}
	#services ul li a > span {
		font-size: 18px;
	}
	#services > figure img {
		width: 290px;
		height: 950px;
	}
	#services > figure img:nth-child(4n+2) {
		left: 310px;
	}
	#services > figure img:nth-child(4n+3) {
		left: 620px;
	}
	#services > figure img:nth-child(4n+4) {
		left: 930px;
	}
	#folio li {
		height: 300px;
	}
	#folio li a {
		padding: 20% 5% 0;
	}
	#folio li a strong {
		font-size: 26px;
		line-height: 1.2;
	}
	#block4 .wrap {
		padding: 0;
	}
	#partners {
		margin: 0 0 40px;
	}
	#partners div {
		padding: 40px 0!important;
	}
	#block5 .wrap {
		padding: 20px 0 150px;
	}
	#block5 h2 {
		font-size: 44px;
	}
	#block5 .left {
		width: 66.6%;
	}
	#block5 .right {
		width: 33.3%;
		padding: 0 40px;
	}
	#block5 .left aside {
		width: 380px;
		margin: 0 0 50px;
	}
	#block5 .left aside + aside {
		width: 330px;
		margin: 0 0 50px 50px;
	}
	#block5 footer {
		padding: 40px 0;
	}
	#project .left {
		width: 800px;
	}
	#device-view section {
		border-radius: 5px 5px 0 0;
	}
	#device-view section+section {
		border-radius: 20px 20px 0 0;
	}
	.video-about {
		height: 680px;
	}
	.partners li a, .partners li a i {
		width: 300px;
	}
	.blog-list li {
		padding: 30px 20%;
	}
	.services li {
		width: 385px;
		margin: 0 20px 20px 0;
	}
	.services li section {
		width: 385px;
	}
	.services li section > strong {
		padding: 0 70px;
	}
	footer .wrap section {
		margin: 0 350px 0 400px;
	}
}


@media only screen and (max-width:1240px){
	.container {
		min-width: 1000px;
	}
	.wrap {
		width: 1000px;
	}
	#menu li {
		margin: 0 15px;
	}
	#block1 .wrap {
		padding: 15vh 0 0;
	}
	#block1 .wrap h1 {
		width: auto;
		font-size: 64px;
	}
	#il li a span {
		font-size: 14px;
	}
	#services ul li a {
		width: 290px;
	}
	#services ul li a > span {
		font-size: 18px;
	}
	#services > figure img {
		width: 290px;
		height: 950px;
	}
	#services > figure img:nth-child(4n+2) {
		left: 310px;
	}
	#services > figure img:nth-child(4n+3) {
		left: 620px;
	}
	#services > figure img:nth-child(4n+4) {
		left: 930px;
	}
	.numbers li div, #block5 .left aside div {
		font-size: 80px;
	}
	.numbers li div sup, #block5 .left aside div sup {
		font-size: 50px;
	}
	#block5 .right {
		margin: 60px 0 0;
	}
	#block5 .right img {
		margin: -60px 0 15px;
	}
	#block5 h2 {
		font-size: 36px;
	}
	#block5 .left aside {
		width: 320px;
	}
	#block5 .left aside + aside {
		width: 270px;
	}
	#block5 .right {
		padding: 0 20px;
	}
	#project .left {
		width: 700px;
	}
	#device-view section {
		background-position: 50% 0;
	}
	#device-view section+section {
	}
	#project .right {
		width: 270px;
	}
	#project .right > p {
		display: none;
	}
	#project .right > ul {
		margin: 0;
	}
	#project .right > ul li {
		margin: 0 0 .2em;
	}
	.video-about {
		height: 560px;
	}
	.partners li a, .partners li a i {
		width: 250px;
	}
	.blog-list li {
		padding: 30px 10%;
	}
	.services li {
		width: 450px;
		margin: 0 30px 30px 0;
	}
	.services li section {
		width: 450px;
	}
	.services li section > strong {
		padding: 0 80px;
	}
	.services li:nth-child(3n) {
		margin: 0 30px 30px 0;
	}
	.services li:nth-child(2n) {
		margin: 0 0 30px;
	}
	.services li section:hover {
		height: 360px;
		margin: 0;
	}
	.services li section:hover > strong {
		margin: -150px 0 1em;
	}
	#block5 {
		background-position: 50% 60%;
	}
	#block5 .wrap {
		padding: 20px 0 100px;
	}
	#block5 aside {
		width: 400px;
	}
	#block5 aside + aside {
		margin: 80px 0 0;
	}
	footer .wrap section {
		margin: 0 250px 0 350px;
	}
}


@media only screen and (max-width:1020px){
	.container {
		min-width: 700px;
	}
	.wrap {
		width: 700px;
	}
	header {
		background: #1f2226;
	}
	header .wrap {
		height: 80px;
		padding: 20px 0 0;
	}
	.logo {
		top: 25px;
	}
	#menu {
		position: absolute;
		top: 80px;
		left: 0;
		right: 0;
		margin: 0;
		background: #fffe;
		box-shadow: 0 0 20px #000;
		z-index: 120;
		display: none;
	}
	#menu.opened {
		display: block;
	}
	#menu li {
		display: block;
		margin: 0;
	}
	#menu li a {
		border: 0;
		font-size: 24px;
		line-height: 1.5;
		color: #000;
		padding: 10px 30px;
	}
	#menu li a:hover {
		background: #fff2;
		text-shadow: 0 0 5px #000;
	}
	#menu-button {
		display: block;
	}
	#phones {
		display: none;
	}
	#request {
		top: 20px;
	}
	.block {
		height: auto!important;
		padding: 80px 0;
	}
	.block > i.next {
		display: none;
	}
	#block1, #block2 {
		border-bottom: 3px solid #fc0;
	}
	#block1 {
		display: none;
	}
	#block1 .video {
		display: none;
	}
	#block1 .wrap {
		padding: 0;
	}
	#block1 .wrap h1 {
		font-size: 48px;
		margin: 0 20px 50px;
		text-align: center;
	}
	#il li a img {
		display: block;
		margin: 0 auto 10px;
	}
	#block2 > section {
		display: none;
	}
	#services {
		height: auto;
		padding: 0;
		margin: 0 auto;
	}
	#services > figure {
		display: none;
	}
	#services section {
		display: none;
	}
	#services ul {
		width: auto;
		text-align: center;
		margin: 0 0 30px;
	}
	#services ul li {
		margin: 0 10px;
	}
	#services ul li a {
		width: 213px;
	}
	#services ul li a > span:after {
		display: none;
	}
	#services ul li a > span {
		font-size: 14px;
	}
	#folio li {
		width: 50%;
		height: 200px;
	}
	#folio li a {
		padding: 10%;
	}
	#folio li a strong {
		font-size: 16px;
	}
	.technologies img {
		margin: 0 30px 0 0;
	}
	#block5 h2 {
		font-size: 28px;
	}
	#block5 .left aside {
		width: auto!important;
		margin: 0 0 30px!important;
	}
	#block5 address {
		display: block;
		margin: 0 0 30px;
	}
	#block5 section {
		display: block;
		margin: 0;
	}
	#block4, #block5 {
		padding: 60px 0;
	}
	#block5 footer {
		padding: 30px 0;
	}
	#block5 .left, #block5 .right, #block5 .clear {
		display: none;
	}
	.video-about {
		height: 400px;
		display: none;
	}
	.partners li a, .partners li a i {
		width: 233px;
	}
	.blog-list li {
		padding: 30px 0;
	}
	.services li {
		width: 345px;
		margin: 0 10px 10px 0;
	}
	.services li section {
		width: 345px;
	}
	.services li:nth-child(3n) {
		margin: 0 10px 10px 0;
	}
	.services li:nth-child(2n) {
		margin: 0 0 10px;
	}
	.services li section > strong {
		padding: 0 65px;
	}
	#block5 {
		background: #f7f5eb;
	}
	#block5 .wrap {
		padding: 0;
	}
	#block5 aside {
		float: none!important;
		width: auto;
		margin: 30px 0 0!important;
	}
	footer .wrap section {
		width: 100%;
		overflow: hidden;
		padding: 20px 0 0;
		margin: 0;
	}
}