*{
	margin:0;
	padding:0;
}

body {
	background: url(imagenes/fondo.jpg) no-repeat center center fixed;
	background-size: cover;
	-webkit-background-size: cover;
	-moz-background-size: cover;
}

.main, footer {
	background:#fff;
	width:90%;
	max-width:1000px;
	margin:20px auto;
}	
	
header {
	margin-top:10px;
	width:100%;
	overflow:hidden;
	height:150px;
	position:relative;
}

nav {
	top:-20px;
	margin:20px auto;
	width: 90%;
	max-width:1000px;	
	position:absolute;
	left:0;
	right:0;
	
}

nav ul {
	list-style:none;
}

nav > ul {
	display:table;
	width:100%;
	position:relative;
	background:#000;
}	

nav > ul li{
	display:table-cell;
}

/*Sub-menu*/
nav > ul > li:hover > ul {
	display:block;
	height: 100%;
}	

nav > ul > li > ul {
	display:block;
	background:#000;
	position:absolute;
	left:0;
	right:0;
	overflow:hidden;
	height:0%;
	-webkit-transition: all .3s ease;
	-moz-transition: all .3s ease;
	-ms-transition: all .3s ease;
	-o-transition: all .3s ease;
	transition: all .3s ease;	
}	

nav > ul li a {
	color:#fff;
	display:block;
	line-height:20px;
	padding:20px;
	position:relative;
	text-align:center;
	text-decoration:none;
	-webkit-transition: all .3s ease;
	-moz-transition: all .3s ease;
	-ms-transition: all .3s ease;
	-o-transition: all .3s ease;
	transition: all .3s ease;
}

nav > ul > li > ul > li a:hover {
	background:#5da5a2;	
}

nav > ul > li > a span {
	background:#174459;
	display:block;
	height:100%;
	width:100%;
	left:0;
	position:absolute;
	top:-55px;
	-webkit-transition: all .3s ease;
	-moz-transition: all .3s ease;
	-ms-transition: all .3s ease;
	-o-transition: all .3s ease;
	transition: all .3s ease;
	
}

nav > ul > li > a span .icon {
	display:block;
	line-height:60px;
}

nav > ul > li > a:hover > span {
	top:0;
}

/*colores*/
nav ul li a .primero {
	background:#0e5061;
}

nav ul li a .segundo {
	background:#5da5a2;
}

nav ul li a .tercero {
	background:#f25724;
}

nav ul li a .cuarto {
	background:#174459;
}

nav ul li a .quinto {
	background:#37a4d9;
}

.main .articles {
	width:68.5%;
	margin-right:1.5%;
	float:left;
	background:#fff;
}
.main .articles article {
	padding:20px;
	background:#fff;
	margin-bottom:20px;
}

.main .articles .grid-raviolis td {
	width: 50%;
	
}

aside{
	width:30%;
	background:#ff8000;
	float:left;
	padding:20px;
	box-sizing:border-box;
}

footer {
	background:#000;
	color:#fff;
	clear:both;
	padding:10px 0px;
	text-align:center;
}