#menu {
	width: 100%;
	background-color: #fff;	
}
.menu-link {
	display: none;
}
.menu { 
    width: 100%;
	-webkit-transition: all 0.3s ease-out;  
	-moz-transition: all 0.3s ease-out;
	-ms-transition: all 0.3s ease-out;
	-o-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out; 
	text-align:center;
	margin-left:auto;
	margin-right:auto;
}
.menu ul { 
	padding: 0px;
	margin: 0px;
	list-style: none;
	position: relative;
	display: inline-table;
	font-size: 1em
}
.menu ul:after {
	content: ""; clear: both; display: block;
}
.menu ul li {
	padding: 0px;
}
.menu > ul > li { 
	display: inline-block;
}
.menu ul li > a { 
	padding: 8px 15px;	
}
.menu ul li a{
	-webkit-transition:color 0.2s ease-in;
	-o-transition:color 0.2s ease-in;
	-moz-transition:color 0.2s ease-in;
	display: block;
	text-decoration: none;
	color: #999;
	font-size: 14px;
    font-size: 1.4rem;
	text-align: left;
	font-weight: 400;
	text-transform: uppercase;	
}
.menu ul li a:hover {color: #000;-webkit-transition:color 0.8s ease-in;-o-transition:color 0.8s ease-in;-moz-transition:color 0.8s ease-in;}
#home #nav-home a, #history #nav-history a, #what #nav-what a, #news #nav-news a, #giving #nav-giving a, #contact #nav-contact a{color: #fff;
background-color:#708090}
#home #nav-home a:hover, #history #nav-history a:hover, #what #navwhat a:hover, #news #nav-news a:hover, #giving #nav-giving a:hover, #contact #nav-contact a:hover{background-color: #49545F}

@media screen and (max-width: 48em) {

#menu {
border-top:none;
}

a.menu-link {
		display: block;
		color: #fff;
		background-color: #333A42;
		float: right;
	text-decoration: none;

	padding-top: 10px;
	padding-right: 10px;
	padding-bottom: 10px;
	padding-left: 10px;
	font-weight:400
}

a.menu-link:hover {
	display: block;
	color: #fff;
	background-color: #333A42;
	text-decoration: none;
}
	.menu {
		clear: both;
		min-width: inherit;
		float: none;
	}
	.menu, .menu > ul ul {
		overflow: hidden;
		max-height: 0;
		background-color: #333;
		font-weight:400
	}
	.menu.active, .menu > ul ul.active {
		max-height: 55em;
	}
	.menu ul {
		display: inline;
	}
	.menu > ul {
		border-top: none;
	}
	.menu li, .menu > ul > li {
		display: block;
	}
	.menu li a {
		color: #000;
		display: block;
		padding: 0.8em;
		border-bottom: 1px solid #808080;
		position: relative;
	}	
	.menu li a.last {
		border-bottom: none;	
	}
	.menu li.has-submenu > a:after {
		content: '+';
		position: absolute;
		top: 0;
		right: 0;
		display: block;
		font-size: 1.5em;
		padding: 0.55em 0.5em;
	
}
}