.topic-cards {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.topic-cards-top-left {
	flex-basis: calc(100% - 330px);
}

.topic-cards-top-right {
	flex-basis: 300px;
}

.topic-cards .featured-article {
	width: 100%;
	height: 860px;
}

.topic-cards .featured-article-image {
	height: 100%;
}

.topic-cards-bottom {
	display: flex;
    flex-wrap: wrap;
    width: 100%;
}



.section {
	max-width: 1700px;
    margin: auto;
}

@media only screen and (max-width: 600px) {
	.topic-cards-top-left {
		flex-basis: unset;
	}
	
	.topic-cards-top-right {
		flex-basis: unset;
	}
	
	.topic-cards .featured-article {
		width: unset;
		height: unset;
	}
	
	.topic-cards .featured-article-image {
		height: 80vw;
	}
}

@media only screen and (min-width: 601px) and (max-width: 749px) {
	
}

@media only screen and (min-width: 750px) and (max-width: 999px) {
	.topic-cards-bottom .card {
		flex-basis: 47.5%;
		margin-right: 5%;
	}
	.topic-cards-bottom .card:nth-child(2n) {
		margin-right: 0;
	}
}

@media only screen and (min-width: 1000px) and (max-width: 1299px) {
	.topic-cards-bottom .card {
		flex-basis: 30%;
		margin-right: 5%;
	}
	.topic-cards-bottom .card:nth-child(3n) {
		margin-right: 0;
	}
}

@media only screen and (min-width: 1300px) {
	.topic-cards-bottom .card {
		flex-basis: 22%;
		margin-right: 4%;
	}
	.topic-cards-bottom .card:nth-child(4n) {
		margin-right: 0;
	}
}

@media only screen and (min-width: 1700px) {
	.section {
		padding-left: 170px;
		padding-right: 170px;
	}
}