diff --git a/layouts/index.html b/layouts/index.html
index 4414e78..7a2f27f 100644
--- a/layouts/index.html
+++ b/layouts/index.html
@@ -4,7 +4,7 @@
 
 {{ if $data.homepage.slider.enable }}
 {{ with $data.homepage.slider }}
-<section class="hero-section overlay bg-cover" data-background="{{ .bg_image | absURL }}">
+<section class="hero-section overlay bg-cover hero-default" data-background="{{ .bg_image | absURL }}">
   <div class="container">
     <div class="hero-slider">
       {{ range .slider_item }}
@@ -24,6 +24,33 @@
   </div>
 </section>
 {{ end }}
+<noscript>
+  <style>
+    .hero-default {
+      display: none;
+    }
+    
+  </style>
+  <section class="hero-section overlay bg-cover" style="background-image: url({{ $data.homepage.slider.bg_image | absURL }});">
+    <div class="container">
+      <div class="hero-slider">
+        {{ range first 1 $data.homepage.slider.slider_item }}
+        <div class="hero-slider-item">
+          <div class="row">
+            <div class="col-md-8">
+              <h1 class="text-white">{{ $data.homepage.slider.title | markdownify }}</h1>
+              <p class="text-muted mb-4">{{ .content | markdownify }}</p>
+              {{ if .button.enable }}
+              <a href="{{ .button.link | absLangURL }}" class="btn btn-primary" data-animation-out="fadeOut{{.animation_out | title }}" data-delay-out="5" data-duration-in=".3" data-animation-in="fadeIn{{.animation_in | title }}" data-delay-in=".7">{{ .button.label }}</a>
+              {{ end }}
+            </div>
+          </div>
+        </div>
+        {{ end }}
+      </div>
+    </div>
+  </section>
+</noscript>
 {{ end }}
 
 {{ if $data.homepage.about.enable }}
diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html
index 53636ff..2d03faf 100644
--- a/layouts/partials/footer.html
+++ b/layouts/partials/footer.html
@@ -66,13 +66,6 @@
 
 {{ $script := resources.Get "js/script.js" | minify}}
 <script src="{{ $script.Permalink }}"></script>
-<noscript>
-  <style>
-    .preloader {
-      opacity: 0;
-    }
-  </style>
-</noscript>
 
 {{ if ($.Scratch.Get "photoswipeloaded") }}
 <script src="/js/load-photoswipe.js"></script>
diff --git a/layouts/partials/header.html b/layouts/partials/header.html
index 4672807..715432e 100644
--- a/layouts/partials/header.html
+++ b/layouts/partials/header.html
@@ -81,4 +81,11 @@
       </nav>
     </div>
   </div>
+  <noscript>
+    <style>
+      .navigation {
+        background-color: #1a1a37;
+      }
+    </style>
+  </noscript>
 </header>
diff --git a/layouts/partials/preloader.html b/layouts/partials/preloader.html
index 4e2ba6f..0a076bf 100644
--- a/layouts/partials/preloader.html
+++ b/layouts/partials/preloader.html
@@ -4,4 +4,11 @@
   <img src="{{ . | absURL }}" width="222px" alt="preloader">
   {{ end }}
 </div>
+<noscript>
+  <style>
+    .preloader {
+      display: none;
+    }
+  </style>
+</noscript>
 {{ end }}