* {
	background-color: #0e0e0e;
}

main {
	background: linear-gradient(to bottom, #af85c8 0%, #996cb5 100%);
	margin: auto;
	margin-top: 4.5vw;
	height: 43.5vw;
	width: 43.8vw;
}

section {
	float: left;
}

.red {
	background-color: #fb3448;
	height: 88.5%;
	width: 50%;
	margin-top: 11.5%;
	margin-left: 12%;
}

.green {
	background: linear-gradient(to bottom right, #33ae5e 20%, #29914b 120%);
	height: 38%;
	width: 38%;
	margin-top: 61.6%;
}

article {
	float: top;
}

.purpletop {
	background: linear-gradient(to bottom, #ad81c5 0%, #a77cc1 100%);
	height: 29.5%;
	width: 36.5%;
}

.purpleslim {
	background-color: #a77cc1;
	height: 14%;
	width: 11.6%;
	margin-left: 24.8%;
}

.purplebottom {
	background-color: #a77cc1;
	padding-top: 5%;
	height: 24.5%;
	width: 24.3%;
	margin-left: 12.2%;
}

.bluecenter {
	background: linear-gradient(to bottom right, #31a7bd 0%, #2aa3b8 40%);
	height: 32.5%;
	width: 33%;
	margin-left: 33%;
	margin-top: 33%;
	float: left;
}

.bluerectangle {
	background-color: #2ba2b8;
	height: 16%;
	width: 34%;
	margin-top: 33%;
	float: right;
}

figure {
	margin: auto;
}

.black {
	background-color: #161812;
	height: 56.5%;
	width: 100%;
	margin-top: 77%;
}