Fix post cover image size on desktop and make title more responsive

src/layouts/BlogPost.astro

@@ -48,13 +48,25 @@ const { title, pubDate, banner: cover, bannerAlt: coverAlt } = Astro.props;
 
 		.cover-box {
 			padding-top: 1em;
+			display: flex;
+			justify-content: center;
 		}
 
 		.cover-image {
 			border-radius: var(--image-radius);
-			margin-left: auto;
+		}
-			height: 100%;
+
-			width: 100%;
+		/* For mobile phones: */
+		@media only screen and (max-width: 768px) {
+			.cover-box {
+				display: block;
+				padding-top: 1em;
+			}
+
+			.cover-image {
+				height: 100%;
+				width: 100%;
+			}
 		}
 	</style>
 	<style is:global>

src/styles/global.css

@@ -83,4 +83,8 @@ li img {
 	main {
 		min-width: 100%;
 	}
+
+	#title {
+		font-size: 5.9vw;
+	}
 }