// .lui-drop-down-menu {
// 	* { @include ease-out(); }

// 	position: relative;
// 	display: inline-block;
// 	height: $desktop-toolbar-height;
// 	font-size: $desktop-drop-down-menu-font-size;

// 	&.lui-open {
// 		.lui-menu {
// 		  opacity: 1;
// 		}
// 	}

// 	.lui-menu-label {
// 		line-height: $desktop-toolbar-height;
// 		position: absolute;
// 		padding-left: $desktop-gutter;
// 		top: 0;
// 		opacity: 1;
//     }

// 	.lui-menu-drop-down-icon {
// 		position: absolute;
// 		top: (($desktop-toolbar-height - 24px) / 2);
// 		right: $desktop-gutter-less;
// 		* {
// 		fill: $drop-down-menu-icon-color;
// 		}
//     }

// 	.lui-menu {
// 		.lui-menu-item {
// 			padding-right: ($icon-size + $desktop-gutter-less + $desktop-gutter-mini);
// 			height: $desktop-drop-down-menu-item-height;
// 			line-height: $desktop-drop-down-menu-item-height;
// 			white-space: nowrap;
// 		}
// 	}
// }

.lui-drop-down-menu {

	* { @include ease-out(); }


	transition: visibility 0s linear 0s;
	position: relative;
	display: inline-block;
	height: $desktop-toolbar-height;
	font-size: $desktop-drop-down-menu-font-size;

	&.lui-open {
		.lui-menu-control,
		.lui-menu-control:hover {
			.lui-menu-control-bg {
				opacity: 0;
			}
			.lui-menu-label {
				top: ($desktop-toolbar-height / 2);
				opacity: 0;
			}
		}

		.lui-menu {
			opacity: 1;
		}
	}

	.lui-menu-control {
		cursor: pointer;
		transition: visibility 0s linear 0s !important;
		@include clearfix();
		height: 100%;

		.lui-menu-control-bg {
			background-color: $menu-background-color;
			height: 100%;
			width: 100%;
			opacity: 0;
		}

		&:hover {
			.lui-menu-control-bg {
				opacity: 1;
			}
			.lui-menu-label {
				color: $lui-navbar-menu-hover-font-color !important;
			}
			.lui-menu-drop-down-icon{
				* {
					fill: $lui-navbar-menu-hover-font-color;
				}
			}
		}

		.lui-menu-label {
			line-height: $desktop-toolbar-height;
			color: $lui-menu-label-font-color;
			position: absolute;
			padding-left: $desktop-gutter;
			top: 0;
			opacity: 1;
		}

		.lui-menu-drop-down-icon {
			position: absolute;
			top: (($desktop-toolbar-height - 24px) / 2);
			right: $desktop-gutter-less;
			* {
				fill: $drop-down-menu-icon-color;
			}
		}

		.lui-menu-control-underline {
			border-top: solid 1px $border-color;
			margin: 0 $desktop-gutter;
		}
	}

	.lui-menu {
		.lui-menu-item {
			padding-right: ($icon-size + $desktop-gutter-less + $desktop-gutter-mini);
			height: $desktop-drop-down-menu-item-height;
			line-height: $desktop-drop-down-menu-item-height;
			white-space: nowrap;
		}
	}

}