@import "hamburger.css";

.sgs-main-menu ul {
	--default-color: #5d0000;
	--hover-color: #000;
}

.sgs-main-menu .sgs-hamburger.right {
	float: right;
}

.sgs-main-menu ul {
	list-style-type: none;
	padding: 0;
	margin: 0;
	display: flex;
	column-gap: 10px;
}

/*
 * How should the menu items be spaced between each item
 */
.sgs-main-menu ul.space-evenly {
	justify-content: space-evenly;
}

.sgs-main-menu ul.center {
	justify-content: center;
}

.sgs-main-menu ul.end {
	justify-content: end;
}

.sgs-main-menu ul.space-between {
	justify-content: space-between;
}

.sgs-main-menu ul.space-around {
	justify-content: space-around;
}

.sgs-main-menu ul.right {
	justify-content: right;
}

/*
 * Vertical align
 */
.sgs-main-menu ul.vertical-align-center {
	align-content: center;
	flex-wrap: wrap;
	height: 100%;
}

/*
 * A Link
 */
.sgs-main-menu ul a, .sgs-main-menu ul a:link, .sgs-main-menu ul a:visited
	{
	text-decoration: none;
	color: var(--default-color);
}

.sgs-main-menu .sub-menu>ul {
	display: none;
}

.sgs-main-menu ul a:hover {
	color: var(--hover-color);
}

.sgs-main-menu li>ul {
	display: none;
}

.hamburger-menu-enabled .sub-menu:after {
	font-weight: bold;
	vertical-align: text-top;
	font-size: 1.0em;
}

.hamburger-menu-enabled .sub-menu.closed:after {
	content: " \021aa";
}

.hamburger-menu-enabled .sub-menu.opened:after {
	content: " \021a9";
}

.sgs-main-menu.hamburger-menu-enabled>ul {
	border: 5px solid black;
	padding: 10px;
	float: right;
	border-radius: 5px;
	margin: 10px;
	outline: 5px solid #d9d8d8;
	box-shadow: 3px 3px 20px 3px black;
	position: absolute;
	height: fit-content !important;
	z-index: 100;
	background: white;
}

.hamburger-menu-enabled .sgs-sub-menu {
	padding: 0 20px;
	border: 2px solid #c09b85;
	/* width: fit-content; */
	margin: 5px 30px;
	outline: 2px solid #742c00;
	border-radius: 2px;
}

.sgs-main-menu .sgs-hamburger {
	display: none;
}

.sgs-main-menu.hamburger-menu-enabled.simple>ul {
	display: block;
	right: 70px;
	top: 70px;
	right: 70px;
}

.sgs-main-menu.hamburger-menu-enabled.full>ul {
	display: flex;
	top: 70px;
	text-align: left !important;
	left: 0;
	/* WebKit-based browsers will ignore this. */
	width: -moz-available;
	/* Mozilla-based browsers will ignore this. */
	width: -webkit-fill-available;
	width: fill-available;
	z-index: 200;
}

.sgs-main-menu.hamburger-menu-enabled.full .sgs-hamburger {
	display: block;
}

.sgs-main-menu.hamburger-menu-enabled.full>ul li {
	width: 100%;
}

.sgs-main-menu.hamburger-menu-enabled>ul .sep {
	display: none;
}