Message template

<div class="grid message-example">
	<div class="cs1 ce12 centered">
	<div class="message-graphic">
		<span class="icon icon-warning">
	</div>
	<p class="p-large">An error has occurred, please try again later</p>
	<div class="cs1 ce12 centered">
		<a href="#" class="link">Back to home</a>
	</div>
	</div>
</div>

.message-example {
	grid-auto-rows: 1fr auto;
	text-align: center;
	height: 100%
}
.message-graphic {
	display: flex;
	place-content: center;
	margin: var(--space-xlarge) 0;
}
.icon {
	width: 100px;
	height: 100px;
	background-size: cover;
}