#menu-wrapper {
	margin-left : 1vw;
	margin-top : 20px;

}

#mega-menu {
  display : flex;
  list-style-type: none;
}

#mainMenu ul {
	margin-left : 0;
	padding-left : 0;
}


.menuItem {
  position : absolute;
  display : inline-block;
  width: 10.5dvw;
  align-items: center;
  left : calc(10.8vw * var(--i));
  top :   0;
  /*calc(-2px * var(--y));
  transform: rotate(var(--r));*/
  text-align : center;
  background-size: 100% 100%;
  background-position: 0 0;
  background-repeat: no-repeat;
  transition: transform 0.3s ease;
  z-index : 991;
  font-size : 1.2rem;
  border : 1px solid var(--second);
}



#navToggle {
	display : none;	
}

.menuItem:hover {
    transform: scale(1.1);
    z-index : 992;
}

.subMenu {
	display : none;
	width : 100%;
}


.subMenuItem {
		position : static;
		display : block;
		font-size : 0.95rem;
}
	

.subMenuItem:hover {
    transform: scale(1.1);
}


#mega-menu li:nth-child(1) { --i: 0; }
#mega-menu li:nth-child(2) { --i: 1; }
#mega-menu li:nth-child(3) { --i: 2; }
#mega-menu li:nth-child(4) { --i: 3; }
#mega-menu li:nth-child(5) { --i: 4; }
#mega-menu li:nth-child(6) { --i: 5; }
#mega-menu li:nth-child(7) { --i: 6; }
#mega-menu li:nth-child(8) { --i: 7; }
#mega-menu li:nth-child(9) { --i: 8; }
#mega-menu li:nth-child(10) { --i: 9; }
#mega-menu li:nth-child(12) { --i: 10; }
#mega-menu li:nth-child(13) { --i: 11; }
#mega-menu li:nth-child(14) { --i: 12; }
#mega-menu li:nth-child(15) { --i: 13; }
#mega-menu li:nth-child(16) { --i: 14; }
#mega-menu li:nth-child(17) { --i: 15; }
#mega-menu li:nth-child(18) { --i: 16; }
#mega-menu li:nth-child(19) { --i: 17; }
#mega-menu li:nth-child(20) { --i: 18; }

#mega-menu li:nth-child(1) { --y: 0; }
#mega-menu li:nth-child(2) { --y: 1; }
#mega-menu li:nth-child(3) { --y: 2; }
#mega-menu li:nth-child(4) { --y: 2; }
#mega-menu li:nth-child(5) { --y: 1; }
#mega-menu li:nth-child(6) { --y: 0; }

/*#mega-menu li:nth-child(1) { --r: -1deg; }
#mega-menu li:nth-child(2) { --r: -2deg; }
#mega-menu li:nth-child(3) { --r: -3deg; }
#mega-menu li:nth-child(4) { --r: 3deg; }
#mega-menu li:nth-child(5) { --r: 2deg; }
#mega-menu li:nth-child(6) { --r: 1deg; }

#mega-menu li:nth-child(1) { background-image : url(/currentTheme/css/images/buttons/1.png) }
#mega-menu li:nth-child(2) { background-image : url(/currentTheme/css/images/buttons/2.png) }
#mega-menu li:nth-child(3) { background-image : url(/currentTheme/css/images/buttons/3.png) }
#mega-menu li:nth-child(4) { background-image : url(/currentTheme/css/images/buttons/4.png) }
#mega-menu li:nth-child(5) { background-image : url(/currentTheme/css/images/buttons/5.png) }
#mega-menu li:nth-child(6) { background-image : url(/currentTheme/css/images/buttons/6.png) }
#mega-menu li:nth-child(7) { background-image : url(/currentTheme/css/images/buttons/7.png) }
#mega-menu li:nth-child(8) { background-image : url(/currentTheme/css/images/buttons/8.png) }
*/


.menuItem a {
	width : 100%;
	min-height : 8vh;
	display: grid; 
	place-items: center;	
  	background-color : var(--third);
  	border : 2px solid var(--first);
}



.menuItem a:link {
	text-decoration:none; 
	overflow-wrap: break-word;
	color : var(--menu-text);


}

.menuItem a:visited {
	text-decoration:none;
	color :var(--menu-text);
}

.menuItem a:hover {
	text-decoration:none;
}

.menuItem a:visited:hover {
	text-decoration:none;
	font-weight : bold;
	color : var(--menu-text);
}


.subMenuItem a {
	 min-height : 4vh;
	}


.menuFill {
	width : 100%;
	height : 100%;
}



@media (hover: none) and (pointer: coarse) {

	
	#menu-wrapper {
		margin-top : 20px;
		width : 60%;
	}
	
	
	#navToggle {
		position : absolute;
		top : -0.5rem;
		font-size : 1.1rem;
		display : block;
		color : white;
		background-color : black;	
		left : 95%;
	}
	

	#mainMenu {
		display : none;
	  	width : 100dvh;
	 	margin-top : 2dvh;	 
	 	opacity : 1;
	}
	
	
	.menuItem {
	 	position : static;
	    width : 100%;
	    transition : none;
	    margin-left : -2em;
	    border : none;

	}
	
	.subMenu {
		display : block;
	}

	.subMenuItem {
		display : block;
	}	
	
	.menuItem:hover {
    	transform: none;
	}
	
}
