@media (max-width: ~"@{mobile-top-bar-resolution}px") {
	@push-menu-width: 270px;
	@push-menu-transition: .5s;

	.responsive-layout {

		.fixed-header-box .cart-dropdown {
			display: none !important;
		}

		header.main-header {
			position: relative;
			top: 0;
			right: 0;
			left: 0;
			margin: 0;

			.header-padding {
				padding: 0;
			}

			.mobile-top-bar {
				display: block;
				padding: 5px 20px;
				box-sizing: border-box;
				max-width: 100%;
			}

			.logo-wrapper {
				.logo {
					min-width: 0 !important;
					width: 100%;

					display: table-cell;
					vertical-align: middle;

					img {
						top: 0;
						display: block;
						opacity: 1 !important;
						height: auto;
						max-width: 100%;

						&.alternative-logo {
							display: none;
						}
					}
				}

				.mobile-logo-additions {
					display: table-cell;
					vertical-align: middle;
					text-align: right;
					white-space: nowrap;

					.vamtam-cart-dropdown-link {
						display: inline-block;
						padding: 0;
						margin: 0 10px 0 0;
						vertical-align: middle;
					}

					.header-search {
						vertical-align: middle;
					}
				}
			}

			.header-left {
				.border-radius(0);
				display: none;
			}

			#header-text {
				display: none;
			}

			.header-right {
				display: none;
			}

			.second-row {
				.second-row-columns {
					display: block;

					.header-center {
						display: block;
					}
				}
			}

			.search-wrapper {
				display: none;
			}
		}

		.fixed-header-box .logo-wrapper {
			padding-right: 20px;
		}

		&.sticky-header-type-over.sticky-header.wpv-not-scrolled header.main-header.layout-logo-menu .first-row {
			border-radius: 0;
		}

		header.main-header {
			&.layout-logo-text-menu {
				.first-row {
					display: block;
					min-height: 0;
					height: auto;
				}

				.first-row-wrapper {
					padding: 0;
					height: auto;
				}

				.first-row-right {
					display: none;
				}

				.first-row-left {
					display: block;
					margin-bottom: 0;
					min-height: 0;
					height: auto;

					.logo-wrapper {
						display: block;
						min-height: 0;

						.logo {
							top: 0;

							img {
								padding: 10px 0 !important;
								top: 0 !important;
								max-width: 200px;
							}
						}
					}
				}
			}

			&.layout-logo-menu {
				.header-contents {
					display: block;
					padding: 0;
					margin: 0;
				}

				.first-row {
					display: block;
					padding: 0;

					.logo-wrapper {
						min-height: 0;

						.logo {
							top: 0;

							img {
								padding: 0 !important;
							}
						}
					}
				}
			}

			&.layout-standard {
				.first-row {
					height: auto;
					display: block;

					.logo-wrapper {
						display: block;
					}

					.logo {
						display: table-cell;

						img {
							padding: 0 !important;
						}
					}
				}
			}

			.top-nav,
			.second-row {
				display: none !important;
			}

			.logo {
				padding: 10px 0;

				img {
					max-height: 65px;
				}
			}

			.logo-wrapper {
				padding-left: 70px;
				.clearfix();
			}
		}

		.fixed-header-box {
			padding: 0;
		}

		#menus {
			float: none;
			display: inline-block;
		}

		#mp-menu-trigger {
			@size: 35px;
		 	position: absolute;
			top: 50%;
			left: 0;
			z-index: 600;
			display: block;
			margin-top: -@size / 2;
			padding-left: 20px;
			padding-right: 20px;
			width: @size;
			height: @size;
			text-indent: -100000px;
			cursor: pointer;
			visibility: hidden;

			&:before {
				position: absolute;
				top: 0;
				left: 20px;
				padding: 0;
				width: @size;
				height: @size;
				color: @accent-color-1;
				text-indent: 0;
				font-size: @size;
				line-height: .9;
			}
		}

		.mp-pusher {
			position: relative;
			left: 0;
			height: 100%;
		}

		.mp-menu {
			position: fixed;
			top: 0;
			left: -@push-menu-width;
			z-index: 110 !important;
			display: block;
			width: @push-menu-width;
			height: 100%;
			background-color: @accent-color-7;

			ul {
				margin: 0;
				padding: 0;
				list-style: none;

				li {
					padding-bottom: 0;

					li:first-child {
						padding-top: 0;
					}

					> a {
						.wpv-font(menu-font-);
						.transition(~"background 0.3s ease-out, box-shadow 0.3s ease-out");
						display: block;
						padding: @small-padding/2 @small-padding;
						outline: none;
						box-shadow: inset 0 -1px rgba(255,255,255,0.2);
						color: @menu-font-color;

						&.has-children {
							&::after {
								float: right;
								margin-right: -10px;
								color: @menu-font-color;
								content: icon(theme-angle-right);
								font-size: 15px;
								font-family: 'theme';
								font-style: normal;
							}
						}

						&:hover {
							text-decoration: none;
						}
					}

					&::before {
						position: absolute;
						left: 10px;
						z-index: -1;
						color: rgba(0,0,0,0.2);
						line-height: 3.5;
					}
				}
			}

			h2 {
				.wpv-font(menu-font-);
				margin: 0;
				padding: 1em;
				color: @menu-font-color;
				text-transform: uppercase;
				letter-spacing: 1px;
				font-weight: 700;
				font-size: 1em;
			}

			.mp-level {
				&,
				&.mp-level-open {
					.mp-level:not(.mp-level-open) {
						display: none;
					}
				}
			}
		}

		.mp-level {
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			background: @accent-color-7;

			&::after {
				z-index: -1;
			}

			&.mp-level-overlay {
				cursor: pointer;

				&.mp-level::before {
					width: 100%;
					height: 100%;
					background: transparent;
					opacity: 1;
				}
			}

			.mp-level {
				position: relative;
			}

			.mp-back + ul {
				box-shadow: inset 0 1px rgba(255,255,255,0.1);
			}
		}

		/* overlays for pusher and for level that gets covered */
		.mp-pusher::after,
		.mp-level::after,
		.mp-level::before {
			position: absolute;
			top: 0;
			right: 0;
			width: 0;
			height: 0;
			content: '';
			opacity: 0;
		}

		.mp-pusher.mp-pushed::after,
		.mp-level.mp-level-overlay::after {
			.transition(opacity @push-menu-transition ease-out);
			width: 100%;
			height: 100%;
			opacity: 1;
		}

		.mp-pusher {
			&::after {
				.transition(~"opacity 0.3s ease-out, width 0.1s 0.3s ease-out, height 0.1s 0.3s ease-out");
				background: rgba(255,255,255,0.8);
				z-index: 100;
			}
		}

		.mp-menu ul li a:not(.mp-back):hover {
			background: @main-menu-hover-background;
			color: @css_menu_hover_color;
		}

		.mp-menu .mp-level.mp-level-overlay > ul > li > a,
		.mp-level.mp-level-overlay > ul > li:first-child > a {
			box-shadow: inset 0 -1px rgba(255,255,255,0);
		}

		.mp-back {
			.transition(background 0.3s ease-out);
			position: relative;
			display: block;
			padding: 1em;
			outline: none;
			background: @accent-color-6;
			box-shadow: inset 0 1px rgba(255,255,255,0.1);
			color: @accent-color-8;
			text-transform: uppercase;
			letter-spacing: 1px;
			.wpv-font(primary-font-);
			font-weight: bold;

			&::after {
				position: absolute;
				right: 10px;
				color: @accent-color-8;
				content: icon(theme-angle-left);
				font-size: 15px;
				font-family: 'theme';
				font-weight: normal;
				font-style: normal;
			}
		}
	}
}
