/**************** 1024 *****************/

@media all and (max-width: 1169px){

/*------ Global ------*/
.grey_title {font: 900 22px/32px Proxima;}

/*------ Navigation ------*/
#navigation {}
	#navigation .menu {}
		#navigation .menu_item {font-size: 12px;}

/*------ Header ------*/
header {top: 70px;}

/*------ Top screen ------*/
#top_screen {height: 650px;}
	#top_screen form {width: 90%;}

/*------ Advantages ------*/
#advantages {}
	#advantages .items {}
		#advantages .items [class*="item"] {width: 310px; height: 110px; font: 700 16px/18px 'PT Sans'; padding-left: 105px; margin: 0 10px;}
			#advantages .items [class*="item"] .icon_wrapper {width: 110px; height: 110px; border-width: 6px;}
				#advantages .items [class*="item"] .icon_wrapper:after {width: 6px; right: -6px;}

/*------ Examples ------*/
#examples {}
	#examples .grey_title {margin-bottom: 40px;}

/*------ Quality ------*/
#quality {min-height: 580px;}

/*------ Assortment ------*/
#assortment {}
	#assortment .fslider {margin-top: 40px;}

/*------ Repair ------*/
#repair {}
	#repair .content .button {line-height: 18px;}
		#repair .content .button .text {padding: 7px;}
		#repair .content .button .break_line {display: block;}

/*------ Statistics ------*/
#statistics {}
	#statistics .items {}
		#statistics .items [class*="item"] {margin: 0 30px;}
		#statistics .items [class*="item"]:nth-child(3n+2) {width: 340px;}

/*------ Partnership ------*/
#partnership {}
	#partnership h2 {margin-bottom: 60px;}

/*------ Benefits ------*/
#benefits {}
	#benefits .items {}
		#benefits .items [class*="item"] {width: 170px; font: 17px/21px 'PT Sans'; margin: 0 15px;}

/*------ Footer ------*/
footer {}
	footer .result {font: 900 22px/26px Proxima;}
		footer .result .icon {top: -10px;}

}

/**************** 768 *****************/

@media all and (max-width: 1023px){

/*------ Global ------*/
html, body, header, section, footer, .section_bg {background-attachment: scroll !important;}

#global_wrapper {padding-top: 50px;}

.fslider_arrow {}
	.fslider_arrow.prev {left: -40px; border-radius: 6px;}
	.fslider_arrow.next {right: -40px; border-radius: 6px;}

.grey_title {font: 900 18px/26px Proxima;}
h2 {font: 900 24px/26px Proxima;}

form {}
	.form_header strong {font: 900 22px/24px Proxima;}

/*------ Navigation ------*/
#navigation {background: #fff; box-shadow: 0 2px 12px rgba(51,92,147,0.5); position: fixed; top: 0;}
#navigation .wrapper {padding: 5px 15px;}
	#navigation .logo {display: inline-block;}
	#navigation .phone {display: inline-block;}
	#open_nav {display: inline-block;}
	#navigation .menu {width: 100%; height: 100%; background: #fff; padding: 60px 15px; margin: auto; position: fixed; left: -220%; right: 0; top: 0; bottom: 0; overflow: auto; -webkit-overflow-scrolling: touch; -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s;}
	#navigation .menu.active {left: 0;}
		#navigation .menu ul {text-align: center;}
			#navigation .menu_item {display: block; height: auto; font: 700 16px/20px Proxima; color: #335c93; margin-bottom: 10px;}
			#navigation .prices {margin-top: 25px;}
				#navigation .prices .dropdown {opacity: 1; visibility: visible; width: 100%; background: none; box-shadow: none; position: relative; top: auto; right: auto; margin: 10px auto 0;}
					#navigation .prices .dropdown a {font: 700 14px/18px Proxima; text-align: center; padding: 0; margin: 0 0 8px;}
					#navigation .prices .dropdown a:last-child {margin-bottom: 0;}
		#navigation .active_line {display: none;}

/*------ Header ------*/
header {display: none;}

/*------ Top screen ------*/
#top_screen {height: 440px; -webkit-background-size: cover; background-size: cover;}
#top_screen .wrapper {padding: 50px 15px;}
	h1 {font: 900 30px/30px Proxima;}
	h1 + p {font: 18px/20px 'PT Sans';}
	#top_screen form {padding: 35px 25px;}
		#top_screen form .content {padding: 0;}
			#top_screen form .field_input {width: 33%;}
			#top_screen form .submit {width: 30%;}

/*------ Advantages ------*/
#advantages {}
	#advantages .items {}
		#advantages .items [class*="item"] {width: 230px; height: auto; text-align: center; padding: 0;}
			#advantages .items [class*="item"] .icon_wrapper {width: 70px; height: 70px; border: none; margin: 0 auto 20px; position: relative;}
				#advantages .items [class*="item"] .icon_wrapper:after {display: none;}

/*------ Examples ------*/
#examples {}
	#examples .grey_title {margin-bottom: 30px;}
	#examples .fslider {margin-bottom: 16px;}
		#examples .fslider .slide {width: 230px; height: 132px; margin: 0 8px;}

/*------ Quality ------*/
#quality {min-height: 1px; -webkit-background-size: cover; background-size: cover;}
	#quality .items {margin-top: 70px;}
		#quality .items li {width: 340px; font: 900 20px/22px Proxima; padding-left: 55px;}

/*------ Repair ------*/
#repair {}
	#repair h2 {margin-bottom: 30px;}
	#repair .gallery {width: 100%; max-width: 500px; float: none; margin: 0 auto 20px;}
	#repair .content {width: 100%; max-width: 500px; float: none; margin: auto;}
		#repair .content .project_title {text-align: center;}

/*------ Statistics ------*/
#statistics {}
	#statistics .items {}
		#statistics .items [class*="item"] {width: 200px; font: 700 18px/22px 'PT Sans'; margin: 0 20px;}
		#statistics .items [class*="item"]:nth-child(3n+2) {width: 240px;}
			#statistics .items [class*="item"] .count {font: 700 80px/80px Proxima; margin: auto;}

/*------ Bakeries ------*/
#bakeries {}
	#bakeries .items {}
		#bakeries .item {width: 160px; margin: 10px;}

/*------ Contacts ------*/
#contacts .wrapper {padding: 0 15px;}
	#contacts .info {top: 40px;}
	#map {height: 550px;}

/*------ Benefits ------*/
#benefits .wrapper {padding: 50px 15px 30px;}
	#benefits .items_title {margin: 40px auto 30px;}
	#benefits .items {}
		#benefits .items [class*="item"] {margin: 0 20px 30px;}

/*------ Footer ------*/
footer {}
	footer .left_col {max-width: 440px;}
		footer .result {margin: 170px 0;}
			footer .result .icon {top: 0;}

/*------ Modals ------*/
#modal_bakery {width: 700px; padding: 25px;}

}

/**************** 480 *****************/

@media all and (max-width: 767px){

/*------ Global ------*/
.button {width: 300px;}

h2 {font: 900 22px/24px Proxima; padding-bottom: 20px;}
	h2:before {width: 140px;}

form {}
	.form_header strong {font: 900 20px/22px Proxima;}
	.field_input {margin-bottom: 15px;}

/*------ Navigation ------*/
#navigation .wrapper {padding: 5px 10px;}
	#navigation .logo {display: none;}

/*------ Top screen ------*/
#top_screen {height: auto;}
#top_screen .wrapper {padding: 60px 10px;}
	h1 {font: 900 28px/30px Proxima; padding: 0 10px; margin-bottom: 10px;}
	h1 + p {font: 16px/18px 'PT Sans'; margin-bottom: 40px;}
	#top_screen form {width: 100%; max-width: 460px; background: none; padding: 25px; position: relative; left: auto; right: auto; top: auto; bottom: auto;}
		#top_screen form .content {font-size: 0; text-align: center;}
			#top_screen form .form_header {color: #fff;}
			#top_screen form .field_input {width: 46%; margin: 0 5px;}
			#top_screen form .submit {width: 200px; margin: 15px auto 0;}

/*------ Advantages ------*/
#advantages .wrapper {padding: 40px 10px 0;}
	#advantages .items {}
		#advantages .items [class*="item"] {margin: 0 15px 30px;}

/*------ Examples ------*/
#examples .wrapper {padding: 40px 10px 20px;}
	#examples .fslider {margin-bottom: 15px;}
		#examples .fslider .slide {display: block; width: 300px; height: 172px; margin: 0;}
		#examples .fslider_arrow {}
			#examples .fslider_arrow.prev {left: -50px;}
			#examples .fslider_arrow.next {right: -50px;}

/*------ Clients ------*/
#clients .wrapper {padding: 40px 10px 70px;}
	#clients .contacts {display: none;}

/*------ Quality ------*/
#quality .wrapper {padding: 60px 20px;}
	#quality h2 {}
		#quality h2 .break_line {display: none;}
	#quality .items {margin-top: 50px;}
		#quality .items li {display: block; width: 300px; font: 900 18px/22px Proxima; margin: 0 auto 30px;}

/*------ Middle request ------*/
#middle_request .wrapper {padding: 60px 10px;}

/*------ Assortment ------*/
#assortment .wrapper {padding: 40px 10px;}

/*------ Repair ------*/
#repair .wrapper {padding: 40px 10px;}
	#repair h2 {}
		#repair h2 .break_line {display: none;}
	#repair .content {}
		#repair .content .project_title {font: 22px/26px 'PT Sans';}
		#repair .content .button {font-size: 13px;}

/*------ Statistics ------*/
#statistics .wrapper {padding: 40px 10px 15px;}
	#statistics .items {}
		#statistics .items [class*="item"] {width: 200px; font: 16px/20px 'PT Sans'; margin: 0 10px 30px;}
		#statistics .items [class*="item"]:nth-child(3n+2) {width: 200px;}
			#statistics .items [class*="item"] .count {font: 700 60px/60px Proxima;}

/*------ Partnership ------*/
#partnership .wrapper {padding: 40px 10px;}
	#partnership h2 {margin-bottom: 30px;}
	#partnership .photo {width: 100%; max-width: 500px; float: none; margin: 0 auto 30px;}
	#partnership .content {width: 100%; max-width: 500px; float: none; margin: auto;}
		#partnership .content li {margin-bottom: 10px;}
		#partnership .content .button {font-size: 13px; margin-top: 20px;}

/*------ Restaurants ------*/
#restaurants .wrapper {padding: 40px 10px;}
	#restaurants h2 + p {font-size: 16px;}
	#restaurants .logotypes {}
		#restaurants .logotype {max-width: 230px; margin: 10px;}

/*------ Bakeries ------*/
#bakeries .wrapper {padding: 40px 10px;}
	#bakeries .items {}
		#bakeries .item {width: 130px; margin: 5px;}
			#bakeries .item .label {font-size: 14px; line-height: 18px; margin-top: 5px;}

/*------ Contacts ------*/
#contacts .wrapper {padding: 30px 10px 0;}
	#contacts .info {width: auto; margin: 0 auto 20px; position: static;}
		#contacts address {font: 700 18px/22px 'PT Sans';}
	#map {height: 400px;}

/*------ Benefits ------*/
#benefits .wrapper {padding: 40px 10px 20px;}

/*------ Footer ------*/
footer {-webkit-background-size: cover; background-size: cover;}
footer .wrapper {padding: 60px 10px;}
	footer h2 {margin-bottom: 30px;}
	footer .left_col {width: auto; max-width: 400px; float: none; margin: auto;}
		footer .contacts {margin: 20px auto 0;}
	footer .right_col {width: auto; max-width: 400px; float: none; margin: 0 auto 60px;}
		footer .result {font: 900 20px/24px Proxima; padding-left: 90px; margin: 0 auto 30px;}
		footer .logo {margin: auto;}

/*------ Modals ------*/
#modal_bakery {width: 460px; padding: 35px 15px 20px;}
	#modal_bakery .title {font: 700 20px/24px Proxima; margin-bottom: 20px;}
	#modal_bakery .photo {margin-bottom: 20px;}
	#modal_bakery .price {font: 700 20px/20px 'PT Sans'; margin-top: 20px;}

}

/**************** 320 *****************/

@media all and (max-width: 479px){

/*------ Global ------*/
.button {width: 280px;}

.grey_title {font: 900 16px/20px Proxima;}
	.grey_title strong {line-height: 100%; margin-bottom: 5px;}
h2 {font: 900 20px/20px Proxima; margin-bottom: 20px;}
	h2 span {font-size: 75%; margin-top: 5px;}

form {}
	.form_header strong {font: 900 18px/22px Proxima;}
	.field_input {margin-bottom: 10px;}

/*------ Top screen ------*/
#top_screen .wrapper {padding: 40px 10px;}
	h1 {font: 900 22px/26px Proxima; padding: 0; margin-bottom: 5px;}
	h1 + p { margin-bottom: 35px;}
	#top_screen form {max-width: 360px; padding: 20px;}
		#top_screen form .field_input {display: block; width: 100%; margin: 0 auto 15px;}
		#top_screen form .submit {display: block; width: 100%; margin: auto;}

/*------ Advantages ------*/
#advantages {}
	#advantages .items {}
		#advantages .items [class*="item"] {margin: 0 auto 30px;}

/*------ Examples ------*/
#examples {}
	#examples .fslider {}
		#examples .fslider .slide {width: 200px; height: 115px;}

/*------ Quality ------*/
#quality .wrapper {padding: 40px 10px;}
	#quality .items {margin-top: 40px;}
		#quality .items li {font: 900 16px/20px Proxima;}

/*------ Middle request ------*/
#middle_request .wrapper {padding: 40px 10px;}

/*------ Repair ------*/
#repair {}
	#repair .content {}
		#repair .content .project_title {font: 700 18px/22px 'PT Sans';}

/*------ Restaurants ------*/
#restaurants {}
	#restaurants .buttons {}
		#restaurants .button {display: block; width: 90%; max-width: 300px; margin: 0 auto 15px !important;}
		#restaurants .button:last-child {margin-bottom: 0 !important;}

/*------ Bakeries ------*/
#bakeries {}
	#bakeries .items {}
		#bakeries .item {width: 45%; width: calc(50% - 20px); margin: 5px;}

/*------ Contacts ------*/
#contacts {}
	#contacts h2 {margin-bottom: 5px;}
	#contacts address {font-weight: 400px;}
	#map {height: 340px;}

/*------ Benefits ------*/
#benefits {}
	#benefits h2 {}
		#benefits h2 .break_line {display: block;}
	#benefits .items_title {font: 16px/20px 'PT Sans'; margin: 30px auto 25px;}
	#benefits .items {max-width: 400px;}
		#benefits .items [class*="item"] {width: 140px; font: 14px/18px 'PT Sans'; margin: 0 8px 20px;}
		#benefits .items [class*="item"]:nth-child(2n+1) {margin-left: 0;}
		#benefits .items [class*="item"]:nth-child(2n+2) {margin-right: 0;}
			#benefits .items [class*="item"]:before {width: 32px; height: 32px; border-width: 2px; font: 700 18px/30px Proxima; left: 10px; top: 100px;}
			#benefits .items [class*="item"] .photo {width: 130px; height: 130px; margin-bottom: 10px;}

/*------ Footer ------*/
footer .wrapper {padding: 40px 10px;}
	footer h2 {margin-bottom: 20px;}
		footer h2 .break_line {display: block;}
	footer .phone {font: 700 22px/26px Proxima;}
	footer address {font: 18px/22px 'PT Sans';}
	footer .result {font: 700 16px/20px Proxima; text-align: center; padding: 0; padding: 0 20px; margin: 0 auto 30px;}
		footer .result .icon {position: static; margin: 0 auto 20px;}
	footer .logo {width: 240px; height: 25px;}

/*------ Modals ------*/
.f_modal {}
	.f_modal form {padding: 30px 15px;}

.close_modal {top: 5px; right: 5px;}

#modal_bakery {width: 300px; padding: 30px 15px 20px;}
	#modal_bakery .title {font: 700 18px/22px Proxima; padding: 0 10px;}
	#modal_bakery .info .heading {font: 700 16px/20px 'PT Sans';}

#modal_request_form {width: 300px;}
#modal_catalog_form {width: 300px;}
#modal_partnership_form {width: 300px;}

#modal_success {width: 300px; height: 220px;}
	#modal_success strong {font: 900 22px/26px Proxima; margin-bottom: 15px;}
	#modal_success p {font: 16px/20px 'PT Sans';}

}