New contact list in footer

index.html

@@ -442,17 +442,24 @@
 		</section>
 
 		<footer>
-			<div class="grid wrap narrow">
+			<div class="wrap narrow">
+				<div class="contact-list">
+					<div>
+						<p><strong>Kontakt pro média</strong></p>
+						Ondřej Balada<br>
+						<a href="tel:+420777954775">+420 777 954 775</a><br>
+						<a href="mailto:ondrej.balada@pedf.cuni.cz">ondrej.balada@pedf.cuni.cz</a>
+					</div>
+					<div>
+						<p><strong>Kontakt pro obecné dotazy </strong></p>
+						<p><a href="mailto:domunevidis@pedf.cuni.cz">domunevidis@pedf.cuni.cz</a></p>
+						<p class="small">E-mail není určen pro odborné dotazy a žádosti o konzultaci konkrétních situací. V těchto případech se prosím obraťte na organizace uvedené výše.</p>
+					</div>
+				</div>
 				<div>
 					<p>&copy; 2023 Domů nevidíš</p>
 					<p>Projekt Pedagogické fakulty Univerzity Karlovy ve spolupráci s&nbsp;Barevný svět dětí, z.s.</p>
 				</div>
-				<div>
-					<p><strong>Kontakt pro média</strong></p>
-					Ondřej Balada<br>
-					<a href="tel:+420777954775">+420 777 954 775</a><br>
-					<a href="mailto:ondrej.balada@pedf.cuni.cz">ondrej.balada@pedf.cuni.cz</a>
-				</div>
 			</div>
 		</footer>
 

sass/_fonts.scss

@@ -14,3 +14,11 @@
 	font-weight: bold;
 	font-style: normal;
 }
+@font-face {
+	font-family: "moderat";
+	src: url('/static/fonts/moderat-black.woff2?#iefix') format('woff2'),
+	     url('/static/fonts/moderat-black.woff') format('woff'),
+	     url('/static/fonts/moderat-black.otf') format('opentype');
+	font-weight: 900;
+	font-style: normal;
+}

sass/style.scss

@@ -53,6 +53,7 @@ h1, h2, h3, h4, h5, h6 {
 }
 h1 {
 	font-size: 3rem;
+	font-weight: 900;
 	text-transform: uppercase;
 	margin-top: 2em;
 }
@@ -870,6 +871,9 @@ body.noscroll {
 
 footer {
 	$logo-radius: 4.5em;
+	display: flex;
+	flex-direction: column;
+	align-items: center;
 	position: relative;
 	text-align: center;
 	font-size: 1.138rem;
@@ -895,13 +899,6 @@ footer {
 		background-color: $col-bg;
 	}
 
-	.grid {
-		display: grid;
-		grid-template-columns: 1fr;
-		grid-row-gap: 2em;
-		grid-column-gap: 2em;
-	}
-
 	a {
 		color: inherit;
 		text-decoration: none;
@@ -910,6 +907,23 @@ footer {
 			color: lighten($col-accent, 25%);
 		}
 	}
+
+	.contact-list {
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		gap: 2em;
+		margin-bottom: 3em;
+
+		div {
+			width: 100%;
+			max-width: 15rem;
+		}
+
+		.small {
+			font-size: .75em;
+		}
+	}
 }
 
 @media only screen and (min-width: $size-mobile) {
@@ -1020,7 +1034,10 @@ footer {
 		background-position: 170% center;
 	}
 	
-	footer .grid {
+	footer .contact-list {
+		flex-direction: row;
+		align-items: flex-start;
+		justify-content: center;
 		grid-template-columns: 3fr 2fr;
 	}
 }