.fixed-header-box {
	position  : relative;
	z-index: 10;
	margin    : 0 auto;
	max-width : @site-max-width;
	transition: box-shadow .3s ease, background-color .3s ease, transform .3s ease-out;
	box-shadow: 0 2px 2px 0 rgba(0,0,0,0.04);
	will-change: transform;

	body.full & {
		max-width: none;
	}

	body.wpv-not-scrolled.sticky-header-type-half-over & {
		border: none;
	}

	body.sticky-header-type-half-over.sticky-header.wpv-not-scrolled &,
	body.sticky-header-type-over.sticky-header.wpv-not-scrolled & {
		box-shadow: none;
	}

	html.touch body.fixed-layout & {
		top: .5px;
		z-index: 50000000000000;
	}

	html.touch body.fixed-layout.mfp-zoom-out-cur & {
		z-index: 50;
	}

	.logo-wrapper {
		display: table-cell;
		vertical-align: middle;
		text-align: center;

		.logo {
			text-decoration: none !important;
			line-height: 1;
			display: block;
			position: relative;

			img {
				clear: both;
				padding: 0;
				border: 0 !important;
				vertical-align: bottom;
			}

			&.text-logo {
				.wpv-font(logo-);
				line-height: 30px;

				&, &:hover {
					color: @logo-color;
				}
			}

			.ie9 &	{
				img {
					position: relative;
					z-index: 3;
				}
			}
		}

		.logo-tagline {
			.wpv-font(h6-);
			display: block;
			padding-top: 5px;
			color: @accent-color-6;
		}
	}
}

.header-content-wrapper {
	.bg(
		@header-background-image,
		@header-background-repeat,
		@header-background-position,
		@header-background-attachment,
		@header-background-color,
		@header-background-size
	);

	margin-top: 0;
	transition: background .3s ease;

	body.sticky-header-type-over.sticky-header.wpv-not-scrolled & {
		background-color: fade(@header-background-color, 0%);
	}

	body.sticky-header-type-half-over.sticky-header.wpv-not-scrolled &.second-row {
		background: fade(@accent-color-2, 20%);
	}
}

header.main-header {
	@menu-height: 49px;
	transition: background .3s ease;
	padding: 0;
	.border-box();

	body.sticky-header.wpv-scrolled &,
	body:not(.sticky-header-type-half-over):not(.sticky-header) &,
	body.sticky-header-type-half-over & .first-row {
		.bg(
			@header-background-image,
			@header-background-repeat,
			@header-background-position,
			@header-background-attachment,
			@header-background-color,
			@header-background-size
		);

		&.layout-standard,
		&.layout-logo-text-menu {
			.second-row {
				.bg(
					@sub-header-background-image,
					@sub-header-background-repeat,
					center top,
					scroll,
					@sub-header-background-color,
					@sub-header-background-size
				);
			}
		}
	}

	body:not(.sticky-header-type-over) & {
		&.layout-standard,
		&.layout-logo-text-menu {
			.second-row {
				.bg(
					@sub-header-background-image,
					@sub-header-background-repeat,
					center top,
					scroll,
					@sub-header-background-color,
					@sub-header-background-size
				);
			}
		}
	}

	body.sticky-header-type-over.sticky-header.wpv-not-scrolled & {
		&.layout-standard,
		&.layout-logo-text-menu {
			.second-row {
				border-top-color: fade( @default-line-color, 0.2 );
			}
		}
	}

	.header-padding {
		padding: 0 @horizontal-padding-large;
		box-sizing: border-box;

		&.limit-wrapper {
			max-width: @site-max-width + @horizontal-padding-large*2;
		}
	}

	.first-row {
		display: table;
		width: 100%;
		height: @header-height - @menu-height;
		box-sizing: border-box;

		body.boxed & {
			box-sizing: border-box;
		}

		.alternative-logo {
			position: absolute;
			top: 0;
			left: 0;
			opacity: 0;
		}

		body.sticky-header-type-over.sticky-header.wpv-not-scrolled & {
			.normal-logo {
				opacity: 0;
			}

			.alternative-logo {
				opacity: 1;
			}
		}
	}

	.second-row {
		clear: both;
		min-height: @menu-height;
		width: 100%;
		border-top: solid 1px fade(@accent-color-6, 10%);

		.second-row-columns {
			.border-box();
			position : relative;
			display: table;
			width: 100%;
		}
	}

	.header-left {
		display : table-cell;
		padding: 0;
		min-width: 160px;
		vertical-align: middle;
		white-space: nowrap;
	}

	.header-center {
		display : table-cell;
		width: 100%;
		vertical-align: middle;
		text-align: center;
		filter: none;
		padding: 0px;
		vertical-align: bottom;

		&:after {
			display: block;
			clear: both;
			content: "";
		}

		#megaMenu #megaMenuToggle {
			position: relative;
			padding-right: 30px;

			.megaMenuToggle-icon {
				position: absolute;
				top: 50%;
				right: 10px;
				margin-top: 4px;
			}
		}
	}

	.header-right {
		position: relative;
		display : table-cell;
		padding: 0;
		vertical-align: middle;
		text-align: right;
	}

	body.sticky-header-type-over.sticky-header.wpv-not-scrolled &,
	body.sticky-header-type-half-over.sticky-header.wpv-not-scrolled & {
		.vamtam-cart-dropdown-link {
			.icon {
				color: @main-menu-sticky-color !important;
			}

			.products.cart-emtpy {
				background: @main-menu-sticky-color !important;
				.readable-color( @main-menu-sticky-color ) !important;
			}
		}
	}

	#header-text {
		padding: 10px 0;
		white-space: nowrap;
		transition: color .3s;
		font-size: 11px;

		h4 {
			margin: 0;
			line-height: 10px;

			a {
				font-size: 16px;
				font-weight: 600;
				color: @accent-color-1;

				&:hover {
					color: @accent-color-3;
				}
			}
		}

		body.sticky-header-type-over.sticky-header.wpv-not-scrolled & {
			&, p, .icon {
				color: @main-menu-sticky-color !important;
			}
		}
	}

	button.header-search {
		border: 0;
		background: none;
		color: @accent-color-4;
		font-size: 20px;

		body.sticky-header-type-over.sticky-header.wpv-not-scrolled &,
		body.sticky-header-type-half-over.sticky-header.wpv-not-scrolled & {
			color: @main-menu-sticky-color;
		}

		&:active {
			.translate(0, 3px);
		}

		&:hover {
			color: @accent-color-1;
		}
	}

	.search-wrapper:not(:last-child) {
		padding-right: 10px;
	}

	body.wpv-not-scrolled:not(.sticky-header-type-over) & {
		border: 0;
	}

	&.layout-standard {
		.logo {
			height: auto;
			display: inline-block;
		}

		.first-row.header-padding {
			box-sizing: border-box;
		}

		.header-center:not(:first-child):last-child {
			padding-right: 160px;
		}

		body.header-cart-visible & {
			.header-center:not(:first-child) {
				padding-right: 70px;
			}

			.header-center.first-child {
				padding-right: 90px;
			}
		}

		body.sticky-header-type-half-over.sticky-header.wpv-not-scrolled #header-text {
			&, .icon {
				color: inherit !important;
			}
		}
	}

	&.layout-logo-menu {
		.header-contents {
			display: table;
		}

		.first-row {
			display: table-cell;
			width: auto;
			height: auto;
			background: transparent;
			vertical-align: middle;
			transition: border-radius .3s;

			body.sticky-header-type-half-over.sticky-header.wpv-not-scrolled &,
			body.sticky-header-type-over.sticky-header.wpv-not-scrolled & {
				border-radius: 5px 0 0 5px;
			}

			.logo-wrapper {
				display: block;
				min-height: @header-height;
				position: relative;
				text-align: left;

				&.loaded {
					img {
						transition: all .3s ease;
					}
				}

				&.scrolled {
					min-height: 0;
				}

				&:not( .scrolled ).with-text-logo {
					display: flex;
					flex-direction: column;
					justify-content: center;
				}
			}

			.logo-tagline {
				display: none;
			}
		}

		.second-row {
			display: table-cell;
			width: 100%;
			background: transparent;
			vertical-align: middle;
			text-align: right;

			#menus {
				padding: 9.5px 0;
				margin-right: -12px;
			}

			&.has-search {
				padding-right: 5px;
			}
		}

		.search-wrapper,
		#header-text {
			display: table-cell;
			vertical-align: middle;
			padding-left: 5px;

			body.sticky-header-type-over.sticky-header &:last-child {
				padding-right: 2px;
			}
		}
	}

	&.layout-logo-text-menu {
		.first-row {
			> .first-row-wrapper {
				height: @header-height - @menu-height;
			}

			.first-row-right-inner {
				display: table;
				width: 100%;
			}

			#header-text,
			.first-row-left,
			.first-row-right {
				display: table-cell;
				vertical-align: middle;
			}

			.first-row-left,
			.first-row-right {
				height: @header-height - @menu-height;
			}

			.first-row-right {
				width: 100%;
				text-align: right;
			}

			#header-text {
				padding: 0;
				width: 100%;
				padding: 10px 0 10px 40px;
				box-sizing: border-box;
				text-align: right;
				margin-left: auto;
				display: flex;
				justify-content: flex-end;

				> div:first-child:not(:last-child) {
					margin-right: @horizontal-padding;
				}

				p {
					display: inline-block;
					padding-left: 10px;
					text-align: left;
					font-size: 1em;

					strong {
						font-weight: 500;
						font-size: 1.2em;
					}
				}
			}
		}

		.second-row {
			#main-menu .menu {
				text-align: left;
			}

			.header-center {
				padding-right: 0;
				padding-left: 0;

				body.header-cart-visible & {
					padding-right: 60px;
				}
			}

			.search-wrapper {
				display: table-cell;
				vertical-align: middle;
				padding-left: 10px;
			}
		}
	}
}

#top-nav-sidebar {
	.widget {
		display: inline-block;
		margin: 0 @content-padding 0 0;
		vertical-align: middle;

		&:last-child {
			margin-right: 0;
		}
	}

	.widget-title {
		display: none;
	}

	.wpv_icon_link {
		.content {
			display: none !important;
		}
	}
}

.header-middle {
	position: relative;
	z-index: 10;
	margin-bottom: 0;

	> h4 {
		padding: @small-padding 0 0;
	}

	body.boxed & {
		> .limit-wrapper > .row,
		> .row {
			margin: 0;
		}
	}
}

#header-sidebars {
	position: relative;
	z-index: 5;
	padding: 5px 0 0;

	> .row {
		> aside {
			&.cell-1-2 { .grid-1-2; }
			&.cell-1-3 { .grid-1-3; }
			&.cell-1-4 { .grid-1-4; }
			&.cell-1-5 { .grid-1-5; }
			&.cell-1-6 { .grid-1-6; }
			&.cell-2-3 { .grid-2-3; }
			&.cell-2-5 { .grid-2-5; }
			&.cell-3-4 { .grid-3-4; }
			&.cell-3-5 { .grid-3-5; }
			&.cell-4-5 { .grid-4-5; }
			&.cell-5-6 { .grid-5-6; }
			&.last { margin: 0; }
		}
	}
}

#wpv-overlay-search {
	@size: 60px;
	margin: auto;
	max-width: 550px;
	font-size: 50px;

	input[type="text"] {
		width: 475px;
		height: @size;
		max-width: calc(~"100% - 100px");
		border: 0;
		border-bottom: 1px solid @accent-color-8;
		background: transparent;
		color: @accent-color-8;
		margin-bottom: 0;

		&::-webkit-input-placeholder {
			color: @accent-color-8;
		}
		&:-ms-input-placeholder {
			color: @accent-color-8;
		}
		&::placeholder {
			color: @accent-color-8;
		}
	}

	button[type="submit"] {
		width: @size;
		height: @size;
		border: 0;
		background: none;
		color: @accent-color-8;
		vertical-align: bottom;
		padding: 0;
	}

	body > & {
		display: none;
	}
}
