/* 
    Created on : 21.03.2016, 13:31:11
	Author     : DFD
	Styles for : Header style 6
*/
@media only screen and (min-width : @header-responsive-breakpoint) {
	#header-container.header-style-6 {
		#header .header-wrap > .row:last-child .header-main-panel {
			.header-col-right {
				.hide();
			}
			.onclick-menu-wrap nav.onclick-menu .onclick-nav-menu .mega-menu-item .item-title.open {
				color: @third-site-light-color;
				border-bottom: 1px dotted fade(@menu_dropdowns-color, 10%);
			}
			.onclick-menu-wrap nav.onclick-menu .onclick-nav-menu .mega-menu-item .item-title.open + div.sub-nav {
				border-bottom: 1px dotted fade(@menu_dropdowns-color, 10%);
			}
			.header-col-fluid {
				margin-left: @header-logo-width;
				margin-right: 0;
				padding-right: 0;
				.onclick-menu-wrap {
					@button_s: 58px;
					.rel();
					float: right;
					.dfd-click-menu-activation-button {
						width: @button_s;
						height: @button_s - 10;
						margin-top: -(@button_s - 10 - @menu-inner-height)/2;
						margin-left: 0;
						> a {
							width: @button_s;
							height: @button_s - 10;
							margin-top: -(@button_s - 10)/2;
							margin-left: -@button_s/2;
							background: transparent;
							border: none;
							.rounded(0);
							.transition(~"background .3s ease .3s, color .3s ease .3s, border .3s ease .3s");
							.icon-wrap {
								width: 26px;
								margin-left: -13px;
								&:before {
									background: @header-sixth-text-color;
								}
								&:after {
									background: @header-sixth-text-hover-color;
								}
								&.dfd-top-line {
									&:before {
										.transition(~"left .3s ease-in-out, background .3s ease .3s");
									}
									&:after {
										.transition(~"left .3s ease-in-out, background .3s ease .3s");
									}
								}
								&.dfd-middle-line {
									&:before {
										.transition(~"left .3s ease-in-out .2s, background .3s ease .3s");
									}
									&:after {
										.transition(~"left .3s ease-in-out .2s, background .3s ease .3s");
									}
								}
								&.dfd-bottom-line {
									&:before {
										.transition(~"left .3s ease-in-out .4s, background .3s ease .3s");
									}
									&:after {
										.transition(~"left .3s ease-in-out .4s, background .3s ease .3s");
									}
								}
							}
							&:hover {
								background: @menu-dropdown-background;
								.rounded(2px);
								background: @header-sixth-text-hover-background;
							}
							&.opened {
								//border-color: @menu-dropdown-background;
								background: @menu-dropdown-background;
								.rounded-top(2px);
								.rounded-bottom(0);
								.transition(~"background 0s ease 0s, color 0s ease 0s, border 0s ease 0s");
								.icon-wrap {
									&:before,
									&:after {
										background: @menu_dropdowns-color;
									}
									&.dfd-top-line {
										&:before {
											.transition(~"left .3s ease-in-out, background 0s ease 0s");
										}
										&:after {
											.transition(~"left .3s ease-in-out, background 0s ease 0s");
										}
									}
									&.dfd-middle-line {
										&:before {
											.transition(~"left .3s ease-in-out .2s, background 0s ease 0s");
										}
										&:after {
											.transition(~"left .3s ease-in-out .2s, background 0s ease 0s");
										}
									}
									&.dfd-bottom-line {
										&:before {
											.transition(~"left .3s ease-in-out .4s, background 0s ease 0s");
										}
										&:after {
											.transition(~"left .3s ease-in-out .4s, background 0s ease 0s");
										}
									}
								}
							}
						}
					}
					.onclick-menu-cover {
						.abs();
						right: 0;
						top: 100%;
						overflow: hidden;
						.transform(translate3d(0,0,0));
						&:before {
							content: "";
							.block();
						}
						nav.onclick-menu {
							max-height: 100%;
							overflow-x: hidden;
							overflow-y: visible;
							margin-right: -30px;
							padding-right: 30px;
							.transform(translate3d(0,0,0));
						}
					}
				}
			}
		}
		&:not(.small) {
			#header {
				background: transparent;
				.header-wrap > .row:last-child .header-main-panel {
					.header-col-left {
						width: @header-logo-width;
						height: @menu-inner-height;
						* {
							height: @menu-inner-height;
						}
					}
				}
			}
		}
		&.small {
			#header {
				//background: transparent;
			}
			.onclick-menu-wrap {
				top: 5px;
			}
		}
	}
}