.topic {
	margin: 4rem auto;
	display: grid;
}

.topic:nth-child(odd) {
	grid-template:
		'img h'
		'img desc'
		'img .';
	grid-template-columns: 45% auto;
}

.topic:nth-child(even) {
	grid-template:
		'h img'
		'desc img'
		'. img';
	grid-template-columns: auto 45%;
}

@media (max-width: 950px) {
	.topic:nth-child(odd),
	.topic:nth-child(even) {
		grid-template:
			'img'
			'h'
			'desc';
	}
}

.topic img {
	grid-area: img;
	border-radius: 1rem;
}

@media (max-width: 950px) {
	.topic img {
		border-radius: 1rem 1rem 0 0;
		border-bottom: .25rem solid var(--color-accent);
	}
}

.topic h1,
.topic h2 {
	margin: 0;
	grid-area: h;
	border-bottom: .25rem solid var(--color-accent);
	padding: .25rem;
}

.topic:nth-child(odd) h2 {
	padding-left: .75rem;
}

.topic:nth-child(even) h2 {
	text-align: right;
	padding-right: .75rem;
}

@media (max-width: 950px) {
	.topic:nth-child(odd) h2,
	.topic:nth-child(even) h2 {
		padding: .25rem 0;
	}
}

.topic .desc {
	grid-area: desc;
	background-color: var(--color-bg-alt);
	border-radius: 0 0 1rem 1rem;
}

.topic:nth-child(odd) .desc {
	margin-left: 1.5rem;
}

.topic:nth-child(even) .desc {
	margin-right: 1.5rem;
}

@media (max-width: 950px) {
	.topic:nth-child(odd) .desc,
	.topic:nth-child(even) .desc {
		margin: 0;
	}
}

.contact ul {
	background-color: var(--color-bg-alt);
	border-radius: 0 0 1rem 1rem;
}

.contact {
	margin-top: 4rem;
	text-align: center;
}

.contact li {
	list-style: none;
}