html, body
{
	margin: 0;
	padding: 0;
	border: none;

    font-family: 'Roboto', sans-serif;

	max-width: 100vw;
	overflow-x: hidden;

	background: url(background.jpg) no-repeat center center fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}

ul
{
	list-style: none;
	
	position: absolute;
	top: 50vh;
	left: 3vw;

	margin: 0;
	padding: 0;
}

ul li
{
	height: 50px;
}

ul li.space
{
    margin-bottom: 40px !important;
}

ul li a
{
	text-decoration: none;
}

ul li a:hover
{
    text-decoration: none;
}

ul li a:hover > .box
{
	width: 3em;
}

ul li a .box
{
	width: 0;
	height: 37px;

	display: inline-block;

	background-color: #FFFFFF;

	transition: width 0.3s ease;

	transform: translate3d(0,0,0);
	-moz-transform: translate3d(0,0,0);
	-webkit-transform: translate3d(0,0,0);
}

ul li a p
{
	display: inline;

	font-weight: 800;
	font-size: 50px;

	text-shadow: 0px 0px 10px #000000;
	color: #FFFFFF;

	margin: 0;
	padding: 0;
}

/* *********** FOOTER */

#footer
{
	position: fixed;
    width: 100vw;
	bottom: 0;
	text-align: center;

	background-color: #202020;
}

#footer p
{
	margin: 0;
	padding: 0;
	
	font-size: 0.8em;
	font-weight: 300;	

	color: #ffffff;

	line-height: 1.5em;
}

.hidden
{
    display: none;
}