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

}

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

.menuItem {
  position: absolute;
  display : flex;
  width: 11vw;
  height : 4vh;
  max-height: 8em;
  justify-content: center;
  align-items: center;
  left : calc(12.8vw * var(--i));
  top : -4px;
 /* top :   calc(-2px * var(--y));
  transform: rotate(var(--r));*/
  text-align : center;
  border-radius : 10px;
  background-size: 100% 100%;
  background-position: 0 0;
  background-repeat: no-repeat;
  transition: transform 0.3s ease;  
  overflow : hidden;
}

.menuItem:hover {
    transform: scale(1.2);
    z-index : 99;
}

#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(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%;
	height : 100%;
	display: grid; 
	place-items: center;	
    text-shadow: -0.5px -0.5px 0 var(--menu-shadow), 0.5px -0.5px 0 var(--menu-shadow), -0.5px 0.5px 0 var(--menu-shadow), 0.5px 0.5px 0 var(--menu-shadow);
	filter : drop-shadow(5px 5px 5px var(--menu-shadow));
}


.menuItem a:link {
	text-decoration:none; 
	overflow-wrap: break-word;
	font-size: clamp(14px, 4vw, 18px);
	color : var(--menu-text);
	text-shadow: -1px -1px 0 var(--menu-shadow),  
               1px -1px 0 var(--menu-shadow),
               -1px 1px 0 var(--menu-shadow),  
               1px 1px 0 var(--menu-shadow);

}

.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);
}


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

#cartDone {
	text-align : center;
	width : 80%;
	margin-left : auto;
	margin-right : auto;
	line-height : 2em;
	font-size : 1.5em;
}

@media only screen and (max-device-width: 767px) {

	.menuItem {
	    min-width : 17%;
	    width : 17%;
	    height : 40px;
	}
	
	
	.menuItem a:link {
		font-size: clamp(22px, 2vw, 32px);
		-webkit-transform:scale(1,1.5); /* Safari and Chrome */
	    -moz-transform:scale(1,1.5); /* Firefox */
	    -ms-transform:scale(1,1.5); /* IE 9 */
	    -o-transform:scale(1,1.5); /* Opera */
	    transform:scale(1,1.5); /* W3C */
	    line-height : 0.9em;
	    text-overflow: ellipsis;
	
	}


}
