css is now in old form

styles/elements/cv.css

@@ -6,30 +6,32 @@
 .cv {
 	display: flex;
 	text-align: left;
-	summary {
+}
-		position: relative;
+.cv summary {
-		list-style-position: outside;
+	position: relative;
-		list-style-type: "▸ ";
+	list-style-position: outside;
-		font-size: 1.8rem;
+	list-style-type: "▸ ";
-		margin: auto;
+	font-size: 1.8rem;
-		width: fit-content;
+	margin: auto;
-		.open {
+	width: fit-content;
-			display: none;
+}
-		}
+.cv summary .open {
-		.close {
+	display: none;
-			display: inline;
+}
-		}
+.cv summary .close {
-	}
+	display: inline;
-	&[open] summary {
+}
-		list-style-type: "▾ ";
+
-		.open {
+.cv[open] summary {
-			display: inline;
+	list-style-type: "▾ ";
-		}
+}
-		.close {
+.cv[open] summary .open {
-			display: none;
+	display: inline;
-		}
+}
-	}
+.cv[open] summary .close {
-	> *:last-child {
+	display: none;
-		margin-bottom: 100px;
+}
-	}
+
+.cv > *:last-child {
+	margin-bottom: 100px;
 }

styles/elements/hero.css

@@ -9,13 +9,13 @@
 	grid-template-rows: 1fr auto 1fr;
 	*/
 	grid-template-rows: auto auto 1fr;
-	.subtitle {
+}
-		text-align: center;
+#hero .subtitle {
-	}
+	text-align: center;
-	.cv {
+}
-		#cv_download {
+#hero .cv {
-			margin-top: 20px;
+}
-			text-align: center;
+#hero .cv #cv_download {
-		}
+	margin-top: 20px;
-	}
+	text-align: center;
 }

styles/elements/infos.css

@@ -1,4 +1,3 @@
-
 #infos article {
 	display: flex;
 	flex-direction: column;

styles/elements/mouses.css

@@ -7,21 +7,20 @@
 	margin: auto;
 	width: fit-content;
 	overflow: hidden;
-
+}
-	.frames {
+.mouse .frames {
-		position: relative;
+	position: relative;
-		animation: mouse_move infinite 2s normal steps(4);
+	animation: mouse_move infinite 2s normal steps(4);
-		&::before {
+}
-			position: relative;
+.mouse .frames::before {
-			top: 0px;
+	position: relative;
-			left: 0px;
+	top: 0px;
-		}
+	left: 0px;
-		&::after {
+}
-			position: absolute;
+.mouse .frames::after {
-			top: 100%;
+	position: absolute;
-			left: 0px;
+	top: 100%;
-		}
+	left: 0px;
-	}
 }
 
 /*

styles/elements/projects.css

@@ -2,20 +2,21 @@
 	header {
 		height: 300px;
 	}
-	.projects_grid {
+}
-		display: grid;
+#projects .projects_grid {
-		grid-template-columns: repeat(auto-fit, minmax(200px, auto));
+	display: grid;
-		grid-template-columns: repeat(2, minmax(100px, auto));
+	grid-template-columns: repeat(auto-fit, minmax(200px, auto));
-		grid-template-columns: repeat(2, minmax(100px, 500px));
+	grid-template-columns: repeat(2, minmax(100px, auto));
-		grid-gap: 20px;
+	grid-template-columns: repeat(2, minmax(100px, 500px));
-		figure {
+	grid-gap: 20px;
-			figcaption {
+}
-				text-align: left;
+#projects .projects_grid figure {
-				margin-bottom: 100px;
+}
-			}
+#projects .projects_grid figure figcaption {
-		}
+	text-align: left;
-	}
+	margin-bottom: 100px;
-	.mouse {
+}
-		margin-top: 100px;
+
-	}
+#projects .mouse {
+	margin-top: 100px;
 }

styles/sections.css

@@ -9,31 +9,30 @@ section {
 	min-height: 100vh;
 	justify-items: center;
 	text-align: center;
-
+}
-	header {
+section header {
-		display: flex;
+	display: flex;
-		flex-direction: column;
+	flex-direction: column;
-		place-content: center;
+	place-content: center;
-
+}
-		h1 {
+section header h1 {
-			display: flex;
+	display: flex;
-			flex-direction: row;
+	flex-direction: row;
-			flex-wrap: wrap;
+	flex-wrap: wrap;
-			justify-content: center;
+	justify-content: center;
-		}
+}
-	}
+
-	article {
+section article {
-		text-align: left;
+	text-align: left;
-	}
+}
-
+
-	> * {
+section > * {
-		grid-column: 2 / span 1;
+	grid-column: 2 / span 1;
-	}
+}
-	> .grid_full_width {
+section > .grid_full_width {
-		grid-column: 1 / span 3;
+	grid-column: 1 / span 3;
-	}
+}
-
+
-	.banner {
+section .banner {
-		overflow-x: hidden;
+	overflow-x: hidden;
-	}
 }