@media (max-width: 991px) {
    .has-cover.gh-head {
        display: flex;
        align-items: center;
        flex-direction: column;
        position: fixed;
        top: 0;
        bottom: 0;
        right: 0;
        left: 0;
        z-index: 10;
        width: 100%;
        height: 100vh;
        padding-top: 72px;
        background-color: var(--background-secondary);
        opacity: 0;
        visibility: hidden;
        transform: scale(0.96);
    }
    .has-cover.gh-head-open {
        opacity: 1;
        visibility: visible;
        transform: scale(1);
        transition: all half(var(--motion-duration)) cubic-bezier(0.694, 0, 0.335, 1);
    }
}

 @media (min-width: 991.1px) {
    .has-cover.gh-head {
        display: block;
        flex: 2;
        display: flex;
        align-items: center;
        justify-content: flex-end;
    }
}

@media (max-width: 991px) {
    .has-cover.gh-head-menu {
        width: 100%;
        padding-left: 32px;
        padding-right: 32px;
    }
}

@media (min-width: 991.1px) {
    .has-cover.gh-head-menu {
        display: flex;
        align-items: center;
        justify-content: flex-end;
    }
}    

@media (min-width: 991.1px) {
    li[class*="nav-"]:not(:last-child) {
        margin-right: 24px;
    }
}

@media (max-width: 991px) {
    li[class*="nav-"] {
        margin-bottom: 16px;
    }
}

@media (min-width: 991.1px) {
    li[class*="nav-"][class*="--hasDropDown"] {
        position: relative;
    }
	li[class*="nav-"][class*="--hasDropDown"] a:after {
		all: unset;
		content: "▼";
		padding-left: 5px;
		font-size: 12px;
		color: inherit;
	}
    li[class*="nav-"][class*="--hasDropDown"] .isDropDown a:after {
		display:none;
	}
    li[class*="nav-"][class*="--hasDropDown"]:focus-within > li[class*="nav-"]:after,
    li[class*="nav-"][class*="--hasDropDown"]:hover > li[class*="nav-"]:after {
        background-color: transparent;
    }
    li[class*="nav-"][class*="--hasDropDown"]:focus-within .isDropDown,
    li[class*="nav-"][class*="--hasDropDown"]:hover .isDropDown {
        opacity: 1;
        visibility: visible;
    }
}    

@media (min-width: 991.1px) {
	.isDropDown {
		z-index: 1;
		opacity: 0;
		visibility: hidden;
		position: absolute;
		margin: 0;
        min-width: 140px;
		max-width: unset;
		list-style: none;
		/* The padding inside the drop down (the space surrounding the links) */
		padding: 10px;
		/* The rounded corners of the drop down */
		border-radius: 6px;
		/* The background color of the drop down */
		background: #000;
		/* The color of the links in the drop down */
		color: inherit;
	}
	.isDropDown li[class*="nav-"] {
	    margin-right: 0 !important;
	}
	  
} 

li[class*="nav-"] a {
    display: flex;
    align-items: center;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    font-size: 16px;
    line-height: 1.5;
    font-weight: inherit;
    white-space: nowrap;
}    

.isDropDown .subitem{
    margin-bottom: 10px;
}

.isDropDown .subitem:last-child{
    margin-bottom: 3px;
}
.isDropDown .subitem:first-child{
    margin-top: 3px;
}


@media (max-width: 991px) {
    li[class*="nav-"] a {
        font-size: 2.5rem;
        line-height: 1.5;
    }
}  

@media (min-width: 991.1px) {
    li[class*="nav-"] a {
        position: relative;
    }


    li[class*="nav-"] a:after {
        content: "";
        display: block;
        width: 100%;
        height: 2px;
        position: absolute;
        bottom: -2px;
        background-color: transparent;
    }
}    

/* Underline or other style for the link of the Current Page you are on  */    
li[class*="nav-"].nav-current a:after {
    background-color: transparent;
}

/* Underline or other style for the Home link when you are on the Home page */
.home-template li[class*="nav-"].nav-current a:after {
    background-color: transparent;
}

/* Underline or other style for the links in certain states */
li[class*="nav-"] a:active:after,
li[class*="nav-"] a:focus:after,
li[class*="nav-"] a:hover:after {
    background-color: transparent;
}
    
@media (max-width: 991px) {
    #gh-head .gh-head-inner {
        grid-template-columns: 1fr;
    	height: auto;
	}
	.gh-head-open #gh-head .gh-head-menu,
    #gh-head .gh-head-menu .nav {
    	align-items: flex-start;
    	display: flex;
    	flex-direction: column;
        margin: 0 auto;
	}
    .gh-head-menu .nav li {
        text-align: left;
	}
    .gh-head-menu .nav li.hasDropDown {
        margin: 0;
    	padding: 0;
    	display: flex;
    	flex-direction: column;
    	align-items: flex-start;
	}
    .gh-head-menu ul.isDropDown {
    	list-style: none;
    	text-align: left;
    	margin: 0;
    	padding: 0 0 0 10px;
	} 
    .gh-head-menu ul.isDropDown li {
    	margin: 0;
    	padding: 0;
    	text-align: left;
	} 
    .gh-head-menu ul.isDropDown li a:before {
		all: unset;
		content: " - ";
    	}
    .gh-head-menu ul.isDropDown li a {
    	font-size: 2rem;
    	line-height: 1.5;
	}
}