{
	padding: 0;
	margin: 0;
}
body{
	background-color: black;
}

main {
	width: 80vw;
	height: 37.8vw;
	background-color: #F5F5F5;
	margin: auto;
	margin-top: 7.2vw;
	padding-top: 0.9vw;
}

section {
	width: 38.8%;
	height: 98.4%;
	background-color: black;
	margin: auto;
	margin-top: -0.2%;
}

	article {
		width: 25%;
		height: 100%;
		float: left;
	}

		figure {
			width: 130%;
			height: 4%;
			margin: auto;
			margin-top: 380%;

		}

	.pink {
		background-color: #DC7697;
	}

	.pink:hover {
			background-color: #C86FB6;
		}

	.fusha{
		background-color: #C86FB6;
	}

		.fusha:hover {
			background-color: #5E4BAF;
		}

	.purple {
		background-color: #5E4BAF;
	}

		.purple:hover {
			background-color: #274CBC;
		}

	.blue {
		background-color: #274CBC;
	}

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

	.bar-one {
		background-color: #5E4BAF;
	}

	.bar-one:hover {
			background-color: #274CBC;
		}

	.bar-two {
		margin-top: 187%;
		background-color: #5E4BAF;
	}

	.bar-two:hover {
			background-color: #274CBC;
		}

	.bar-three {
		margin-top: 100%;
		background-color: #5E4BAF;
	}

	.bar-three:hover {
			background-color: #274CBC;
		}

	.bar-four {
		margin-top: 276%;
		background-color: #C86FB6;
	}

	.bar-four:hover {
			background-color: #DC7697;
		}

	.bar-five {
		margin-top: 92%;
		width: 100%;
		background-color: #C86FB6;
	}

	.bar-five:hover {
			background-color:#DC7697;
		}

	.bar-six {
		margin-top: 305%;
		width: 100%;
		background-color: #C86FB6;
	}

		.bar-six:hover {
			background-color: #DC7697;
		}