/* =================== Mobile Nav Bar Styling =================== */
/* menu styling */
#nav_block {
	visibility: hidden; /* Use this instead of "display:none;" when adding a transition to the menu.*/
	opacity: 0; 
	transition: opacity 0.3s ease-in-out;
	position: absolute;
        top: 3.0em;
	right: 1.0em;
	overflow-y: auto; /* These two lines get the div to scroll */
	max-height: 75vh; /* = XX% of the viewport height */
	max-width: 85vw; /* = XX% of the viewport height */
	list-style-type: none;
	text-align: left;
	padding: 5px;
        z-index: 100; /* Make sure it's on top of anything below on the page. */
	background-color: #FFFFFF;
	border: 1px solid #000000;
	border-radius: 4px;
}
/* menu item styling */
#nav_block li {
	font-family: 'Roboto', Arial, sans-serif;
	font-weight: 400;
	/* These control the spacing of the items in the menu */
        padding-top: 5px; 
        padding-bottom: 4px;
        padding-left: 8px;
        padding-right: 8px;
        border-radius: 4px;
}
/* Style overrides for links in the menus */
#nav_block a {
	font-family: 'Roboto', Arial, sans-serif;
	font-weight: 400;
        color: #000000;
	letter-spacing: 0em;
	font-size: 1.2em;
        text-decoration: none;
        font-weight: normal;
	display: block;
}
#nav_block a:hover {
        color: #e0e0e0;
}
/* Nested menu styling */
#nav_block ul {
	list-style-type: none;
}
/* Nested menu item styling */
#nav_block ul li {
	letter-spacing: -0.05em;
        text-transform: none;
        margin-left: -30px; /* To remove the li indenting */
        margin-right: 0px;
	/* These control the spacing of the items in the menu */
        padding-top: 3px; 
        padding-bottom: 3px;
        padding-left: 12px;
        padding-right: 10px;
}

/* Hide some stuff in the mobile menus */
#nav_block .count, #user_nav_block {
        display: none;
}

/* =================== /Mobile Nav Bar Styling =================== */