refactor(styles): introduce wrap container selector

1 files changed, 36 insertions, 1 deletions

diff --git a/src/styles/main.css b/src/styles/main.css
index 4e25486..2cdb7be 100644
--- a/src/styles/main.css
+++ b/src/styles/main.css
@@ -103,6 +103,8 @@ img {
 	max-width: 100%;
 }
 
+/* figure container */
+
 .figure-container {
 	display: flex;
 	flex-direction: row;
@@ -110,6 +112,14 @@ img {
 	margin: 4em 0 4em 0;
 }
 
+.figure-container:has(+ .figure-container) {
+	margin-bottom: 1em;
+}
+
+.figure-container + .figure-container {
+	margin-top: 1em;
+}
+
 .figure-container figure {
 	margin: 0;
 	width: 100%;
@@ -129,6 +139,31 @@ figcaption {
 	/* title */
 
 	header h1 a {
-		font-size: 13vw;
+		font-size: 12vw;
+	}
+
+	/* figure container */
+
+	.figure-container figure:not(:last-child) {
+		margin-right: .5em;
+	}
+
+	/* wrap container */
+
+	.wrap-container {
+		flex-wrap: wrap;
+	}
+
+	.wrap-container:has(+ .wrap-container) {
+		margin-bottom: 0em;
+	}
+
+	.wrap-container + .wrap-container {
+		margin-top: 0em;
+	}
+
+	.wrap-container figure,
+	.wrap-container figure:not(:last-child) {
+		margin: 1em 0 1em 0;
 	}
 }