.box {
	background:black;
}
*,*:after,*::before {
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}
body {
	font-family:'Raleway',sans-serif;
}
nav a {
	position:relative;
	display:inline-block;
	margin:15px 25px;
	outline:none;
	text-decoration:none;
	text-transform:uppercase;
	letter-spacing:1px;
	font-weight:400;
	text-shadow:0 0 1px rgba(255,255,255,0.3);
	font-size:1.35em;
	padding:10px 0;
	color:#5cb85c;
	text-shadow:none;
}
nav a:hover,nav a:focus {
	outline:none;
}
.nav a::before {
	position:absolute;
	top:0;
	left:0;
	overflow:hidden;
	padding:10px 0;
	max-width:0;
	white-space:nowrap;
	border-bottom:2px solid white;
	color:white;
	content:attr(data-hover);
	-webkit-transition:max-width 0.5s;
	-moz-transition:max-width 0.5s;
	transition:max-width 0.5s;
}
.nav a:hover::before,.nav a:focus::before {
	max-width:100%;
}