diff --git a/src/dependencies.pug b/src/dependencies.pug
index 47ab834..7f7bd6c 100644
--- a/src/dependencies.pug
+++ b/src/dependencies.pug
@@ -29,11 +29,11 @@ if endpoints.get
 
   if endpoints.get.uploads && endpoints.get.skills && endpoints.get.users
       //-script(type="module" src="https://cdn.skypack.dev/@startinblox/component-directory@1.3" defer)
-      //- script(type="module" src="/lib/solid-directory/dist/index.js" defer)
+      //-script(type="module" src="/lib/solid-directory/dist/index.js" defer)
 
   if endpoints.get.dashboards
-      script(type="module" src="https://cdn.skypack.dev/@startinblox/component-dashboard@0.7" defer)
-      //- script(type="module" src="/lib/solid-dashboard/dist/index.js" defer)
+      //-script(type="module" src="https://cdn.skypack.dev/@startinblox/component-dashboard@0.7" defer)
+      script(type="module" src="/lib/solid-dashboard/dist/index.js" defer)
 
   if endpoints.get.users
       script(type="module" src="https://cdn.skypack.dev/@startinblox/component-chat@1.7" defer)
diff --git a/src/styles/index.scss b/src/styles/index.scss
index 516229c..ad34f59 100644
--- a/src/styles/index.scss
+++ b/src/styles/index.scss
@@ -18,30 +18,85 @@ solid-display>div {
   display: contents !important;
 }
 
-.w75 {
-  width: 75%;
-}
-
-.w25 {
-  width: 25%;
-}
-
-.w50 {
-  width: 50%;
-}
-
-.w33 {
-  width: 33.333%;
-}
-
-.w66 {
-  width: 66.666%;
-}
-
 .text-left {
   text-align: left;
 }
 
+$small: "max-width: 640px";
+
+.segment {
+  @media($small) {
+    &.sm {
+      &-hidden {
+        display: none;
+      }
+
+      &-quarter {
+        width: 25%;
+      }
+
+      &-third {
+        width: 33.333%;
+      }
+
+      &-half {
+        width: 50%;
+      }
+
+      &-two-third {
+        width: 66.666%;
+      }
+
+      &-three-quarter {
+        width: 75%;
+      }
+
+      &-full {
+        width: 100%;
+      }
+
+      &-auto {
+        width: auto;
+      }
+    }
+
+    &.sm-children {
+      &-hidden>div>solid-display {
+        display: none;
+      }
+
+      &-quarter>div>solid-display {
+        width: 25%;
+      }
+
+      &-third>div>solid-display {
+        width: 33.333%;
+      }
+
+      &-half>div>solid-display {
+        width: 50%;
+      }
+
+      &-two-third>div>solid-display {
+        width: 66.666%;
+      }
+
+      &-three-quarter>div>solid-display {
+        width: 75%;
+      }
+
+      &-full>div>solid-display {
+        width: 100%;
+      }
+
+      &-auto>div>solid-display {
+        width: auto;
+      }
+    }
+  }
+}
+
+
 
 
 
diff --git a/src/views/page-about.pug b/src/views/page-about.pug
index 494403f..c10eb95 100644
--- a/src/views/page-about.pug
+++ b/src/views/page-about.pug
@@ -1,4 +1,4 @@
-//-div.segment.padding-top-small.padding-right-large.padding-bottom-small.padding-left-large
+div.segment.padding-top-small.padding-right-large.padding-bottom-small.padding-left-large
   h2.text-xlarge.text-color-heading.text-uppercase(data-trans='about.title')
 
   div.segment.lg-two-third.margin-top-small.padding-right-xlarge
@@ -19,7 +19,7 @@
 
 
 
-<div class="padding-top-xlarge padding-right-large padding-bottom-xlarge padding-left-large whitespace-normal">
+//-<div class="padding-top-xlarge padding-right-large padding-bottom-xlarge padding-left-large whitespace-normal">
   
   <div class="segment lg-full margin-bottom-xlarge">
     <div class="whitespace-normal shadow padding-medium text-center">
@@ -134,4 +134,4 @@
       </div>
     </div>
   </div>
-</div>
\ No newline at end of file
+//-</div>
\ No newline at end of file
diff --git a/src/views/page-directory.pug b/src/views/page-directory.pug
index 57af17a..a987862 100644
--- a/src/views/page-directory.pug
+++ b/src/views/page-directory.pug
@@ -1,4 +1,4 @@
-div.segment.lg-full.padding-top-xlarge.padding-right-large.padding-bottom-xlarge.padding-left-large.whitespace-normal
+div.padding-top-xlarge.padding-right-large.padding-bottom-xlarge.padding-left-large.whitespace-normal
   solid-directory(
     data-src=`${endpoints.users || endpoints.get.users}`
     range-skills=`${endpoints.skills || endpoints.get.skills}`
diff --git a/src/views/partials/circle/page-circle-edit.pug b/src/views/partials/circle/page-circle-edit.pug
index 88c7b57..98e2c60 100644
--- a/src/views/partials/circle/page-circle-edit.pug
+++ b/src/views/partials/circle/page-circle-edit.pug
@@ -11,7 +11,7 @@ solid-ac-checker(permission='acl:Read', bind-resources)
         class-dash='text-color-heading text-bold'          
       )
     div.segment.lg-half.text-right
-      solid-link(class="backlink right", bind-resources, next='circle-profile' data-trans='circle.edit.backlink')
+      solid-link(class="backlink", bind-resources, next='circle-profile' data-trans='circle.edit.backlink')
 
 div.segment.lg-full.padding-large.whitespace-normal
 
diff --git a/src/views/partials/project/page-project-edit.pug b/src/views/partials/project/page-project-edit.pug
index 59602eb..efed341 100644
--- a/src/views/partials/project/page-project-edit.pug
+++ b/src/views/partials/project/page-project-edit.pug
@@ -15,7 +15,7 @@ solid-ac-checker(permission='acl:Read', bind-resources)
         value-dash=' - '
       )
     div.segment.lg-half.text-right
-      solid-link(class='backlink right', bind-resources, next='project-profile' data-trans='project.edit.backlink')
+      solid-link(class='backlink', bind-resources, next='project-profile' data-trans='project.edit.backlink')
 
 div.segment.lg-full.padding-large.whitespace-normal
 
diff --git a/src/views/partials/project/page-project-picture.pug b/src/views/partials/project/page-project-picture.pug
index 0de842c..e04a342 100644
--- a/src/views/partials/project/page-project-picture.pug
+++ b/src/views/partials/project/page-project-picture.pug
@@ -1,6 +1,6 @@
 div.content-box__info
 			
-  solid-link(class='backlink right', bind-resources, next='project-edit' data-trans='project.modifyPicture.backlink')
+  solid-link(class='backlink', bind-resources, next='project-edit' data-trans='project.modifyPicture.backlink')
 
   h1(data-trans='project.modifyPicture.title')