update cvs and css

styles/elements/cv.css

@@ -1,37 +1,38 @@
-.cv {
-  width: auto;
-  max-width: 900px;
+#cv {
+  header {
+    height: 300px;
+  }
 }
 
 .cv {
   display: flex;
   flex-direction: column;
   text-align: left;
-}
+  width: auto;
+  max-width: 900px;
 
-.cv .cv_download {
-  display: inline-block;
-  width: 100%;
-  margin-top: 30px;
-  text-align: center;
-}
+  > *:last-child {
+    margin-bottom: 100px;
+  }
 
-.cv > *:last-child {
-  margin-bottom: 100px;
-}
+  .cv_download {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 10px;
+    margin-top: 30px;
+  }
 
-.cv .banner {
-  margin: 0px 0px 50px;
-  /*
-	margin: 50px 50px;
-	width: calc(100% - 100px);
-	*/
-}
-.cv h2 {
-  margin-top: 100px;
-}
-.cv ul {
-  border: 1px dashed black;
-  padding: 20px;
-  padding-left: 40px;
+  .banner {
+    margin: 0px 0px 50px;
+  }
+
+  h2 {
+    margin-top: 100px;
+  }
+
+  ul {
+    border: 1px dashed black;
+    padding: 20px;
+    padding-left: 40px;
+  }
 }

styles/elements/language.css

@@ -1,52 +1,59 @@
 input#language {
-	display: none;
+  display: none;
 }
 label#language_label {
-	position: fixed;
-	position: absolute;
-	top: 20px;
-	right: 20px;
-	padding: 10px;
-	cursor: pointer;
-	z-index: 1;
-}
-label#language_label .flag {
-	width: 20px;
-}
-
+  position: fixed;
+  top: 20px;
+  right: 20px;
+  padding: 10px;
+  cursor: pointer;
+  z-index: 1;
 
+  .flag {
+    width: 20px;
+  }
+}
 
 /*
-* FR
+* SWITCH FLAG
 */
-input#language:not(:checked) + label #fr {
-	display: inline;
-}
-input#language:checked + label #fr {
-	display: none;
-}
-input#language:not(:checked) ~ * span.fr {
-	display: none;
-}
-input#language:checked ~ * span.fr {
-	display: inline;
-}
+#language {
+  &:not(:checked) + #language_label {
+    #fr {
+      display: inline;
+    }
 
+    #en {
+      display: none;
+    }
+  }
 
+  &:checked + #language_label {
+    #fr {
+      display: none;
+    }
+
+    #en {
+      display: inline;
+    }
+  }
+}
 
 /*
-* EN
+* SWITCH LANGUAGE
 */
-input#language:not(:checked) + label #en {
-	display: none;
-}
-input#language:checked + label #en {
-	display: inline;
-}
-input#language:not(:checked) ~ * span.en {
-	display: inline;
-}
-input#language:checked ~ * span.en {
-	display: none;
-}
 
+#language {
+  ~ * .fr,
+  ~ * .en {
+    display: none;
+  }
+
+  &:not(:checked) ~ * .en {
+    display: inline;
+  }
+
+  &:checked ~ * .fr {
+    display: inline;
+  }
+}