/*CSS RESET */
*{
	padding: 0;
	margin: 0;
}

main{
	width: 52vw;
	height: 44.5vw;
	background-color: #e4e5e0;
	margin: auto;
	margin-top: 4vw;
}

	section{
		width: 67%;
		height: 87%;
		margin: auto;
		margin-left: 16.5%;
	}

		article{
			width: 51%;
			height: 77%;
			margin: auto;
			margin-top: -66%;
		}

			figure{
				width: 40%;
				height: 3%;
				margin: auto;
				margin-top: -8vw;
			}

	.yellow{
		background-color: #f9fe26;
	}
		.yellow:hover{
			background-color: #e4e5e0;
		}

	.grey{
		width: 52vw;
		height: 2.5vw;
		margin: auto;
		background-color: #e4e5e0;
	}

	.lightred{
		width: 33%;
		height: 19%;
		margin: auto;
		margin-right: 17.8vw;
		margin-top: -30vw;
		background-color: #c21e10;
	}

		.lightred:hover{
			width: 33%;
			height: 19%;
			margin: auto;
			margin-right: 17.8vw;
			margin-top: -30vw;
			background-color: #980a1a;
		}

	.red{
		height: 38.5%;
		margin: auto;
		margin-top: 5.1vw; /*-17.1*/
		background-color: #980a1a;
	}

		.red:hover{
			height: 38.5%;
			margin: auto;
			margin-top: 5.1vw; /*-17.1*/
			background-color: #25251b;
		}

	.black{
		background-color: #25251b;
	}

		.black:hover{
			background-color: #fbaa2b;
		}

	.orange{
		width: 42%;
		height: 19.5%;
		margin-top: -13vw;
		background-color: #fbaa2b;
	}

		.orange:hover{
			width: 42%;
			height: 19.5%;
			margin-top: -13vw;
			background-color: #4f69c4;
		}

	.blue{
		background-color: #4f69c4;
	}

		.blue:hover{
			background-color: #f9fe26;
		}

	.blue2{
		width: 40%;
		height: 3%;
		margin: auto;
		margin-top: 0.65vw;
		background-color: #4f69c4;
	}

		.blue2:hover{
			width: 40%;
			height: 3%;
			margin: auto;
			margin-top: 0.65vw;
			background-color: #f9fe26;
		}

	.blue3{
		width: 40%;
		height: 3%;
		margin: auto;
		margin-top: 0.65vw;
		background-color: #4f69c4;
	}

		.blue3:hover{
			width: 40%;
			height: 3%;
			margin: auto;
			margin-top: 0.65vw;
			background-color: #f9fe26;
		}

	.blue4{
		width: 40%;
		height: 3%;
		margin: auto;
		margin-top: 0.65vw;
		background-color: #4f69c4;
	}

		.blue4:hover{
			width: 40%;
			height: 3%;
			margin: auto;
			margin-top: 0.65vw;
			background-color: #f9fe26;
		}

	.yellow1{
		width: 31%;
		height: 3%;
		margin: auto;
		margin-top: -7.9vw;
		margin-left: 17.5vw;
		background-color: #f9fe26;
	}

		.yellow1:hover{
			width: 31%;
			height: 3%;
			margin: auto;
			margin-top: -7.9vw;
			margin-left: 17.5vw;
			background-color: #e4e5e0;
		}

	.yellow2{
		width: 31%;
		height: 3%;
		margin: auto;
		margin-top: 0.65vw;
		margin-left: 17.5vw;
		background-color: #f9fe26;
	}

		.yellow2:hover{
			width: 31%;
			height: 3%;
			margin: auto;
			margin-top: 0.65vw;
			margin-left: 17.5vw;
			background-color: #e4e5e0;
		}

	.yellow3{
		width: 31%;
		height: 3%;
		margin: auto;
		margin-top: 0.65vw;
		margin-left: 17.5vw;
		background-color: #f9fe26;
	}

		.yellow3:hover{
			width: 31%;
			height: 3%;
			margin: auto;
			margin-top: 0.65vw;
			margin-left: 17.5vw;
			background-color: #e4e5e0;
		}

	.yellow4{
		width: 31%;
		height: 3%;
		margin: auto;
		margin-top: 0.65vw;
		margin-left: 17.5vw;
		background-color: #f9fe26;
	}

		.yellow4:hover{
			width: 31%;
			height: 3%;
			margin: auto;
			margin-top: 0.65vw;
			margin-left: 17.5vw;
			background-color: #e4e5e0;
		}