/* Ensures our position absolute for hamburger always works */
.mobile-button-wrapper {
  display:block;
  position: initial;
  background: black;
  height: 55px;
}

/* Hamburger CSS + Animation */
.mobile-button {
  display: inline-block;
  cursor: pointer;
}


#toggle-menu {
  position:relative;
  z-index:50;
  margin: 3px;
  padding: 3px;
  float: left;
}

/* force the "close" button to be top left */
#toggle-menu.change {
  position:absolute !important;
  /*top: 61px;
  left:5px;*/
}

.bar1, .bar2, .bar3 {
  width: 35px;
  height: 5px;
  background-color: #333;
  margin: 6px 0;
  transition: 0.4s;
}

.change .bar1 {
  -webkit-transform: rotate(-45deg) translate(-9px, 6px);
  transform: rotate(-45deg) translate(-9px, 6px);
}

.change .bar2 {opacity: 0;}

.change .bar3 {
  -webkit-transform: rotate(45deg) translate(-8px, -8px);
  transform: rotate(45deg) translate(-8px, -8px);
}






#sidemenu #menu li a.accordion-toggle {
  position: absolute;
  width: 100%;
  float: left;
}

#menu ul li > a:last-of-type {
  padding-left: 40px;
  width: 100%;
}




/* MERGED IN FROM OLD menu.css STYLES - Could probably use a more thorough clean-up */


#menu ul, #accordion-menu ul  {
  background: none;
  /*float: right;*/
  margin: 0;
  padding: 0;
  list-style: none;
}

#menu ul li, #accordion-menu ul li {
  float: left;
  position: relative;
  list-style: none;
  width: 100%;
  /*border: 1px solid #8a8d8a;*/
}

#menu ul li:nth-child(n+2), #accordion-menu ul li:nth-child(n+2) {
  margin-top: -1px;
  border-top: none;
}

#menu ul li, #accordion-menu ul li {
  float: left;
  position: relative;
  list-style: none;
  width: 100%;
 /* border: 1px solid #8a8d8a;*/
}

#menu ul li:nth-child(n+2), #accordion-menu ul li:nth-child(n+2) {
  margin-top: -1px;
}

#menu ul li a, #accordion-menu ul li a {
  display: block;
  text-decoration: none;
  text-transform: uppercase;
  padding: 10px;
  color: white;
  font-family: 'Montserrat',arial,sans;
  /* TOP LEVEL FONT STYLING */
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 1px;
}


#menu ul li a:hover, #accordion-menu ul li a:hover {
  color: #7dc241;
}


#menu .accordion-toggle {
  float: left;
}

#menu .accordion-toggle:before {
  content: "▼";
}

#menu .accordion-toggle.collapsed:before {
  content: "►";
}


/* MAIN MENU COLOR CHANGE ON HOVER */

#menu ul li a.active, #accordion-menu ul li a.active {
  color: black;
  /* MAIN MENU COLOR CHANGE WHEN PAGE ACTIVE */
}

/* ==== 2ND LEVEL DROP DOWN ==== */

#menu ul ul {
  /*visibility: hidden; OVERRIDDEN FOR SIDE NAV TREE MENU */
  /* DO NOT TOUCH */
  /*position: absolute; OVERRIDDEN FOR SIDE NAV TREE MENU */
  left: 0;
  top: 100%;
  opacity: 1;
  /*width: 220px;*/
  background: black;
  /* DROP DOWN BOX BG COLOR */
  /* border-bottom: 1px solid white; */
  /* DROP DOWN BOX BOTTOM BORDER */
  z-index: 9999;
}



/*#accordion-menu ul ul {
padding-left: 20px;
}*/


#menu ul ul li, #accordion-menu ul ul li {
  border: none;
}


#menu ul ul li a {
  text-align: left;
  padding: 8px 15px;
  margin: 0;
  font-size: 12px;
  text-shadow: none;
}

#menu ul ul ul li a {
  padding: 8px 5px 5px 25px;
}


/* DROP DOWN ITEMS COLOR CHANGE ON HOVER*/
#menu ul li:hover>ul {
  visibility: visible;
  /* @@@ DON'T TOUCH */
}


/* ==== 3RD LEVEL DROP DOWN ==== */

#menu ul ul ul {
  /* @@@ DON'T TOUCH, all other properties brought from 2ND LEVEL MENU (menu ul ul) */
  /*left: 100%; OVERRIDDEN FOR SIDE NAV TREE MENU */
  position: relative; /* ADDED FOR SIDE NAV TREE MENU */
  left: 20px;   /* ADDED FOR SIDE NAV TREE MENU */
  top: 0;
}


/* MOBILE ONLY
* If you need to add anything specific to the mobile version menu add it within the view port below
*/

@media (max-width: 1342px) {

	#menubar {
		position: absolute;
		top: -21px;
		left: 0px;
		min-width: 50%;
	}

	/*Override the desktop menu and style it so that it looks like an actual sliding menu*/
	#sidemenu {
		width: 320px;
	  -webkit-transition: margin 0.3s ease;
	  -moz-transition: margin 0.3s ease;
	  -o-transition: margin 0.3s ease;
	  transition: margin 0.3s ease;
	  position: absolute;
	  top: 0px;
	  left: 0px;
	  z-index: 1;
	  margin-left: -980px; /* required for slide transition */


		 /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#1956cf+0,1956cf+92,262626+100 */
	  background: #1e4e79; /* Old browsers */
	  background: -moz-linear-gradient(bottom, #1e4e79 0%, #1e4e79 85%, #262626 100%); /* FF3.6-15 */
	  background: -webkit-linear-gradient(bottom,  #1e4e79 0%, #1e4e79 85%,#262626 100%); /* Chrome10-25,Safari5.1-6 */
	  background: linear-gradient(to top, #1e4e79 0%, #1e4e79 85%,#262626 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1956cf', endColorstr='#262626',GradientType=1 ); /* IE6-9 */
	  /* end gradient bg */
	  box-shadow: 4px 6px 10px 2px #666

	}



	#sidemenu.in {
    margin-left:0px;
   }

	#sidemenu #menu {
		max-width: 100%;
	}

	.logo {
		/*margin: 10px 10px 10px 10px;*/
		display: none;
	}
	.dash-mobile-logo {
		margin: 0px;
		position: absolute;
		left: 70px;
		top: 12px;
	}

	#menu ul li a, #accordion-menu ul li a { color: white; }

	#leftpanel {
		background: red;
	}

}


/* DESKTOP ONLY */
@media (min-width: 1341px) {

	#sidemenu {
	  margin: 100px auto;
	  min-height: calc(100% - 350px);

	  /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#1956cf+0,1956cf+92,262626+100 */
	  background: #1e4e79; /* Old browsers */
	  background: -moz-linear-gradient(left,  #1e4e79 0%, #1e4e79 92%, #262626 100%); /* FF3.6-15 */
	  background: -webkit-linear-gradient(left, #1e4e79 0%, #1e4e79 92%,#262626 100%); /* Chrome10-25,Safari5.1-6 */
	  background: linear-gradient(to right, #1e4e79 0%, #1e4e79 92%,#262626 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1e4e79', endColorstr='#262626',GradientType=1 ); /* IE6-9 */
	  /* end gradient bg */

	}

	.mobile-button-wrapper {
	  display:none;
	}

	.dash-mobile-logo {
		display: none;
	}

}