// Typos
* {
	transition: $transition;
}

h1 {
	font-size: $fz-1;
	font-family: 'Archivo Black', sans-serif;
	margin-top: 0;

	@media($max-mobile-viewport) {
		font-size: $fz-2;
	}
}

h2 {
	font-size: $fz-2;
	font-family: 'Viga', sans-serif;
	margin-top: 0;

	@media($max-mobile-viewport) {
		font-size: $fz-3;
	}
}

h3 {
	font-size: $fz-3;
	font-family: 'Viga', sans-serif;
	margin-top: 0;

	@media($max-mobile-viewport) {
		font-size: $fz-4;
	}
}

h4 {
	font-size: $fz-4;
	font-family: 'Viga', sans-serif;
	margin-top: 0;

	@media($max-mobile-viewport) {
		font-size: $fz-5;
	}
}

h5 {
	font-size: $fz-5;
	font-family: 'Viga', sans-serif;
	margin-top: 0;

	@media($max-mobile-viewport) {
		font-size: 1rem;
	}
}

li {
	line-height: 1.2;
}

// Layout
div#main-content-wrapper {
	max-width: none;

	@media ($max-mobile-viewport) {
		margin-top: calc(#{$header-height} + 1rem);
	}
}

.central-content {
	max-width: $width;
	clear: both;
	margin: 0 auto;
}

@media ($min-desktop-viewport) {
	.gru-content {
		padding: 3rem 0.5rem 0 0.5rem;
	}
}

// Notices
.errornotice, .warningnotice, .successnotice, .infonotice {
	border-radius: $border-radius;
	padding: 25px 60px;
	color: $gray-dark;

	a {
		color: $red;
	}

	&::before {
		top: 15px;
		left: 20px;
		right: auto;
		font-size: 30px;
	}
}

.errornotice, .warningnotice {
	&::before {
		color: $red;
	}
}

.infonotice::before {
	color: $yellow;
}

.successnotice::before {
	color: $green-dark;
}
