diff --git a/logs/popularity/daily.json b/logs/popularity/daily.json
index 644d57b..3576268 100644
--- a/logs/popularity/daily.json
+++ b/logs/popularity/daily.json
@@ -1 +1 @@
-{"23-05-2018":157,"24-05-2018":194,"25-05-2018":212,"28-05-2018":36}
\ No newline at end of file
+{"23-05-2018":157,"24-05-2018":194,"25-05-2018":212,"28-05-2018":37}
\ No newline at end of file
diff --git a/logs/popularity/monthly.json b/logs/popularity/monthly.json
index 3afb5bc..2c010c8 100644
--- a/logs/popularity/monthly.json
+++ b/logs/popularity/monthly.json
@@ -1 +1 @@
-{"05-2018":599}
\ No newline at end of file
+{"05-2018":600}
\ No newline at end of file
diff --git a/logs/popularity/totals.json b/logs/popularity/totals.json
index 24425a1..f9ca483 100644
--- a/logs/popularity/totals.json
+++ b/logs/popularity/totals.json
@@ -1 +1 @@
-{"\/":589,"\/typography":1,"\/home\/prochaines-dates":2,"\/home\/biographie":2,"\/home\/videos":3,"\/home\/photographies":1,"\/photographies":1}
\ No newline at end of file
+{"\/":590,"\/typography":1,"\/home\/prochaines-dates":2,"\/home\/biographie":2,"\/home\/videos":3,"\/home\/photographies":1,"\/photographies":1}
\ No newline at end of file
diff --git a/logs/popularity/visitors.json b/logs/popularity/visitors.json
index b1b818c..1db4c8c 100644
--- a/logs/popularity/visitors.json
+++ b/logs/popularity/visitors.json
@@ -1 +1 @@
-{"4b84b15bff6ee5796152495a230e45e3d7e947d9":1527505211}
\ No newline at end of file
+{"4b84b15bff6ee5796152495a230e45e3d7e947d9":1527507699}
\ No newline at end of file
diff --git a/user/themes/anissabensalah/css-compiled/theme.css b/user/themes/anissabensalah/css-compiled/theme.css
index 3629d33..b6f0c6d 100644
--- a/user/themes/anissabensalah/css-compiled/theme.css
+++ b/user/themes/anissabensalah/css-compiled/theme.css
@@ -1,2 +1,11 @@
+* { box-sizing: border-box; }
 
-/*# sourceMappingURL=data:application/json;charset=utf8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidGhlbWUuY3NzIiwic291cmNlcyI6WyJ0aGVtZS5zY3NzIl0sInNvdXJjZXNDb250ZW50IjpbIi8vIENvcmUgdmFyaWFibGVzIGFuZCBtaXhpbnNcbi8vIEBpbXBvcnQgJ3NwZWN0cmUvdmFyaWFibGVzJztcbi8vIEBpbXBvcnQgJ3NwZWN0cmUvbWl4aW5zJztcbi8vIFxuLy8gQGltcG9ydCAndGhlbWUvdmFyaWFibGVzJztcbi8vIEBpbXBvcnQgJ3RoZW1lL21peGlucyc7XG4vLyBAaW1wb3J0ICd0aGVtZS9mcmFtZXdvcmsnO1xuLy8gQGltcG9ydCAndGhlbWUvdHlwb2dyYXBoeSc7XG4vLyBAaW1wb3J0ICd0aGVtZS9mb3Jtcyc7XG4vLyBAaW1wb3J0ICd0aGVtZS9tb2JpbGUnO1xuLy8gQGltcG9ydCAndGhlbWUvYW5pbWF0aW9uJztcbi8vXG4vLyBAaW1wb3J0ICd0aGVtZS9oZWFkZXInO1xuLy8gQGltcG9ydCAndGhlbWUvZm9vdGVyJztcbi8vIEBpbXBvcnQgJ3RoZW1lL21lbnUnO1xuLy9cbi8vIC8vIEV4dHJhIFNrZWxldG9uIFN0eWxpbmdcbi8vIEBpbXBvcnQgJ3RoZW1lL2Jsb2cnO1xuLy8gQGltcG9ydCAndGhlbWUvb25lcGFnZSc7XG4iXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IiJ9 */
+html, body { margin: 0; padding: 0; height: 100%; }
+
+ul, li, ol { margin: 0; padding: 0; list-style: none; }
+
+a { text-decoration: none; color: black; }
+
+p, ul, li, ol, h1, h2, h3, em, blockquote { margin: 0; }
+
+/*# sourceMappingURL=data:application/json;charset=utf8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidGhlbWUuY3NzIiwic291cmNlcyI6WyJ0aGVtZS5zY3NzIiwidGhlbWUvcmVzZXQuc2NzcyIsInRoZW1lL2hlYWRlci5zY3NzIiwidGhlbWUvbmF2LnNjc3MiLCJ0aGVtZS9zZWN0aW9uLnNjc3MiLCJ0aGVtZS9mb290ZXIuc2NzcyJdLCJzb3VyY2VzQ29udGVudCI6WyIvLyBDb3JlIHZhcmlhYmxlcyBhbmQgbWl4aW5zXG4vLyBAaW1wb3J0ICdzcGVjdHJlL3ZhcmlhYmxlcyc7XG4vLyBAaW1wb3J0ICdzcGVjdHJlL21peGlucyc7XG4vL1xuLy8gQGltcG9ydCAndGhlbWUvdmFyaWFibGVzJztcbi8vIEBpbXBvcnQgJ3RoZW1lL21peGlucyc7XG4vLyBAaW1wb3J0ICd0aGVtZS9mcmFtZXdvcmsnO1xuLy8gQGltcG9ydCAndGhlbWUvdHlwb2dyYXBoeSc7XG4vLyBAaW1wb3J0ICd0aGVtZS9mb3Jtcyc7XG4vLyBAaW1wb3J0ICd0aGVtZS9tb2JpbGUnO1xuLy8gQGltcG9ydCAndGhlbWUvYW5pbWF0aW9uJztcbi8vXG5cbkBpbXBvcnQgJ3RoZW1lL3Jlc2V0JztcbkBpbXBvcnQgJ3RoZW1lL2hlYWRlcic7XG5AaW1wb3J0ICd0aGVtZS9uYXYnO1xuQGltcG9ydCAndGhlbWUvc2VjdGlvbic7XG5AaW1wb3J0ICd0aGVtZS9mb290ZXInO1xuXG4vLyBAaW1wb3J0ICd0aGVtZS9mb290ZXInO1xuLy8gQGltcG9ydCAndGhlbWUvbWVudSc7XG4vL1xuLy8gLy8gRXh0cmEgU2tlbGV0b24gU3R5bGluZ1xuLy8gQGltcG9ydCAndGhlbWUvYmxvZyc7XG4vLyBAaW1wb3J0ICd0aGVtZS9vbmVwYWdlJztcbiIsIip7XG4gIC13ZWJraXQtYm94LXNpemluZzogYm9yZGVyLWJveDtcbiAgLW1vei1ib3gtc2l6aW5nOiBib3JkZXItYm94O1xuICBib3gtc2l6aW5nOiBib3JkZXItYm94O1xufVxuXG5odG1sLCBib2R5e1xuICBtYXJnaW46IDA7XG4gIHBhZGRpbmc6IDA7XG4gIGhlaWdodDogMTAwJTtcbn1cblxudWwsIGxpLCBvbHtcbiAgbWFyZ2luOiAwO1xuICBwYWRkaW5nOiAwO1xuICBsaXN0LXN0eWxlOiBub25lO1xufVxuXG5he1xuICB0ZXh0LWRlY29yYXRpb246IG5vbmU7XG4gIGNvbG9yOiBibGFjaztcbn1cblxucCwgdWwsIGxpLCBvbCwgaDEsIGgyLCBoMywgZW0sIGJsb2NrcXVvdGV7XG4gIG1hcmdpbjogMDtcbn1cbiIsIiIsIiIsIiIsIiJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUNBQSxBQUFBLENBQUMsQ0FBQSxFQUNDLGtCQUFrQixFQUFFLFVBQVUsRUFDOUIsZUFBZSxFQUFFLFVBQVUsRUFDM0IsVUFBVSxFQUFFLFVBQVUsR0FDdkI7O0FBRUQsQUFBQSxJQUFJLEVBQUUsSUFBSSxDQUFBLEVBQ1IsTUFBTSxFQUFFLENBQUMsRUFDVCxPQUFPLEVBQUUsQ0FBQyxFQUNWLE1BQU0sRUFBRSxJQUFJLEdBQ2I7O0FBRUQsQUFBQSxFQUFFLEVBQUUsRUFBRSxFQUFFLEVBQUUsQ0FBQSxFQUNSLE1BQU0sRUFBRSxDQUFDLEVBQ1QsT0FBTyxFQUFFLENBQUMsRUFDVixVQUFVLEVBQUUsSUFBSSxHQUNqQjs7QUFFRCxBQUFBLENBQUMsQ0FBQSxFQUNDLGVBQWUsRUFBRSxJQUFJLEVBQ3JCLEtBQUssRUFBRSxLQUFLLEdBQ2I7O0FBRUQsQUFBQSxDQUFDLEVBQUUsRUFBRSxFQUFFLEVBQUUsRUFBRSxFQUFFLEVBQUUsRUFBRSxFQUFFLEVBQUUsRUFBRSxFQUFFLEVBQUUsRUFBRSxFQUFFLFVBQVUsQ0FBQSxFQUN2QyxNQUFNLEVBQUUsQ0FBQyxHQUNWIn0= */
diff --git a/user/themes/anissabensalah/css-compiled/theme.min.css b/user/themes/anissabensalah/css-compiled/theme.min.css
index e69de29..daf71ae 100644
--- a/user/themes/anissabensalah/css-compiled/theme.min.css
+++ b/user/themes/anissabensalah/css-compiled/theme.min.css
@@ -0,0 +1 @@
+*{box-sizing:border-box}body,html{height:100%;margin:0;padding:0}li,ol,ul{margin:0;padding:0;list-style:none}a{text-decoration:none;color:#000}blockquote,em,h1,h2,h3,li,ol,p,ul{margin:0}
\ No newline at end of file
diff --git a/user/themes/anissabensalah/scss/spectre/mixins/_avatar.scss b/user/themes/anissabensalah/scss/spectre/mixins/_avatar.scss
deleted file mode 100644
index 14617ad..0000000
--- a/user/themes/anissabensalah/scss/spectre/mixins/_avatar.scss
+++ /dev/null
@@ -1,6 +0,0 @@
-// Avatar mixin
-@mixin avatar-base($size: $unit-8) {
-  font-size: $size / 2;
-  height: $size;
-  width: $size;
-}
diff --git a/user/themes/anissabensalah/scss/spectre/mixins/_clearfix.scss b/user/themes/anissabensalah/scss/spectre/mixins/_clearfix.scss
deleted file mode 100644
index db6895f..0000000
--- a/user/themes/anissabensalah/scss/spectre/mixins/_clearfix.scss
+++ /dev/null
@@ -1,8 +0,0 @@
-// Clearfix mixin
-@mixin clearfix() {
-  &::after {
-    clear: both;
-    content: "";
-    display: table;
-  }
-}
diff --git a/user/themes/anissabensalah/scss/spectre/mixins/_position.scss b/user/themes/anissabensalah/scss/spectre/mixins/_position.scss
deleted file mode 100644
index 0943469..0000000
--- a/user/themes/anissabensalah/scss/spectre/mixins/_position.scss
+++ /dev/null
@@ -1,65 +0,0 @@
-// Margin utility mixin
-@mixin margin-variant($id: 1, $size: $unit-1) {
-  .m-#{$id} {
-    margin: $size;
-  }
-
-  .mb-#{$id} {
-    margin-bottom: $size;
-  }
-
-  .ml-#{$id} {
-    margin-left: $size;
-  }
-
-  .mr-#{$id} {
-    margin-right: $size;
-  }
-
-  .mt-#{$id} {
-    margin-top: $size;
-  }
-
-  .mx-#{$id} {
-    margin-left: $size;
-    margin-right: $size;
-  }
-
-  .my-#{$id} {
-    margin-bottom: $size;
-    margin-top: $size;
-  }
-}
-
-// Padding utility mixin
-@mixin padding-variant($id: 1, $size: $unit-1) {
-  .p-#{$id} {
-    padding: $size;
-  }
-
-  .pb-#{$id} {
-    padding-bottom: $size;
-  }
-
-  .pl-#{$id} {
-    padding-left: $size;
-  }
-
-  .pr-#{$id} {
-    padding-right: $size;
-  }
-
-  .pt-#{$id} {
-    padding-top: $size;
-  }
-
-  .px-#{$id} {
-    padding-left: $size;
-    padding-right: $size;
-  }
-  
-  .py-#{$id} {
-    padding-bottom: $size;
-    padding-top: $size;
-  }
-}
diff --git a/user/themes/anissabensalah/scss/spectre/mixins/_shadow.scss b/user/themes/anissabensalah/scss/spectre/mixins/_shadow.scss
deleted file mode 100644
index 7984449..0000000
--- a/user/themes/anissabensalah/scss/spectre/mixins/_shadow.scss
+++ /dev/null
@@ -1,9 +0,0 @@
-// Component focus shadow
-@mixin control-shadow($color: $primary-color) {
-  box-shadow: 0 0 0 .1rem rgba($color, .2);
-}
-
-// Shadow mixin
-@mixin shadow-variant($offset) {
-  box-shadow: 0 $offset ($offset + .05rem) * 2 rgba($dark-color, .3);
-}
diff --git a/user/themes/anissabensalah/scss/spectre/mixins/_toast.scss b/user/themes/anissabensalah/scss/spectre/mixins/_toast.scss
deleted file mode 100644
index a7d3bbf..0000000
--- a/user/themes/anissabensalah/scss/spectre/mixins/_toast.scss
+++ /dev/null
@@ -1,5 +0,0 @@
-// Toast variant mixin
-@mixin toast-variant($color: $dark-color) {
-  background: rgba($color, .9);
-  border-color: $color;
-}
diff --git a/user/themes/anissabensalah/scss/spectre/mixins/_typographie.scss b/user/themes/anissabensalah/scss/spectre/mixins/_typographie.scss
new file mode 100644
index 0000000..0f5362f
--- /dev/null
+++ b/user/themes/anissabensalah/scss/spectre/mixins/_typographie.scss
@@ -0,0 +1,129 @@
+// Font Family
+$font-family-default:  			"Raleway", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif;
+$font-family-header:  			"Montserrat", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif;
+$font-family-mono: 				"Inconsolata", monospace;
+$font-family-serif:				"Georgia", "Times", "Times New Roman", serif;
+$icons: 						"FontAwesome";
+
+// @font-face
+$style-name-regular: "amiri-regular";
+$file-regular: "amiri-regular-webfont";
+$family: "amiri";
+
+$category: serif;
+
+@mixin font-face-regular($style-name-regular, $file-regular, $family, $category:"") {
+    $filepath: "../fonts/" + $family + "/" + $file-regular;
+    @font-face {
+        font-family: "#{$style-name-regular}";
+        src: url($filepath + ".eot");
+        src: url($filepath + ".eot?#iefix") format('embedded-opentype'),
+              url($filepath + ".woff") format('woff'),
+              url($filepath + ".ttf")  format('truetype'),
+              url($filepath + ".svg#" + $style-name-regular + "") format('svg');
+    }
+
+    %#{$style-name-regular} {
+        font: {
+            @if $category != "" {
+                family: "#{$style-name-regular}", #{$category};
+            }
+            @else {
+                family: "#{$style-name-regular}";
+                weight: normal;
+            }
+        }
+    }
+}
+
+$style-name-slanted: "amiri-slanted";
+$file-slanted: "amiri-slanted-webfont";
+
+@mixin font-face-slanted($style-name-slanted, $file-slanted, $family, $category:"") {
+    $filepath: "../fonts/" + $family + "/" + $file-slanted;
+    @font-face {
+        font-family: "#{$style-name-slanted}";
+        src: url($filepath + ".eot");
+        src: url($filepath + ".eot?#iefix") format('embedded-opentype'),
+              url($filepath + ".woff") format('woff'),
+              url($filepath + ".ttf")  format('truetype'),
+              url($filepath + ".svg#" + $style-name-slanted + "") format('svg');
+    }
+
+    %#{$style-name-slanted} {
+        font: {
+            @if $category != "" {
+                family: "#{$style-name-slanted}", #{$category};
+            }
+            @else {
+                family: "#{$style-name-slanted}";
+                weight: normal;
+            }
+        }
+    }
+}
+
+$style-name-bold: "amiri-bold";
+$file-bold: "amiri-bold-webfont";
+
+@mixin font-face-bold($style-name-bold, $file-bold, $family, $category:"") {
+    $filepath: "../fonts/" + $family + "/" + $file-bold;
+    @font-face {
+        font-family: "#{$style-name-bold}";
+        src: url($filepath + ".eot");
+        src: url($filepath + ".eot?#iefix") format('embedded-opentype'),
+              url($filepath + ".woff") format('woff'),
+              url($filepath + ".ttf")  format('truetype'),
+              url($filepath + ".svg#" + $style-name-bold + "") format('svg');
+    }
+
+    %#{$style-name-bold} {
+        font: {
+            @if $category != "" {
+                family: "#{$style-name-bold}", #{$category};
+            }
+            @else {
+                family: "#{$style-name-bold}";
+                weight: normal;
+            }
+        }
+    }
+}
+
+$style-name-boldslanted: "amiri-boldslanted";
+$file-boldslanted: "amiri-boldslanted-webfont";
+
+@mixin font-face-boldslanted($style-name-boldslanted, $file-boldslanted, $family, $category:"") {
+    $filepath: "../fonts/" + $family + "/" + $file-boldslanted;
+    @font-face {
+        font-family: "#{$style-name-boldslanted}";
+        src: url($filepath + ".eot");
+        src: url($filepath + ".eot?#iefix") format('embedded-opentype'),
+              url($filepath + ".woff") format('woff'),
+              url($filepath + ".ttf")  format('truetype'),
+              url($filepath + ".svg#" + $style-name-boldslanted + "") format('svg');
+    }
+
+    %#{$style-name-boldslanted} {
+        font: {
+            @if $category != "" {
+                family: "#{$style-name-boldslanted}", #{$category};
+            }
+            @else {
+                family: "#{$style-name-boldslanted}";
+                weight: normal;
+            }
+        }
+    }
+}
+
+@include font-face-regular($style-name-regular, $file-regular, $family, $category);
+@include font-face-slanted($style-name-slanted, $file-slanted, $family, $category);
+@include font-face-bold($style-name-bold, $file-bold, $family, $category);
+@include font-face-boldslanted($style-name-boldslanted, $file-boldslanted, $family, $category);
+
+// font-size
+$fonth1: 2rem;
+$fonth2: 1.5rem;
+$fonth3: 1rem;
+$fontp: 1rem;
diff --git a/user/themes/anissabensalah/scss/theme.scss b/user/themes/anissabensalah/scss/theme.scss
index ccf172a..a439e7e 100644
--- a/user/themes/anissabensalah/scss/theme.scss
+++ b/user/themes/anissabensalah/scss/theme.scss
@@ -1,7 +1,7 @@
 // Core variables and mixins
 // @import 'spectre/variables';
 // @import 'spectre/mixins';
-// 
+//
 // @import 'theme/variables';
 // @import 'theme/mixins';
 // @import 'theme/framework';
@@ -10,7 +10,13 @@
 // @import 'theme/mobile';
 // @import 'theme/animation';
 //
-// @import 'theme/header';
+
+@import 'theme/reset';
+@import 'theme/header';
+@import 'theme/nav';
+@import 'theme/section';
+@import 'theme/footer';
+
 // @import 'theme/footer';
 // @import 'theme/menu';
 //
diff --git a/user/themes/anissabensalah/scss/theme/footer.scss b/user/themes/anissabensalah/scss/theme/footer.scss
new file mode 100644
index 0000000..e69de29
diff --git a/user/themes/anissabensalah/scss/theme/header.scss b/user/themes/anissabensalah/scss/theme/header.scss
new file mode 100644
index 0000000..e69de29
diff --git a/user/themes/anissabensalah/scss/theme/nav.scss b/user/themes/anissabensalah/scss/theme/nav.scss
new file mode 100644
index 0000000..e69de29
diff --git a/user/themes/anissabensalah/scss/theme/reset.scss b/user/themes/anissabensalah/scss/theme/reset.scss
new file mode 100644
index 0000000..b12e6f2
--- /dev/null
+++ b/user/themes/anissabensalah/scss/theme/reset.scss
@@ -0,0 +1,26 @@
+*{
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+}
+
+html, body{
+  margin: 0;
+  padding: 0;
+  height: 100%;
+}
+
+ul, li, ol{
+  margin: 0;
+  padding: 0;
+  list-style: none;
+}
+
+a{
+  text-decoration: none;
+  color: black;
+}
+
+p, ul, li, ol, h1, h2, h3, em, blockquote{
+  margin: 0;
+}
diff --git a/user/themes/anissabensalah/scss/theme/section.scss b/user/themes/anissabensalah/scss/theme/section.scss
new file mode 100644
index 0000000..e69de29