en cours de mise en page de la page litterall

styles/style.css

@@ -1,3 +1,6 @@
+
+/*/////////////////////////////////////////////*/
+/*IMPORT CSS*/
 @import url(./reset.css);
 @import url(./fonts.css);
 @import url(./header.css);
@@ -9,33 +12,41 @@
 /*/////////////////////////////////////////////*/
 /*GLOBAL VARIABLE*/
 :root {
+	/* color range */
+	--color-purple:			#ee1998;
+	--color-pink:			#ff7bca;
+	--color-green:			#8fce3c;
+	--color-yellow:			#e3e00a;
+	--color-blue:			#51cee4;
+	--color-water:			#0c9cb5;
+
 	/* colors texts */
-	--color-texts:		rgb(1, 1, 1);
+	--color-texts:			rgb(1, 1, 1);
+	--color-texts-special:	rgb(1, 1, 1);
 
 	/* colors links */
-	--color-links:		rgb(120, 1, 1);
+	--color-links:			rgb(120, 1, 1);
+	--color-links-hover:	rgb(120, 1, 1);
+	--color-links-visited:	rgb(120, 1, 1);
+	--color-links-active:	rgb(120, 1, 1);
+
+	/* colors titles */
+	--color-title-1:		rgb(120, 1, 1);
+	--color-title-2:		rgb(120, 1, 1);
+	--color-title-3:		rgb(120, 1, 1);
+	--color-title-4:		rgb(120, 1, 1);
+	--color-title-5:		rgb(120, 1, 1);
+	--color-title-6:		rgb(120, 1, 1);
 
 	/* colors buttons */
-	--primary-hue:		12;
-	--color-button:		hsl(var(primary-hue), 1%, 1%);
-
-	/* color range */
-	--color-purple:		#ee1998;
-	--color-pink:		#ff7bca;
-	--color-green:		#8fce3c;
-	--color-yellow:		#e3e00a;
-	--color-blue:		#51cee4;
-	--color-water:		#0c9cb5;
+	--primary-hue:			12;
+	--color-button:			hsl(var(primary-hue), 1%, 1%);
 
 	/* fonts */
-	--font-titles:		'paradroid';
-	--font-texts:		'louisgeorge';
-	--font-fallback:	'cabrion';
+	--font-titles:			'paradroid';
+	--font-texts:			'louisgeorge';
+	--font-fallback:		'cabrion';
 }
-/*GLOBAL VARIABLE*/
-/*/////////////////////////////////////////////*/
-
-
 
 
 
@@ -45,13 +56,19 @@
 html {
 	scroll-behavior: smooth;
 }
-main {
-	min-height: calc(100vh - 70px);
-}
 body {
 	display: flex;
 	flex-direction: column;
 }
+main {
+	min-height: calc(100vh - 70px);
+}
+
+
+
+
+/*/////////////////////////////////////////////*/
+/*TEXTS*/
 h1, h2, h3, h4, h5, h6 {
 	font-family: var(--font-titles), var(--font-fallback), sans-serif;
 }
@@ -61,9 +78,18 @@ a, p, li {
 a, a > * {
 	cursor: pointer;
 }
-a, a:visited, a:hover, a:link {
+a, a:link {
 	color: var(--color-links);
 }
+a:visited {
+	color: var(--color-links-visited);
+}
+a:hover {
+	color: var(--color-links-hover);
+}
+a:active {
+	color: var(--color-links-active);
+}
 li *, li p, article b, article em,
 article i, article a, article var {
 	display: inline;
@@ -82,10 +108,6 @@ em {
 	font-weight: 600;
 	color: var(--article-em);
 }
-/*GENERAL SETTINGS*/
-/*/////////////////////////////////////////////*/
-
-