Update index.html

warzemstonewood · Jul 15, 2023 · 2f4f200 · 2f4f200
1 parent 58a7460
commit 2f4f200
Showing 1 changed file with 43 additions and 21 deletions.
diff --git a/index.html b/index.html
@@ -120,18 +120,6 @@
 
            <style>
 
-
-      .home {
-        height: 90vh;
-        position: relative;
-      }
-video {
-  object-fit: cover;
-  position: absolute;
-  width: 100%;
-  height: 100%;
-  z-index: 0.1;
-}
     .overlay {
       position: absolute;
       top: 0;
@@ -175,25 +163,29 @@
     }
     </style>
 <style>
-.home video {
+      .home {
+        height: 90vh;
+        position: relative;
+      }
+video {
   object-fit: cover;
   position: absolute;
   width: 100%;
   height: 100%;
-  position: absolute;
-  z-index: 000;
+  z-index: 0.1;
 }
+
 .home:before{
   z-index: 777;
   content: '';
   position: absolute;
   background: rgba(3, 96, 251, 0.3);
 }
 .slider-navigation {
-  z-index: 888;
-  top: -40%;
-  left: 180px;
-  position: relative;
+  z-index: 777;
+  top: 290px;
+  left: 80%;
+  position: fixed;
   display: flex;
   justify-content: center;
   align-items: center;
@@ -209,6 +201,26 @@
   box-shadow: 0 0 2px rgba(255, 255, 255, 0.5);
   transition: 0.3s ease;
 }
+.slider-navigation2 {
+  z-index: 777;
+  top: 320px;
+  left: 80%;
+  position: fixed;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  transform: translateY(60px);
+  margin-bottom: 12px;
+}
+.slider-navigation2 .nav-btn {
+  width: 12px;
+  height: 12px;
+  background: #00cdff00;
+  border-radius: 50%;
+  cursor: pointer;
+  box-shadow: 0 0 2px rgba(255, 255, 255, 0.5);
+  transition: 0.3s ease;
+}
 .slider-navigation .nav-btn.active{
   background: #ffffff44; /*#2696E9;*/
 }
@@ -219,6 +231,16 @@
 .slider-navigation .nav-btn:hover{
   transform: scale(1.2);
 }
+.slider-navigation2 .nav-btn.active{
+  background: #ffffff44; /*#2696E9;*/
+}
+.slider-navigation2 .nav-btn:not(:last-child) {
+  margin-right: 100px;
+
+}
+.slider-navigation2 .nav-btn:hover{
+  transform: scale(1.2);
+}
 .video-slide{
   position: absolute;
   width: 100%;
@@ -285,7 +307,7 @@
       <!--<p title="Księstwo Jaćwieży, Korona Podlasia, Polska" onload='javascript:(function(o){o.style.height=o.contentWindow.document.body.scrollHeight+"px";}(this));'k style="text-align:center;">
       <a href="https://warzemstonewood.github.io/pl"></a></p>-->
             <div style="padding: 100px 0;letter-spacing: 7px; text-align:center;">
-<a href="index.html"><img src="movies/YotvingianWb5.svg" 
+<a href="index.html"><img src="movies/YotvingianWb.svg" 
                                                        alt="Komforotwe wygodne ergonomiczne estetyczne meble z litego drewna orzech włoski dąb jesion klon brzoza krzesła krzesło deski do krojenia deski do serwowania wyspy kuchenne ławeczki stoły łóżka łóżko" 
                                                        title="Urok Jaćwieży" 
                                                        height="300px" width="" style="background-color:">
@@ -308,7 +330,7 @@
       <!--<div class="middle-line"></div>
       <button>DISCOVER</button>-->
       </div>
-      <div class="slider-navigation" style="line-height: 0.5;"><div class="nav-btn active">&nbsp;&nbsp;<button id="myBtn1" onclick="myFunction1()"  title="Szum fal jeziora jaćwingów" style="font-size:15px;">Play</button></div></div><p></p><div class="slider-navigation"><div class="nav-btn active">&nbsp;&nbsp;<button id="myBtn2" onclick="myFunction2()"  title="Szum rzeki jaćwingów"style="font-size:15px;">Play</button></div></div>
+      <div class="slider-navigation" style="line-height: 0.5;"><div class="nav-btn active">&nbsp;&nbsp;<button id="myBtn1" onclick="myFunction1()"  title="Szum fal jeziora jaćwingów" style="font-size:15px;">Play</button></div></div><p></p><div class="slider-navigation2"><div class="nav-btn active">&nbsp;&nbsp;<button id="myBtn2" onclick="myFunction2()"  title="Szum rzeki jaćwingów"style="font-size:15px;">Play</button></div></div>
       </div>
       <script type="text/javascript">
   //Javascript for video slider navigation