
@media ( min-width: 992px ) {

	/* Depth-0 li */
	.website-navbar .navbar-nav .owmenu-li-depth-0:not( .owmenu-li-is-not-desktop ) {
		display: flex;
		align-items: center;
		position: static; /* Revert the hover style of default theme */
		margin-bottom: 0 !important; /* Revert the hover style of default theme */
	}

	/* Depth-0 a */
	.website-navbar .navbar-nav .owmenu-li-depth-0 > .nav-link {
		line-height: calc( var( --topbar-inner-height ) - 0.5rem );
		border-top: 0.25rem solid transparent;
		border-bottom: 0.25rem solid transparent;
		transition: color var( --owmenu-overlays-transition ), border-color var( --owmenu-overlays-transition );
		padding-top: 0 !important;
		padding-bottom: 0 !important;
	}
	.website-navbar .navbar-nav .owmenu-li-depth-0:not(.has-btn):hover > .nav-link,
	.website-navbar .navbar-nav .owmenu-li-depth-0:not(.has-btn):focus-within > .nav-link {
		color: var( --bs-primary ) !important;
		border-bottom-color: var( --bs-primary );
		padding-top: 0 !important;
		padding-bottom: 0 !important;
	}
	.nav-link.has-icon.owmenu-a-has-mega:before {
		content: "";                                           /* Force the height of the a-tag while there is no text in it (for placement of the underline, based on line-height). */
		display: inline-block;                                 /* Force the height of the a-tag while there is no text in it (for placement of the underline, based on line-height). */
		height: calc( var( --topbar-inner-height ) - 0.5rem ); /* Force the height of the a-tag while there is no text in it (for placement of the underline, based on line-height). */
		width: 0;                                              /* Force the height of the a-tag while there is no text in it (for placement of the underline, based on line-height). */
	}
	.nav-item.has-btn.owmenu-li-has-mega:before {
		height: var( --topbar-inner-height );
	}

	/* Depth-1 submenu */
	.website-navbar .navbar-nav .owmenu-ul-sub-depth-1 {
		top: 100%; /* Not further than the topbar underline */
		border-top: 1px solid var( --bs-border-color );
		border-top-right-radius: 0 !important;
	}

	/* Underlay */
	.website-menu-underlay {
		top: var( --topbars-height );
	}
	.website-navbar .navbar-nav .owmenu-li-depth-0.owmenu-li-has-no-mega:hover ~ .website-menu-underlay,
	.website-navbar .navbar-nav .owmenu-li-depth-0.owmenu-li-has-no-mega:focus-within ~ .website-menu-underlay {
		opacity: 0 !important;
	}

	/* Megamenu */
	body .owmenu-megamenu {
		top: calc( var( --topbars-height ) - 1px ) !important;
		max-height: calc( 100vh - var( --topbars-height ) );
	}

	/* Megamenu background grid lines */
	.-grid-lines {
		--width: calc( 100% - var( --bs-spacer-4 ) );
		--breakpoint-1: calc( ( var( --width ) / 12 ) + ( var( --bs-spacer-4 ) / 2 ) );
		--breakpoint-2: calc( ( var( --width ) / 12 ) * 2 );
		--breakpoint-3: calc( ( var( --width ) / 12 ) * 3 );
		--breakpoint-4: calc( ( var( --width ) / 12 ) * 4 );
		--breakpoint-5: calc( ( var( --width ) / 12 ) * 5 );
		--breakpoint-6: calc( ( var( --width ) / 12 ) * 6 );
		--breakpoint-7: calc( ( var( --width ) / 12 ) * 7 );
		--breakpoint-8: calc( ( var( --width ) / 12 ) * 8 );
		--breakpoint-9: calc( ( var( --width ) / 12 ) * 9 );
		--breakpoint-10: calc( ( var( --width ) / 12 ) * 10 );
		--breakpoint-11: calc( ( var( --width ) / 12 ) * 11 );
		background: linear-gradient(
			to right,
			transparent 0% calc( var( --breakpoint-1 ) ),
			var( --bs-border-color ) var( --breakpoint-1 ) calc( var( --breakpoint-1 ) + 1px ),
			transparent calc( var( --breakpoint-1 ) + 1px ) var( --breakpoint-2 ),
			var( --bs-border-color ) var( --breakpoint-2 ) calc( var( --breakpoint-2 ) + 1px ),
			transparent calc( var( --breakpoint-2 ) + 1px ) var( --breakpoint-3 ),
			var( --bs-border-color ) var( --breakpoint-3 ) calc( var( --breakpoint-3 ) + 1px ),
			transparent calc( var( --breakpoint-3 ) + 1px ) var( --breakpoint-4 ),
			var( --bs-border-color ) var( --breakpoint-4 ) calc( var( --breakpoint-4 ) + 1px ),
			transparent calc( var( --breakpoint-4 ) + 1px ) var( --breakpoint-5 ),
			var( --bs-border-color ) var( --breakpoint-5 ) calc( var( --breakpoint-5 ) + 1px ),
			transparent calc( var( --breakpoint-5 ) + 1px ) var( --breakpoint-6 ),
			var( --bs-border-color ) var( --breakpoint-6 ) calc( var( --breakpoint-6 ) + 1px ),
			transparent calc( var( --breakpoint-6 ) + 1px ) var( --breakpoint-7 ),
			var( --bs-border-color ) var( --breakpoint-7 ) calc( var( --breakpoint-7 ) + 1px ),
			transparent calc( var( --breakpoint-7 ) + 1px ) var( --breakpoint-8 ),
			var( --bs-border-color ) var( --breakpoint-8 ) calc( var( --breakpoint-8 ) + 1px ),
			transparent calc( var( --breakpoint-8 ) + 1px ) var( --breakpoint-9 ),
			var( --bs-border-color ) var( --breakpoint-9 ) calc( var( --breakpoint-9 ) + 1px ),
			transparent calc( var( --breakpoint-9 ) + 1px ) var( --breakpoint-10 ),
			var( --bs-border-color ) var( --breakpoint-10 ) calc( var( --breakpoint-10 ) + 1px ),
			transparent calc( var( --breakpoint-10 ) + 1px ) var( --breakpoint-11 ),
			var( --bs-border-color ) var( --breakpoint-11 ) calc( var( --breakpoint-11 ) + 1px ),
			transparent calc( var( --breakpoint-11 ) + 1px )
		);
	}
	.-grid-lines > * {
		position: relative; /* For :before */
	}
	.-grid-lines > *:before {
		content: "";
		position: absolute;
		top: calc( var( --bs-gutter-y ) * -1 );
		right: 0;
		left: 0;
		height: var( --bs-gutter-y );
		background: var( --bs-light );
	}
	.-grid-lines .owmenu-megamenu-block-content-wrapper {
		height: 100%;
		background: var( --bs-light );
		padding-right: var( --bs-spacer-4 ); /* Add some space for the line separators */
	}
	.-grid-lines .-filler {
		background: var( --bs-light );
		margin-left: calc( var( --bs-gutter-x ) * -1 );
	}

	/* Megamenu menu links */
	.owmenu-megamenu-block-type-menu .nav-link {
		margin-right: var( --bs-spacer-4 ); /* for :after */
		position: relative; /* for :after */
	}
	.owmenu-megamenu-block-type-menu .nav-link:after {
		content: "";
		position: absolute;
		right: calc( var( --bs-spacer-3 ) * -1 );
		top: 0;
		bottom: 0;
		margin: auto;
		width: 0.75rem;
		height: 0.75rem;
		border-top: 2px solid var( --bs-dark );
		border-right: 2px solid var( --bs-dark );
		transform: rotate( 45deg );
		opacity: 0;
		transition: opacity var( --owmenu-overlays-transition ), right var( --owmenu-overlays-transition );
	}
	.owmenu-megamenu-block-type-menu .nav-link:hover:after {
		opacity: 1;
		right: calc( ( var( --bs-spacer-4 ) * -1 ) + 0.25rem );
	}

}

body .owmenu-megamenu-background {
	background: var( --bs-light );
}
