/*-----------------------------*/
/*The More/Less button 
/*special width/style/contents*/
/*-----------------------------*/
#more_drop > span > .dropbtn {
  width:135px;
}
#more_drop > span > .dropbtn:before {
   content: 'More';
}
#more_drop:focus-within  > span > .dropbtn:before {
   content: 'Less';
}

/*---------------------------------------------------------*/
/*The contents of the dropdown
/*---------------------------------------------------------*/


#moredrop-1 > .dropdown_i {
  margin-bottom:0px;
}
#moredrop-2 > .dropdown_i {
  margin-bottom:120px;
}
#moredrop-3 > .dropdown_i {
  margin-bottom:0px;
}
#moredrop-4 > .dropdown_i {
  margin-bottom:0px;
}
#moredrop-5 > .dropdown_i {
  margin-bottom:0px;
}
#moredrop-6 > .dropdown_i {
  margin-bottom:##MD6DROP##px;
}
#moredrop-7 > .dropdown_i {
  margin-bottom:##MD7DROP##px;
}


/*The links (and dropdowns) in the more drop are hidden based on screen width. This is matched by them appearing on the main nav-bar*/

@media screen and (min-width: ##MD7WIDTH##)  {
	#moredrop-7{
			display:none;
		}
}

@media screen and (min-width: ##MD6WIDTH##)  {
	#moredrop-6{
			display:none;
		}
}
@media screen and (min-width: ##MD51WIDTH##)  {
	#moredrop-5{
			display:none;
		}
}
@media screen and (min-width: 1000px)  {
	#moredrop-4{
			display:none;
		}
}
@media screen and (min-width: 900px)  {
	#moredrop-3{
			display:none;
		}
}

@media screen and (min-width: 800px)  {
	#moredrop-2{
			display:none;
		}
}

@media screen and (min-width: 760px)  {
	#moredrop-1{
			display:none;
		}
}


/*Set stacking order of sub-dropdowns and their height here. Stacking order should go from high (near 0) for upper ones to low (more negative) for lower ones. I couldn't find a way of not setting the height manually for each dropdown so it is done here. Check how many pixels the menus below have to be pushed down (with margin-bottom) in order for the sub-dropdown to have enough space to drop. Originally 60*(number of links) px*/

#moredrop-1 > .dropdown_i > .dropdown-content_i {
	z-index: 997;
}
#moredrop-1 > .dropdown_i:focus-within {
  margin-bottom:0px !important;
}

/*----------*/

#moredrop-2 > .dropdown_i > .dropdown-content_i {
	z-index:998; 
}
#moredrop-2 > .dropdown_i:focus-within {
  margin-bottom:120px !important;
}

/*----------*/

#moredrop-3 > .dropdown_i > .dropdown-content_i {
	z-index:996; 
}
#moredrop-3 > .dropdown_i:focus-within {
  margin-bottom:0px !important;
}

/*----------*/

#moredrop-4 > .dropdown_i > .dropdown-content_i {
	z-index:995; 
}
#moredrop-4 > .dropdown_i:focus-within {
  margin-bottom:0px !important;
}

/*----------*/

#moredrop-5 > .dropdown_i > .dropdown-content_i {
	z-index:994; 
}
#moredrop-5 > .dropdown_i:focus-within {
  margin-bottom:0px !important;
}

/*----------*/

#moredrop-6 > .dropdown_i > .dropdown-content_i {
	z-index:993; 
}
#moredrop-6 > .dropdown_i:focus-within {
  margin-bottom:##MD6DROP##px !important;
}

/*----------*/

#moredrop-7 > .dropdown_i > .dropdown-content_i {
	z-index:992; 
}
#moredrop-7 > .dropdown_i:focus-within {
  margin-bottom:##MD7DROP##px !important;
}