// ---------------- Customizations to the mmenu install


/* Prevent the F.O.U.C. "flash"
------------------------------------------------------- */
/*
Hide the menu until the document is done loading 
(while it has not yet received the mm-menu classname)
*/
#my-menu:not( .mm-menu ) {
   display: none !important;
}

/* Re-style the mobile menu
------------------------------------------------------- */

// darker background color for the menu
/*
#menu { 
	background-color: #222; 
  font-family: $nav-global-font; 
  font-size: $nav-global-font-size; 
  line-height: $nav-global-line-height; 
  text-transform: $nav-global-text-transform; 
}
*/

/* ul.mm-list { padding: 5px 0 !important; } */
/* .nav-mobile-main-demographic ul.mm-list li a.mm-subopen {} */

/*
ul.mm-list li { border-bottom: 1px solid #222; }
ul.mm-list li a { 
	color: white !important; 
	background-color: #111; 
	line-height: 16px !important;
}
ul.mm-list li a:hover, 
ul.mm-list li a:active { 
	background-color: #000; 
}

ul.mm-list li a.mm-subopen { 
	background-color: $penofin-blue-light !important; 
	border: none !important;
	color: white !important; 
	line-height: 16px !important;
	height: 94% !important;
}

.mm-menu .mm-list > li > a.mm-subopen::after, 
.mm-menu .mm-list > li > a.mm-subclose::before { border-color:rgba(255,255,255,1) !important; }
.mm-menu .mm-list > li > a.mm-subopen::before { border: none !important; }

.nav-mobile ul.demographic {
	border-top: none; 
	margin: 0; 
}
.nav-mobile ul.demographic li {
	margin: 0 !important;
	display: block !important;
	float: none;
	width: 100%;
	text-align: left;
	border-bottom: 2px solid #222; 
	background-color: #111; 
}
.nav-mobile ul.demographic li a {
	color: $penofin-blue-light !important; 
	padding: 0.75rem; 
}
.nav-mobile ul.demographic li a:hover, 
.nav-mobile ul.demographic li a:active {
	color: white !important; 
}
.nav-mobile .demographic__toplink { 
	padding-left: 44px !important; 
  background-position: 1rem 50%;  
}
*/

/* nav mobile utility links */
/*
.nav-mobile-utility-links ul.mm-list li.mobile-social-icons { display: inline-block; }
.nav-mobile-utility-links ul.mm-list li.mobile-social-icons a { 
	padding: 0.75rem; 
	background-color: $penofin-blue-light !important; 
	border: none; 
	color: white; 
}
*/

/* back links for mobile sub-menus */
/* li.mm-subtitle a.mm-subclose { background-color: $penofin-blue-light !important; } */