Fix 404 responsiveness

layouts/404.html

@@ -11,7 +11,7 @@
     <img src="/assets/images/404.png" alt="">
     <div class="message">
         <h1>404</h1>
-        <h4>The page you are looking for is not done yet.</h4>
+        <h4>The page you are looking for is not there yet.</h4>
     </div>
 </div>
 {{ end }}

layouts/partials/about.html

@@ -1,6 +1,6 @@
 <div class="container-fluid about bg-white anchor p-md-5 d-flex" id="about">
   <div class="container">
-    <div class="row pt-sm-2 pt-md-5 align-self-center">
+    <div class="row pt-sm-2 pt-md-4 align-self-center">
       <!-- summery -->
       <div class="col-md-6">
         <h3 class="p-1">{{ .Site.Data.about.name }}</h3>
@@ -27,7 +27,7 @@
         >
       </div>
       <!-- soft skills circular-progressbar -->
-      <div class="col-md-6 pt-5 pl-4 pt-md-0">
+      <div class="col-md-6 pt-5 pl-md-4 pl-sm-3 pt-md-0">
         <div class="row">
           {{ range .Site.Data.about.softSkills }}
             {{ partial "progress/soft-skills" . }}

layouts/partials/home.html

@@ -1,4 +1,3 @@
-<!-- HOME START -->
 <div class="container-fluid home" id="home">
   <div
     class="background container-fluid"
@@ -23,4 +22,3 @@
     <a href="#about"><i class="arrow bounce fa fa-chevron-down"></i></a>
   </div>
 </div>
-<!-- HOME END -->

layouts/partials/skills.html

@@ -1,4 +1,3 @@
-<!-- SKILLS START -->
 <div class="container-fluid skills bg-dimmed anchor pb-5" id="skills">
   <h1 class="text-center">Skills</h1>
 
@@ -10,4 +9,3 @@
     </div>
   </div>
 </div>
-<!-- SKILLS END -->

static/assets/css/404.css

@@ -22,3 +22,48 @@
   top: 40%;
   left: 30%;
 }
+
+/* ============= Device specific fixes ======= */
+
+/* Extra small devices (portrait phones, less than 576px) */
+
+/* No media query for `xs` since this is the default in Bootstrap */
+
+/* Extra large devices (large desktops, 1200px and up) */
+
+@media (max-width: 1400px) {
+}
+
+@media (max-width: 1200px) {
+}
+
+/*  Large devices (desktops, 992px and up) */
+
+@media (max-width: 992px) {
+  .notFound .message {
+    top: 46%;
+    left: 25%;
+  }
+}
+
+/* Medium devices (tablets, 768px and up) */
+
+@media only screen and (max-width: 768px) {
+  .notFound .message {
+    top: 50%;
+    left: 10%;
+  }
+}
+
+/* Small devices (landscape phones, 576px and up) */
+
+@media only screen and (max-width: 576px) {
+  .notFound img {
+    height: 500px;
+  }
+
+  .notFound .message {
+    top: 50%;
+    left: 5%;
+  }
+}

static/assets/css/achievements.css

@@ -1,3 +1,7 @@
+.achievements .container{
+  padding-top: 0.5rem;
+}
+
 #gallery .achievement-entry {
   cursor: pointer;
   margin-top: 5px;

static/assets/css/experiences.css

@@ -3,7 +3,7 @@
 }
 
 .experiences .timeline{
-  margin-top: 2rem!important;
+  margin-top: 1.5rem!important;
 }
 
 .text-muted {

static/assets/css/recent-posts.css

@@ -1,3 +1,7 @@
+.recent-posts .container{
+  padding-top: 1rem;
+}
+
 .recent-posts .card .card-footer span {
   font-size: 10pt;
   color: #6c757d !important;

static/assets/css/style.css

@@ -83,7 +83,7 @@ a:hover {
 }
 
 .anchor {
-  padding-top: 3rem;
+  padding-top: 2rem;
 }
 
 .card {