les espaces sont a peu pres bien structures

styles/global.css

@@ -8,8 +8,8 @@
 
 
 /*DEBUG*/
-/*borders on mains elements of pages for debugging*/
+/* borders on mains elements of pages for debugging*/
-body > *, body > .horizontal > * {
+body > *, body > .container_main > * {
 	border: 1px solid red;
 }
 
@@ -44,57 +44,95 @@ body > *, body > .horizontal > * {
 	path to pages	->	.page_path
 	container		->	.container_main
 		summary		->	aside.page_content
-		content		->	main
+		main		->	main
 		asides		->	aside.relative_content
 	footer			->
 */
+
+/*ALL*/
+/* by default all elements are verticals*/
+body, body * {
+	display: flex;
+	flex-direction: column;
+}
+body > *:not(.container_main), aside, main {
+	padding: calc(var(--gap-unit) / 2);
+}
+
+/*HTML*/
 html {
 	scroll-behavior: smooth;
 	/*default font-size for rem*/
 	font-size: var(--base-font-size);
 }
-/*the page is design for a maximum screen*/
+
+/*BODY*/
+/* the page is designed for a maximum screen*/
 body {
 	max-width: var(--max-screen);
+	margin: auto;
 }
-/*by default all elements are verticals*/
+
-body, body * {
+/*NAVBAR*/
-	display: flex;
-	flex-direction: column;
-}
-body > *, body aside, body main {
-	padding: 0px var(--gap-unit);
-}
 body nav {
+	flex-direction: row;
+	height: 30px;
 }
+body nav > * {
+	margin: auto;
+	padding: 0px 10px;
+}
+
+/*TITLE*/
+body .page_title {
+}
+
+/*PATH-TO-PAGES*/
+body .page_path {
+}
+
+/*CONTAINER*/
+body .container_main {
+	flex-direction: row;
+}
+
+/*MAIN*/
 body main {
 }
+body main > * {
+	margin: var(--gap-unit) 0px;
+}
 
 /*ASIDES*/
 body aside {
 }
-/*asides elements only have width if they have a child*/
+/* asides elements only have width if they have a child*/
 body aside *:first-child {
 	width: 200px;
 }
-/*aside left is for page table of content */
+/* aside left is for page table of content */
 body aside.page_content {
 }
-/*aside right is for links to relatives content*/
+/* aside right is for links to relatives content*/
 body aside.relative_content {
 }
 
+/*FOOTER*/
+body footer {
+}
+
+
 /*---------------------------------------------*/
 /*DESIGN KEYWORDS*/
-/*contains elements oriented vertically (default) or horizontally*/
+/* contains elements oriented vertically (default) or horizontally*/
 .vertical {
 	flex-direction: column;
 }
-/*horizontal is only in web version, it becomes vertical in mobile design*/
+/* horizontal is only in web version, it becomes vertical in mobile design*/
 .horizontal {
 	flex-direction: row;
 }
-/*self position of elements to the left, the right, or the center of their container*/
+/* self position of elements to the left, the right, or the center of their container*/
 .right {
 	margin-right: 0px;
 	margin-left: auto;