/*	Styles
	================================================ */
	
	html {
		font-family: "Source Sans Pro", "Lucida Grande", sans-serif;
		font-size: 87.5%;
	}

	header, nav, article, footer {
		max-width: 800px;
		margin: auto;
		border: thin solid #f8f8f8;
		box-sizing: border-box;
	}

	header {
		background: linear-gradient(to bottom,#f8f8f8,#ddd);
		padding: 1em;
	}

	header>h1 {
		margin: 0;
		font-size: 4em;
		color: #666;
		text-shadow: 0 1px white;
	}

	article>h1 {
		font-size: 2.5em;
		margin: 0 0 .25em 0;
	}

/*	Menu
	================================================ */
	
	ul#menu {
		margin: 0;
		padding: 0;
		list-style: none;
		display: table;
		width: 100%;
		table-layout: fixed;

	}
	ul#menu>li {
		display: table-cell;
	}
	ul#menu>li+li {
		display: table-cell;
		border-left: thin solid white;
	}
	ul#menu>li, ul#menu>li>a {
		text-decoration: none;
		font-size: 1.2em;
		color: white;
		background-color: #666;
		background-image: linear-gradient(to bottom, #999,#666);
		background-size: 100% 200%;
		background-position: 0 0;
		display: block;
		text-align: center;
		padding: .25em 0 .25em 0;
		transition: background-position .25s;
		position: relative;
	}
	ul#menu>li>a:hover {
		background-position: 0 100%;
	}
	ul#menu {

	}

ul#menu>li>ul {
	margin: 0;
	padding: 0;
	list-style: none;
	display: none;
}


ul#menu>li[open]>ul {
	color: red;
	display: block;
	background-color: white;
	border: thin solid #999;
	width: 100%;
	box-sizing: border-box;
	position: absolute;
	margin-top: .5em;
}
ul#menu>li>ul>li {
	display: block !important;;
}
ul#menu>li[open]>ul>li>a {
	text-decoration: none;
	text-align: center;
	width: 100%;
	color: #666;
	padding: .25em;
	display: block;
	box-sizing: border-box;
}
ul#menu>li>ul>li>a:hover {
	text-decoration: none;
	text-align: center;
	width: 100%;
	color: black;
	background-color: #eee;
}

li.more:after {
	content: "…"
}
