diff --git a/animations.css b/animations.css
new file mode 100644
index 0000000..17249cf
--- /dev/null
+++ b/animations.css
@@ -0,0 +1,6 @@
+
+
+@keyframes bottommark {
+    0%{border-bottom: 2px red solid;}
+    50%{border-bottom: 2px rgb(55, 255, 0) solid;}
+}
\ No newline at end of file
diff --git a/fav.ico b/fav.ico
new file mode 100644
index 0000000..ca9aabf
Binary files /dev/null and b/fav.ico differ
diff --git a/from-category.css b/from-category.css
new file mode 100644
index 0000000..4d344e2
--- /dev/null
+++ b/from-category.css
@@ -0,0 +1,53 @@
+.top-ex-search-bar {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    width: 200%;
+}
+
+.top-ex-search-form {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    gap: 16px;
+    padding: 0px 12px;
+    width: 100%;
+    background: #ffffff;
+    border-radius: 100px;
+    border: 2px #e4e5ec solid;
+    outline: none;
+    box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.048);
+}
+
+.top-ex-search-form:hover {
+    border: 2px #c2c8ff solid;
+}
+
+.top-ex-search-form:focus-within {
+    /* box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.118); */
+    background: #e7e7e7;    
+}
+
+.search-input,
+#search-input {
+    display: flex;
+    width: 100%;
+    padding: 20px;
+    border: 2px transparent solid;
+    border-radius: 100px;
+    outline: none;
+    background-color: transparent;
+}
+
+
+.top-ex-search-form:hover,
+.search-input:hover,
+#search-input:hover {
+    background: #f6f6ff;
+}
+
+.search-input:focus-within,
+#search-input:focus-within {
+    background-color: transparent;
+    border: transparent 2px solid;
+}
\ No newline at end of file
diff --git a/from-category.html b/from-category.html
new file mode 100644
index 0000000..93444e5
--- /dev/null
+++ b/from-category.html
@@ -0,0 +1,1059 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+
+    <title>Directed from Category</title>
+
+    <link rel="icon" type="image/png" href="fav.ico">
+    <link rel="shortcut icon" type="image/x-icon" href="fav.ico">
+
+    <link rel="stylesheet" href="style.css">
+    <link rel="stylesheet" href="media.min.css">
+    <link rel="stylesheet" href="animations.css">
+    <link rel="stylesheet" href="innersearch.css">
+    <!-- def = this -->
+    <link rel="stylesheet" href="from-category.css">
+</head>
+
+<body data-new-gr-c-s-check-loaded="14.1030.0" data-gr-ext-installed="" cz-shortcut-listen="true">
+    <div class="container">
+        <div class="header">
+            <div class="logo">
+                <a href="index.html"><img src="logo.png" alt="">
+                    <span class="logo-text">boookib</span>
+                </a>
+            </div>
+
+            <div class="prev-btn">
+                <a href="index.html">
+                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                    <!-- remove code from below because that's an alternate image of icon -->
+                    <img src="fav.ico" alt="">
+                    back
+                </a>
+            </div>
+
+            <div class="top-ex-search-bar">
+                <form action="search.html" method="get" target="_self" class="top-ex-search-form">
+                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                    <!-- remove code from below because that's an alternate image of icon -->
+                    <img src="fav.ico" alt="">
+                    <input type="text/mail" name="search-result" placeholder="search things now..." class="search-input"
+                        id="search-input">
+                </form>
+            </div>
+
+            <!-- code of #apps & #profile -->
+
+        </div>
+
+
+
+        <div class="contents">
+            <div class="expanded-cards-cont">
+                <!-- <h1 class="ex-title">
+                    let's discover us and made life much easier
+                </h1> -->
+                <div class="ex-cards-cont">
+                    <div class="ex-cards">
+                        <div class="ex-card">
+                            <a href="#figma">
+                                <div class="ex-thumb">
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </a>
+                            <div class="ex-desc-cont">
+                                <div class="ex-desc">
+                                    <a href="#w3chools">
+                                        <h4 class="title-4">w3schools</h4>
+                                    </a>
+                                    <p class="ex-short-bio">
+                                        lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                        dolor
+                                        sit amet quer lorem ipsum dolor sit amet quer
+                                    </p>
+                                </div>
+                                <div class="ex-categ">
+                                    <a href="#free" class="ex-label">free</a>
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </div>
+                        </div>
+                        <div class="ex-card">
+                            <a href="#figma">
+                                <div class="ex-thumb">
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </a>
+                            <div class="ex-desc-cont">
+                                <div class="ex-desc">
+                                    <a href="#w3chools">
+                                        <h4 class="title-4">w3schools</h4>
+                                    </a>
+                                    <p class="ex-short-bio">
+                                        lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                        dolor
+                                        sit amet quer lorem ipsum dolor sit amet quer
+                                    </p>
+                                </div>
+                                <div class="ex-categ">
+                                    <a href="#free" class="ex-label">free</a>
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </div>
+                        </div>
+                        <div class="ex-card">
+                            <a href="#figma">
+                                <div class="ex-thumb">
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </a>
+                            <div class="ex-desc-cont">
+                                <div class="ex-desc">
+                                    <a href="#w3chools">
+                                        <h4 class="title-4">w3schools</h4>
+                                    </a>
+                                    <p class="ex-short-bio">
+                                        lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                        dolor
+                                        sit amet quer lorem ipsum dolor sit amet quer
+                                    </p>
+                                </div>
+                                <div class="ex-categ">
+                                    <a href="#free" class="ex-label">free</a>
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </div>
+                        </div>
+                        <div class="ex-card">
+                            <a href="#figma">
+                                <div class="ex-thumb">
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </a>
+                            <div class="ex-desc-cont">
+                                <div class="ex-desc">
+                                    <a href="#w3chools">
+                                        <h4 class="title-4">w3schools</h4>
+                                    </a>
+                                    <p class="ex-short-bio">
+                                        lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                        dolor
+                                        sit amet quer lorem ipsum dolor sit amet quer
+                                    </p>
+                                </div>
+                                <div class="ex-categ">
+                                    <a href="#free" class="ex-label">free</a>
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                    <div class="ex-cards">
+                        <div class="ex-card">
+                            <a href="#figma">
+                                <div class="ex-thumb">
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </a>
+                            <div class="ex-desc-cont">
+                                <div class="ex-desc">
+                                    <a href="#w3chools">
+                                        <h4 class="title-4">w3schools</h4>
+                                    </a>
+                                    <p class="ex-short-bio">
+                                        lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                        dolor
+                                        sit amet quer lorem ipsum dolor sit amet quer
+                                    </p>
+                                </div>
+                                <div class="ex-categ">
+                                    <a href="#free" class="ex-label">free</a>
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </div>
+                        </div>
+                        <div class="ex-card">
+                            <a href="#figma">
+                                <div class="ex-thumb">
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </a>
+                            <div class="ex-desc-cont">
+                                <div class="ex-desc">
+                                    <a href="#w3chools">
+                                        <h4 class="title-4">w3schools</h4>
+                                    </a>
+                                    <p class="ex-short-bio">
+                                        lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                        dolor
+                                        sit amet quer lorem ipsum dolor sit amet quer
+                                    </p>
+                                </div>
+                                <div class="ex-categ">
+                                    <a href="#free" class="ex-label">free</a>
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </div>
+                        </div>
+                        <div class="ex-card">
+                            <a href="#figma">
+                                <div class="ex-thumb">
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </a>
+                            <div class="ex-desc-cont">
+                                <div class="ex-desc">
+                                    <a href="#w3chools">
+                                        <h4 class="title-4">w3schools</h4>
+                                    </a>
+                                    <p class="ex-short-bio">
+                                        lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                        dolor
+                                        sit amet quer lorem ipsum dolor sit amet quer
+                                    </p>
+                                </div>
+                                <div class="ex-categ">
+                                    <a href="#free" class="ex-label">free</a>
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </div>
+                        </div>
+                        <div class="ex-card">
+                            <a href="#figma">
+                                <div class="ex-thumb">
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </a>
+                            <div class="ex-desc-cont">
+                                <div class="ex-desc">
+                                    <a href="#w3chools">
+                                        <h4 class="title-4">w3schools</h4>
+                                    </a>
+                                    <p class="ex-short-bio">
+                                        lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                        dolor
+                                        sit amet quer lorem ipsum dolor sit amet quer
+                                    </p>
+                                </div>
+                                <div class="ex-categ">
+                                    <a href="#free" class="ex-label">free</a>
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                    <div class="ex-cards">
+                        <div class="ex-card">
+                            <a href="#figma">
+                                <div class="ex-thumb">
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </a>
+                            <div class="ex-desc-cont">
+                                <div class="ex-desc">
+                                    <a href="#w3chools">
+                                        <h4 class="title-4">w3schools</h4>
+                                    </a>
+                                    <p class="ex-short-bio">
+                                        lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                        dolor
+                                        sit amet quer lorem ipsum dolor sit amet quer
+                                    </p>
+                                </div>
+                                <div class="ex-categ">
+                                    <a href="#free" class="ex-label">free</a>
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </div>
+                        </div>
+                        <div class="ex-card">
+                            <a href="#figma">
+                                <div class="ex-thumb">
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </a>
+                            <div class="ex-desc-cont">
+                                <div class="ex-desc">
+                                    <a href="#w3chools">
+                                        <h4 class="title-4">w3schools</h4>
+                                    </a>
+                                    <p class="ex-short-bio">
+                                        lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                        dolor
+                                        sit amet quer lorem ipsum dolor sit amet quer
+                                    </p>
+                                </div>
+                                <div class="ex-categ">
+                                    <a href="#free" class="ex-label">free</a>
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </div>
+                        </div>
+                        <div class="ex-card">
+                            <a href="#figma">
+                                <div class="ex-thumb">
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </a>
+                            <div class="ex-desc-cont">
+                                <div class="ex-desc">
+                                    <a href="#w3chools">
+                                        <h4 class="title-4">w3schools</h4>
+                                    </a>
+                                    <p class="ex-short-bio">
+                                        lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                        dolor
+                                        sit amet quer lorem ipsum dolor sit amet quer
+                                    </p>
+                                </div>
+                                <div class="ex-categ">
+                                    <a href="#free" class="ex-label">free</a>
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </div>
+                        </div>
+                        <div class="ex-card">
+                            <a href="#figma">
+                                <div class="ex-thumb">
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </a>
+                            <div class="ex-desc-cont">
+                                <div class="ex-desc">
+                                    <a href="#w3chools">
+                                        <h4 class="title-4">w3schools</h4>
+                                    </a>
+                                    <p class="ex-short-bio">
+                                        lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                        dolor
+                                        sit amet quer lorem ipsum dolor sit amet quer
+                                    </p>
+                                </div>
+                                <div class="ex-categ">
+                                    <a href="#free" class="ex-label">free</a>
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                    <div class="ex-cards">
+                        <div class="ex-card">
+                            <a href="#figma">
+                                <div class="ex-thumb">
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </a>
+                            <div class="ex-desc-cont">
+                                <div class="ex-desc">
+                                    <a href="#w3chools">
+                                        <h4 class="title-4">w3schools</h4>
+                                    </a>
+                                    <p class="ex-short-bio">
+                                        lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                        dolor
+                                        sit amet quer lorem ipsum dolor sit amet quer
+                                    </p>
+                                </div>
+                                <div class="ex-categ">
+                                    <a href="#free" class="ex-label">free</a>
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </div>
+                        </div>
+                        <div class="ex-card">
+                            <a href="#figma">
+                                <div class="ex-thumb">
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </a>
+                            <div class="ex-desc-cont">
+                                <div class="ex-desc">
+                                    <a href="#w3chools">
+                                        <h4 class="title-4">w3schools</h4>
+                                    </a>
+                                    <p class="ex-short-bio">
+                                        lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                        dolor
+                                        sit amet quer lorem ipsum dolor sit amet quer
+                                    </p>
+                                </div>
+                                <div class="ex-categ">
+                                    <a href="#free" class="ex-label">free</a>
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </div>
+                        </div>
+                        <div class="ex-card">
+                            <a href="#figma">
+                                <div class="ex-thumb">
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </a>
+                            <div class="ex-desc-cont">
+                                <div class="ex-desc">
+                                    <a href="#w3chools">
+                                        <h4 class="title-4">w3schools</h4>
+                                    </a>
+                                    <p class="ex-short-bio">
+                                        lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                        dolor
+                                        sit amet quer lorem ipsum dolor sit amet quer
+                                    </p>
+                                </div>
+                                <div class="ex-categ">
+                                    <a href="#free" class="ex-label">free</a>
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </div>
+                        </div>
+                        <div class="ex-card">
+                            <a href="#figma">
+                                <div class="ex-thumb">
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </a>
+                            <div class="ex-desc-cont">
+                                <div class="ex-desc">
+                                    <a href="#w3chools">
+                                        <h4 class="title-4">w3schools</h4>
+                                    </a>
+                                    <p class="ex-short-bio">
+                                        lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                        dolor
+                                        sit amet quer lorem ipsum dolor sit amet quer
+                                    </p>
+                                </div>
+                                <div class="ex-categ">
+                                    <a href="#free" class="ex-label">free</a>
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                    <div class="ex-cards">
+                        <div class="ex-card">
+                            <a href="#figma">
+                                <div class="ex-thumb">
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </a>
+                            <div class="ex-desc-cont">
+                                <div class="ex-desc">
+                                    <a href="#w3chools">
+                                        <h4 class="title-4">w3schools</h4>
+                                    </a>
+                                    <p class="ex-short-bio">
+                                        lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                        dolor
+                                        sit amet quer lorem ipsum dolor sit amet quer
+                                    </p>
+                                </div>
+                                <div class="ex-categ">
+                                    <a href="#free" class="ex-label">free</a>
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </div>
+                        </div>
+                        <div class="ex-card">
+                            <a href="#figma">
+                                <div class="ex-thumb">
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </a>
+                            <div class="ex-desc-cont">
+                                <div class="ex-desc">
+                                    <a href="#w3chools">
+                                        <h4 class="title-4">w3schools</h4>
+                                    </a>
+                                    <p class="ex-short-bio">
+                                        lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                        dolor
+                                        sit amet quer lorem ipsum dolor sit amet quer
+                                    </p>
+                                </div>
+                                <div class="ex-categ">
+                                    <a href="#free" class="ex-label">free</a>
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </div>
+                        </div>
+                        <div class="ex-card">
+                            <a href="#figma">
+                                <div class="ex-thumb">
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </a>
+                            <div class="ex-desc-cont">
+                                <div class="ex-desc">
+                                    <a href="#w3chools">
+                                        <h4 class="title-4">w3schools</h4>
+                                    </a>
+                                    <p class="ex-short-bio">
+                                        lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                        dolor
+                                        sit amet quer lorem ipsum dolor sit amet quer
+                                    </p>
+                                </div>
+                                <div class="ex-categ">
+                                    <a href="#free" class="ex-label">free</a>
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </div>
+                        </div>
+                        <div class="ex-card">
+                            <a href="#figma">
+                                <div class="ex-thumb">
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </a>
+                            <div class="ex-desc-cont">
+                                <div class="ex-desc">
+                                    <a href="#w3chools">
+                                        <h4 class="title-4">w3schools</h4>
+                                    </a>
+                                    <p class="ex-short-bio">
+                                        lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                        dolor
+                                        sit amet quer lorem ipsum dolor sit amet quer
+                                    </p>
+                                </div>
+                                <div class="ex-categ">
+                                    <a href="#free" class="ex-label">free</a>
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                    <div class="ex-cards">
+                        <div class="ex-card">
+                            <a href="#figma">
+                                <div class="ex-thumb">
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </a>
+                            <div class="ex-desc-cont">
+                                <div class="ex-desc">
+                                    <a href="#w3chools">
+                                        <h4 class="title-4">w3schools</h4>
+                                    </a>
+                                    <p class="ex-short-bio">
+                                        lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                        dolor
+                                        sit amet quer lorem ipsum dolor sit amet quer
+                                    </p>
+                                </div>
+                                <div class="ex-categ">
+                                    <a href="#free" class="ex-label">free</a>
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </div>
+                        </div>
+                        <div class="ex-card">
+                            <a href="#figma">
+                                <div class="ex-thumb">
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </a>
+                            <div class="ex-desc-cont">
+                                <div class="ex-desc">
+                                    <a href="#w3chools">
+                                        <h4 class="title-4">w3schools</h4>
+                                    </a>
+                                    <p class="ex-short-bio">
+                                        lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                        dolor
+                                        sit amet quer lorem ipsum dolor sit amet quer
+                                    </p>
+                                </div>
+                                <div class="ex-categ">
+                                    <a href="#free" class="ex-label">free</a>
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </div>
+                        </div>
+                        <div class="ex-card">
+                            <a href="#figma">
+                                <div class="ex-thumb">
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </a>
+                            <div class="ex-desc-cont">
+                                <div class="ex-desc">
+                                    <a href="#w3chools">
+                                        <h4 class="title-4">w3schools</h4>
+                                    </a>
+                                    <p class="ex-short-bio">
+                                        lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                        dolor
+                                        sit amet quer lorem ipsum dolor sit amet quer
+                                    </p>
+                                </div>
+                                <div class="ex-categ">
+                                    <a href="#free" class="ex-label">free</a>
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </div>
+                        </div>
+                        <div class="ex-card">
+                            <a href="#figma">
+                                <div class="ex-thumb">
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </a>
+                            <div class="ex-desc-cont">
+                                <div class="ex-desc">
+                                    <a href="#w3chools">
+                                        <h4 class="title-4">w3schools</h4>
+                                    </a>
+                                    <p class="ex-short-bio">
+                                        lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                        dolor
+                                        sit amet quer lorem ipsum dolor sit amet quer
+                                    </p>
+                                </div>
+                                <div class="ex-categ">
+                                    <a href="#free" class="ex-label">free</a>
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                    <div class="ex-cards">
+                        <div class="ex-card">
+                            <a href="#figma">
+                                <div class="ex-thumb">
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </a>
+                            <div class="ex-desc-cont">
+                                <div class="ex-desc">
+                                    <a href="#w3chools">
+                                        <h4 class="title-4">w3schools</h4>
+                                    </a>
+                                    <p class="ex-short-bio">
+                                        lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                        dolor
+                                        sit amet quer lorem ipsum dolor sit amet quer
+                                    </p>
+                                </div>
+                                <div class="ex-categ">
+                                    <a href="#free" class="ex-label">free</a>
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </div>
+                        </div>
+                        <div class="ex-card">
+                            <a href="#figma">
+                                <div class="ex-thumb">
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </a>
+                            <div class="ex-desc-cont">
+                                <div class="ex-desc">
+                                    <a href="#w3chools">
+                                        <h4 class="title-4">w3schools</h4>
+                                    </a>
+                                    <p class="ex-short-bio">
+                                        lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                        dolor
+                                        sit amet quer lorem ipsum dolor sit amet quer
+                                    </p>
+                                </div>
+                                <div class="ex-categ">
+                                    <a href="#free" class="ex-label">free</a>
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </div>
+                        </div>
+                        <div class="ex-card">
+                            <a href="#figma">
+                                <div class="ex-thumb">
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </a>
+                            <div class="ex-desc-cont">
+                                <div class="ex-desc">
+                                    <a href="#w3chools">
+                                        <h4 class="title-4">w3schools</h4>
+                                    </a>
+                                    <p class="ex-short-bio">
+                                        lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                        dolor
+                                        sit amet quer lorem ipsum dolor sit amet quer
+                                    </p>
+                                </div>
+                                <div class="ex-categ">
+                                    <a href="#free" class="ex-label">free</a>
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </div>
+                        </div>
+                        <div class="ex-card">
+                            <a href="#figma">
+                                <div class="ex-thumb">
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </a>
+                            <div class="ex-desc-cont">
+                                <div class="ex-desc">
+                                    <a href="#w3chools">
+                                        <h4 class="title-4">w3schools</h4>
+                                    </a>
+                                    <p class="ex-short-bio">
+                                        lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                        dolor
+                                        sit amet quer lorem ipsum dolor sit amet quer
+                                    </p>
+                                </div>
+                                <div class="ex-categ">
+                                    <a href="#free" class="ex-label">free</a>
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                    <div class="ex-cards">
+                        <div class="ex-card">
+                            <a href="#figma">
+                                <div class="ex-thumb">
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </a>
+                            <div class="ex-desc-cont">
+                                <div class="ex-desc">
+                                    <a href="#w3chools">
+                                        <h4 class="title-4">w3schools</h4>
+                                    </a>
+                                    <p class="ex-short-bio">
+                                        lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                        dolor
+                                        sit amet quer lorem ipsum dolor sit amet quer
+                                    </p>
+                                </div>
+                                <div class="ex-categ">
+                                    <a href="#free" class="ex-label">free</a>
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </div>
+                        </div>
+                        <div class="ex-card">
+                            <a href="#figma">
+                                <div class="ex-thumb">
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </a>
+                            <div class="ex-desc-cont">
+                                <div class="ex-desc">
+                                    <a href="#w3chools">
+                                        <h4 class="title-4">w3schools</h4>
+                                    </a>
+                                    <p class="ex-short-bio">
+                                        lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                        dolor
+                                        sit amet quer lorem ipsum dolor sit amet quer
+                                    </p>
+                                </div>
+                                <div class="ex-categ">
+                                    <a href="#free" class="ex-label">free</a>
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </div>
+                        </div>
+                        <div class="ex-card">
+                            <a href="#figma">
+                                <div class="ex-thumb">
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </a>
+                            <div class="ex-desc-cont">
+                                <div class="ex-desc">
+                                    <a href="#w3chools">
+                                        <h4 class="title-4">w3schools</h4>
+                                    </a>
+                                    <p class="ex-short-bio">
+                                        lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                        dolor
+                                        sit amet quer lorem ipsum dolor sit amet quer
+                                    </p>
+                                </div>
+                                <div class="ex-categ">
+                                    <a href="#free" class="ex-label">free</a>
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </div>
+                        </div>
+                        <div class="ex-card">
+                            <a href="#figma">
+                                <div class="ex-thumb">
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </a>
+                            <div class="ex-desc-cont">
+                                <div class="ex-desc">
+                                    <a href="#w3chools">
+                                        <h4 class="title-4">w3schools</h4>
+                                    </a>
+                                    <p class="ex-short-bio">
+                                        lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                        dolor
+                                        sit amet quer lorem ipsum dolor sit amet quer
+                                    </p>
+                                </div>
+                                <div class="ex-categ">
+                                    <a href="#free" class="ex-label">free</a>
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+            <div class="footer-cont">
+                <div class="footer">
+                    <img src="logo.png" alt="" class="footer-logo">
+                    <div class="products-n-services">
+
+                        <div class="other-products">
+                            <h4 class="products-title">products</h4>
+                            <div class="products-list">
+                                <a href="#edukib.html">edukib </a>
+                                <a href="#vidokib.html">vidokib </a>
+                                <a href="#photozos.html">photozos </a>
+                                <a href="#musikib.html">musikib </a>
+                                <a href="#jobkib.html">jobkib </a>
+                            </div>
+                        </div>
+
+                        <div class="services">
+                            <h4 class="services-title">help & supports</h4>
+                            <div class="services-list">
+                                <a href="#services">services_1 </a>
+                                <a href="#services">services_2 </a>
+                                <a href="#services">services_3 </a>
+                                <a href="#services">services_4 </a>
+                                <a href="#services">services_5 </a>
+                            </div>
+                        </div>
+                        <div class="services">
+                            <h4 class="services-title">FAQ</h4>
+                            <div class="services-list">
+                                <a href="#services">services_1 </a>
+                                <a href="#services">services_2 </a>
+                                <a href="#services">services_3 </a>
+                                <a href="#services">services_4 </a>
+                                <a href="#services">services_5 </a>
+                            </div>
+                        </div>
+                        <div class="services">
+                            <h4 class="services-title">site map</h4>
+                            <div class="services-list">
+                                <a href="#services">services_1 </a>
+                                <a href="#services">services_2 </a>
+                                <a href="#services">services_3 </a>
+                                <a href="#services">services_4 </a>
+                                <a href="#services">services_5 </a>
+                            </div>
+                        </div>
+                        <div class="services">
+                            <h4 class="services-title">library</h4>
+                            <div class="services-list">
+                                <a href="#services">services_1 </a>
+                                <a href="#services">services_2 </a>
+                                <a href="#services">services_3 </a>
+                                <a href="#services">services_4 </a>
+                                <a href="#services">services_5 </a>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+
+                <div class="footer-bottom">
+                    <div class="our-documentation">
+                        <p class="copyrights">
+                            Copyrights © 2023 Boookib from
+                            <a href="#Metakib" class="company-link" style="padding-left: 4px;">
+                                Metakib
+                            </a>
+                        </p>
+                        <span class="divider">|</span>
+
+                        <a href="#Privacy_Policy" class="company-link">
+                            Privacy Policy
+                        </a>
+                        <span class="divider">|</span>
+
+                        <a href="#Security" class="company-link">
+                            Security
+                        </a>
+                        <span class="divider">|</span>
+
+                        <a href="#Terms_of_Service" class="company-link">
+                            Terms of Service
+                        </a>
+                    </div>
+
+                    <div class="social-networks">
+                        <a href="#facebook.com">
+                            <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        </a>
+                        <a href="#twitter.com">
+                            <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        </a>
+                        <a href="#instagram.com">
+                            <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        </a>
+                        <a href="#linkedin.com">
+                            <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        </a>
+                        <a href="#discord.com">
+                            <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        </a>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <a href="#facebook.com"><img src="fav.ico" alt=""></a>
+                        <a href="#twitter.com"><img src="fav.ico" alt=""></a>
+                        <a href="#instagram.com"><img src="fav.ico" alt=""></a>
+                        <a href="#linkedin.com"><img src="fav.ico" alt=""></a>
+                        <a href="#discord.com"><img src="fav.ico" alt=""></a>
+                    </div>
+                </div>
+            </div>
+
+        </div>
+    </div>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/icon/wow rakibul-2.svg b/icon/wow rakibul-2.svg
new file mode 100644
index 0000000..fa31d20
--- /dev/null
+++ b/icon/wow rakibul-2.svg	
@@ -0,0 +1,69 @@
+<svg width="1660" height="2245" viewBox="0 0 1660 2245" fill="none" xmlns="http://www.w3.org/2000/svg">
+<mask id="mask0_1_164" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="1660" height="2245">
+<rect width="1660" height="2245" fill="#D9D9D9"/>
+</mask>
+<g mask="url(#mask0_1_164)">
+<mask id="mask1_1_164" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="1193" width="1660" height="1052">
+<path d="M356.315 1324.55C319.636 1356.58 316.043 1397.21 316.043 1443.16C287.403 1544.95 262.6 1589.58 192.817 1632.86L0 1764.23V1891.49V2245H1115.09H1660L1625 2148.49L1552.39 2107.04C1354.12 2071.8 1338.67 1929.43 1200.45 1764.86C1164.34 1721.87 1119.85 1677.37 1061.53 1632.86C1038.3 1612.18 1018.93 1597.12 1001.5 1583.92C961.091 1553.31 931.091 1532.69 887.574 1475.16C848.351 1423.3 810.491 1371.16 762.621 1326.76C748.213 1313.39 732.364 1298.37 713.246 1292C686.238 1283 653.444 1280.72 620.692 1281.09C601.122 1281.32 581.568 1282.49 563.272 1283.75C559.208 1284.03 555.206 1284.31 551.28 1284.59C546 1284.96 540.857 1285.33 535.884 1285.66C508.888 1287.46 483.19 1291.69 457.692 1296.96C434.313 1301.79 411.101 1307.48 387.209 1312.97C375.074 1315.75 366.374 1315.77 356.315 1324.55Z" fill="#149648"/>
+<path d="M1025.49 1468.26C1022.84 1502.72 1003.5 1540.75 1003.5 1575.49L1001.5 1583.92C1018.93 1597.12 1038.3 1612.18 1061.53 1632.86C1119.85 1677.37 1164.34 1721.87 1200.45 1764.86C1200.36 1725.21 1198.58 1686.25 1188.32 1646.81C1178.35 1608.5 1168.38 1570.93 1141.69 1534.41C1127.34 1514.76 1111.69 1493.43 1088.68 1475.83C1070.3 1461.78 1043.56 1440.01 1028 1424.99L1025.49 1468.26Z" fill="#149648"/>
+<path d="M563.272 1283.75C570.478 1231.69 585.536 1211.86 632.823 1193.87C526.696 1214.39 485.324 1235.38 457.692 1296.96C483.19 1291.69 508.888 1287.46 535.884 1285.66C540.857 1285.33 546 1284.96 551.28 1284.59C555.206 1284.31 559.208 1284.03 563.272 1283.75Z" fill="#149648"/>
+<path d="M563.272 1283.75C581.568 1282.49 601.122 1281.32 620.692 1281.09L632.823 1193.87C585.536 1211.86 570.478 1231.69 563.272 1283.75Z" fill="#149648"/>
+</mask>
+<g mask="url(#mask1_1_164)">
+<path d="M356.315 1324.55C319.636 1356.58 316.043 1397.21 316.043 1443.16C287.403 1544.95 262.6 1589.58 192.817 1632.86L0 1764.23V1891.49V2245H1115.09H1660L1625 2148.49L1552.39 2107.04C1354.12 2071.8 1338.67 1929.43 1200.45 1764.86C1164.34 1721.87 1119.85 1677.37 1061.53 1632.86C1038.3 1612.18 1018.93 1597.12 1001.5 1583.92C961.091 1553.31 931.091 1532.69 887.574 1475.16C848.351 1423.3 810.491 1371.16 762.621 1326.76C748.213 1313.39 732.364 1298.37 713.246 1292C686.238 1283 653.444 1280.72 620.692 1281.09C601.122 1281.32 581.568 1282.49 563.272 1283.75C559.208 1284.03 555.206 1284.31 551.28 1284.59C546 1284.96 540.857 1285.33 535.884 1285.66C508.888 1287.46 483.19 1291.69 457.692 1296.96C434.313 1301.79 411.101 1307.48 387.209 1312.97C375.074 1315.75 366.374 1315.77 356.315 1324.55Z" fill="#67310A"/>
+<path d="M1025.49 1468.26C1022.84 1502.72 1003.5 1540.75 1003.5 1575.49L1001.5 1583.92C1018.93 1597.12 1038.3 1612.18 1061.53 1632.86C1119.85 1677.37 1164.34 1721.87 1200.45 1764.86C1200.36 1725.21 1198.58 1686.25 1188.32 1646.81C1178.35 1608.5 1168.38 1570.93 1141.69 1534.41C1127.34 1514.76 1111.69 1493.43 1088.68 1475.83C1070.3 1461.78 1043.56 1440.01 1028 1424.99L1025.49 1468.26Z" fill="#67310A"/>
+<path d="M563.272 1283.75C570.478 1231.69 585.536 1211.86 632.823 1193.87C526.696 1214.39 485.324 1235.38 457.692 1296.96C483.19 1291.69 508.888 1287.46 535.884 1285.66C540.857 1285.33 546 1284.96 551.28 1284.59C555.206 1284.31 559.208 1284.03 563.272 1283.75Z" fill="#67310A"/>
+<path d="M563.272 1283.75C581.568 1282.49 601.122 1281.32 620.692 1281.09L632.823 1193.87C585.536 1211.86 570.478 1231.69 563.272 1283.75Z" fill="#67310A"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M468.474 1515.05C469.903 1503.26 480.618 1494.86 492.405 1496.29C544.544 1502.61 590.186 1526.29 631.669 1549.66C730.185 1605.16 819.711 1673.22 903.061 1748.25C929.892 1772.41 955.688 1796.85 981.249 1821.08C1034.09 1871.15 1085.92 1920.27 1143.8 1963.87C1166.88 1981.26 1180.29 1989.09 1203.35 1992.93C1215.07 1994.89 1222.98 2005.96 1221.03 2017.68C1219.07 2029.39 1208 2037.3 1196.28 2035.35C1163.22 2029.84 1143.21 2017.26 1117.92 1998.21C1058.13 1953.17 1003.23 1901.17 949.388 1850.17C924.259 1826.36 899.357 1802.78 874.292 1780.21C792.682 1706.75 705.702 1640.73 610.562 1587.12C569.233 1563.84 530.126 1544.18 487.231 1538.98C475.443 1537.55 467.046 1526.84 468.474 1515.05ZM464.492 1597.32C473.843 1604.64 475.491 1618.15 468.172 1627.5C458.102 1640.37 442.005 1659.26 423.817 1680.59C408.346 1698.74 391.362 1718.67 375.286 1738.17C357.397 1759.88 340.205 1781.55 326.196 1801.07C311.915 1820.97 301.951 1837.25 297.462 1848.47C293.052 1859.5 280.54 1864.86 269.515 1860.45C258.49 1856.04 253.128 1843.53 257.538 1832.5C264.092 1816.12 276.715 1796.26 291.265 1776C306.087 1755.35 323.97 1732.83 342.102 1710.83C359.505 1689.71 376.794 1669.45 392.164 1651.44C409.532 1631.08 424.449 1613.6 434.31 1601C441.628 1591.65 455.141 1590 464.492 1597.32ZM504.204 1644.17H515.647C537.998 1644.17 560.444 1653.54 579.013 1662.94C588.595 1667.79 597.97 1673.09 606.492 1677.92L606.734 1678.05C615.356 1682.94 622.956 1687.24 629.863 1690.7C640.483 1696.01 644.788 1708.92 639.478 1719.54C634.167 1730.16 621.253 1734.47 610.632 1729.16C602.714 1725.2 594.272 1720.42 586.087 1715.78L585.296 1715.33C576.665 1710.44 568.142 1705.63 559.6 1701.31C546.946 1694.9 535.813 1690.43 526.267 1688.4L488.834 1744C482.203 1753.85 468.842 1756.45 458.992 1749.82C449.143 1743.19 446.534 1729.83 453.165 1719.98L504.204 1644.17ZM628.809 1839C619.694 1835.71 610.352 1835.49 596.861 1844.49C575.677 1858.61 520.46 1893.77 463.526 1925.48C435.078 1941.33 405.83 1956.52 379.992 1967.81C367.077 1973.46 354.7 1978.27 343.496 1981.7C332.588 1985.03 321.47 1987.49 311.5 1987.49C299.626 1987.49 290 1977.86 290 1965.99C290 1954.11 299.626 1944.49 311.5 1944.49C315.166 1944.49 321.518 1943.45 330.908 1940.58C340 1937.8 350.747 1933.67 362.771 1928.41C386.812 1917.9 414.711 1903.45 442.602 1887.91C498.345 1856.87 552.575 1822.33 573.009 1808.71C597.512 1792.37 621.072 1790.5 643.382 1798.54C663.136 1805.66 680.927 1820.37 696.183 1832.99L696.531 1833.27C706.772 1841.74 717.846 1849.28 729.894 1857.48C732.462 1859.23 735.074 1861.01 737.732 1862.83C752.371 1872.88 768.058 1884.1 781.847 1897.89C818.37 1934.41 854.044 1975.11 886.955 2013.83C897.981 2026.8 908.36 2039.5 918.503 2051.92C947.304 2087.17 974.193 2120.08 1008.55 2150.14C1013.83 2154.76 1019.26 2159.87 1024.5 2164.82L1024.84 2165.14C1030.08 2170.08 1035.2 2174.92 1040.43 2179.57C1051.28 2189.22 1061.22 2196.82 1070.47 2201.22C1078.01 2204.82 1085.68 2208.15 1093.76 2211.65C1094.75 2212.08 1095.75 2212.52 1096.76 2212.96C1105.8 2216.89 1115.29 2221.06 1124.7 2225.77C1135.32 2231.08 1139.63 2243.99 1134.32 2254.61C1129.01 2265.23 1116.09 2269.54 1105.47 2264.23C1097.19 2260.09 1088.64 2256.32 1079.62 2252.39C1078.63 2251.96 1077.63 2251.53 1076.63 2251.1C1068.64 2247.63 1060.25 2243.99 1051.98 2240.05C1037.07 2232.95 1023.44 2222.01 1011.85 2211.69C1006.15 2206.62 1000.62 2201.4 995.506 2196.58L994.996 2196.1C989.642 2191.05 984.807 2186.5 980.237 2182.5C942.929 2149.86 912.84 2113.02 883.411 2076.98C873.678 2065.06 864.018 2053.24 854.192 2041.68C821.481 2003.19 786.707 1963.56 751.441 1928.3C740.672 1917.53 727.838 1908.19 713.402 1898.29C711.06 1896.68 708.661 1895.05 706.222 1893.39C694.135 1885.17 681.067 1876.28 669.129 1866.41C652.368 1852.55 640.33 1843.15 628.809 1839ZM636.621 1956.58C640.376 1967.85 634.288 1980.02 623.023 1983.78C600.982 1991.13 580.199 2001.28 557.842 2012.19C556.559 2012.82 555.27 2013.45 553.976 2014.08C530.596 2025.49 505.499 2037.51 477.955 2045.68C476.364 2046.15 474.812 2046.61 473.299 2047.06C453.844 2052.8 440.538 2056.73 426.996 2065.76C417.116 2072.34 403.768 2069.67 397.181 2059.79C390.595 2049.91 393.264 2036.56 403.144 2029.98C422.376 2017.16 441.828 2011.46 460.278 2006.06C462.104 2005.52 463.921 2004.99 465.726 2004.46C489.43 1997.43 511.589 1986.92 535.122 1975.44C536.606 1974.71 538.097 1973.98 539.595 1973.25C561.375 1962.61 584.57 1951.27 609.426 1942.99C620.69 1939.23 632.866 1945.32 636.621 1956.58Z" fill="#67310A"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M468.474 1515.05C469.903 1503.26 480.618 1494.86 492.405 1496.29C544.544 1502.61 590.186 1526.29 631.669 1549.66C730.185 1605.16 819.711 1673.22 903.061 1748.25C929.892 1772.41 955.688 1796.85 981.249 1821.08C1034.09 1871.15 1085.92 1920.27 1143.8 1963.87C1166.88 1981.26 1180.29 1989.09 1203.35 1992.93C1215.07 1994.89 1222.98 2005.96 1221.03 2017.68C1219.07 2029.39 1208 2037.3 1196.28 2035.35C1163.22 2029.84 1143.21 2017.26 1117.92 1998.21C1058.13 1953.17 1003.23 1901.17 949.388 1850.17C924.259 1826.36 899.357 1802.78 874.292 1780.21C792.682 1706.75 705.702 1640.73 610.562 1587.12C569.233 1563.84 530.126 1544.18 487.231 1538.98C475.443 1537.55 467.046 1526.84 468.474 1515.05ZM464.492 1597.32C473.843 1604.64 475.491 1618.15 468.172 1627.5C458.102 1640.37 442.005 1659.26 423.817 1680.59C408.346 1698.74 391.362 1718.67 375.286 1738.17C357.397 1759.88 340.205 1781.55 326.196 1801.07C311.915 1820.97 301.951 1837.25 297.462 1848.47C293.052 1859.5 280.54 1864.86 269.515 1860.45C258.49 1856.04 253.128 1843.53 257.538 1832.5C264.092 1816.12 276.715 1796.26 291.265 1776C306.087 1755.35 323.97 1732.83 342.102 1710.83C359.505 1689.71 376.794 1669.45 392.164 1651.44C409.532 1631.08 424.449 1613.6 434.31 1601C441.628 1591.65 455.141 1590 464.492 1597.32ZM504.204 1644.17H515.647C537.998 1644.17 560.444 1653.54 579.013 1662.94C588.595 1667.79 597.97 1673.09 606.492 1677.92L606.734 1678.05C615.356 1682.94 622.956 1687.24 629.863 1690.7C640.483 1696.01 644.788 1708.92 639.478 1719.54C634.167 1730.16 621.253 1734.47 610.632 1729.16C602.714 1725.2 594.272 1720.42 586.087 1715.78L585.296 1715.33C576.665 1710.44 568.142 1705.63 559.6 1701.31C546.946 1694.9 535.813 1690.43 526.267 1688.4L488.834 1744C482.203 1753.85 468.842 1756.45 458.992 1749.82C449.143 1743.19 446.534 1729.83 453.165 1719.98L504.204 1644.17ZM628.809 1839C619.694 1835.71 610.352 1835.49 596.861 1844.49C575.677 1858.61 520.46 1893.77 463.526 1925.48C435.078 1941.33 405.83 1956.52 379.992 1967.81C367.077 1973.46 354.7 1978.27 343.496 1981.7C332.588 1985.03 321.47 1987.49 311.5 1987.49C299.626 1987.49 290 1977.86 290 1965.99C290 1954.11 299.626 1944.49 311.5 1944.49C315.166 1944.49 321.518 1943.45 330.908 1940.58C340 1937.8 350.747 1933.67 362.771 1928.41C386.812 1917.9 414.711 1903.45 442.602 1887.91C498.345 1856.87 552.575 1822.33 573.009 1808.71C597.512 1792.37 621.072 1790.5 643.382 1798.54C663.136 1805.66 680.927 1820.37 696.183 1832.99L696.531 1833.27C706.772 1841.74 717.846 1849.28 729.894 1857.48C732.462 1859.23 735.074 1861.01 737.732 1862.83C752.371 1872.88 768.058 1884.1 781.847 1897.89C818.37 1934.41 854.044 1975.11 886.955 2013.83C897.981 2026.8 908.36 2039.5 918.503 2051.92C947.304 2087.17 974.193 2120.08 1008.55 2150.14C1013.83 2154.76 1019.26 2159.87 1024.5 2164.82L1024.84 2165.14C1030.08 2170.08 1035.2 2174.92 1040.43 2179.57C1051.28 2189.22 1061.22 2196.82 1070.47 2201.22C1078.01 2204.82 1085.68 2208.15 1093.76 2211.65C1094.75 2212.08 1095.75 2212.52 1096.76 2212.96C1105.8 2216.89 1115.29 2221.06 1124.7 2225.77C1135.32 2231.08 1139.63 2243.99 1134.32 2254.61C1129.01 2265.23 1116.09 2269.54 1105.47 2264.23C1097.19 2260.09 1088.64 2256.32 1079.62 2252.39C1078.63 2251.96 1077.63 2251.53 1076.63 2251.1C1068.64 2247.63 1060.25 2243.99 1051.98 2240.05C1037.07 2232.95 1023.44 2222.01 1011.85 2211.69C1006.15 2206.62 1000.62 2201.4 995.506 2196.58L994.996 2196.1C989.642 2191.05 984.807 2186.5 980.237 2182.5C942.929 2149.86 912.84 2113.02 883.411 2076.98C873.678 2065.06 864.018 2053.24 854.192 2041.68C821.481 2003.19 786.707 1963.56 751.441 1928.3C740.672 1917.53 727.838 1908.19 713.402 1898.29C711.06 1896.68 708.661 1895.05 706.222 1893.39C694.135 1885.17 681.067 1876.28 669.129 1866.41C652.368 1852.55 640.33 1843.15 628.809 1839ZM636.621 1956.58C640.376 1967.85 634.288 1980.02 623.023 1983.78C600.982 1991.13 580.199 2001.28 557.842 2012.19C556.559 2012.82 555.27 2013.45 553.976 2014.08C530.596 2025.49 505.499 2037.51 477.955 2045.68C476.364 2046.15 474.812 2046.61 473.299 2047.06C453.844 2052.8 440.538 2056.73 426.996 2065.76C417.116 2072.34 403.768 2069.67 397.181 2059.79C390.595 2049.91 393.264 2036.56 403.144 2029.98C422.376 2017.16 441.828 2011.46 460.278 2006.06C462.104 2005.52 463.921 2004.99 465.726 2004.46C489.43 1997.43 511.589 1986.92 535.122 1975.44C536.606 1974.71 538.097 1973.98 539.595 1973.25C561.375 1962.61 584.57 1951.27 609.426 1942.99C620.69 1939.23 632.866 1945.32 636.621 1956.58Z" fill="white" fill-opacity="0.2"/>
+</g>
+<mask id="mask2_1_164" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="1012" y="560" width="374" height="552">
+<path d="M1014.16 626.175C1016.99 630.156 1022.2 631.64 1026.7 629.744L1070.01 611.488C1076.3 608.836 1082.95 607.133 1089.74 606.434L1119.25 603.397C1137.78 601.49 1156.48 604.353 1173.58 611.715C1182.49 615.547 1190.84 620.548 1198.43 626.586L1202.07 629.489L1210.52 636.063C1217.76 641.692 1227.2 643.647 1236.08 641.356L1241.55 639.943C1248.61 638.121 1254.12 632.6 1255.94 625.535C1257.26 620.384 1256.47 614.919 1253.76 610.346L1247.17 599.254C1241.85 590.292 1233.92 583.172 1224.43 578.848L1214.29 574.224C1208.12 571.41 1201.64 569.331 1194.98 568.028L1179.76 565.051C1165.95 562.349 1151.91 560.989 1137.84 560.989H1115.42C1110.48 560.989 1105.56 561.447 1100.71 562.356C1089.69 564.421 1079.24 568.782 1070.02 575.155L1043.5 593.489L1016.82 611.523C1011.98 614.796 1010.78 621.41 1014.16 626.175Z" fill="black"/>
+<path d="M1074.53 699.293C1077.59 701.26 1081.48 701.38 1084.66 699.606L1112.8 683.882C1113.26 683.62 1113.75 683.395 1114.26 683.208L1115.47 682.758C1122.42 680.177 1129.57 686.033 1128.42 693.354C1128.14 695.079 1128.34 696.844 1128.99 698.465L1135 713.489L1138.03 719.552C1139.85 723.19 1143.57 725.489 1147.64 725.489C1150.13 725.489 1152.55 724.619 1154.48 723.029L1158.06 720.07C1160.93 717.698 1165.08 717.689 1167.96 720.047L1168.21 720.248C1168.4 720.408 1168.61 720.55 1168.83 720.673C1172.09 722.485 1171.59 727.322 1168.03 728.428L1163.2 729.926C1163.07 729.968 1162.93 729.998 1162.79 730.016C1160.17 730.358 1159.86 734.034 1162.39 734.804L1162.64 734.88C1162.88 734.952 1163.13 734.989 1163.37 734.989H1175.7C1178.7 734.989 1181.51 733.505 1183.21 731.025C1185.46 727.732 1185.31 723.357 1182.84 720.23L1181.15 718.097C1178.83 715.171 1177.91 711.382 1178.62 707.719L1179.49 703.192C1180.16 699.769 1180.03 696.239 1179.11 692.873L1173.64 672.698C1172.89 669.931 1171.5 667.381 1169.57 665.255L1156.94 651.291C1155.21 649.38 1152.14 649.646 1150.76 651.824C1149.24 654.231 1145.74 654.245 1144.2 651.85L1144.06 651.633C1143.39 650.594 1142.28 649.916 1141.06 649.79L1127.72 648.429C1121.7 647.815 1115.63 648.926 1110.21 651.632L1091.5 660.989L1074.05 672.157C1071.84 673.569 1072.84 676.989 1075.46 676.989C1075.82 676.989 1076.17 676.917 1076.49 676.778L1112.76 661.303C1113.25 661.096 1113.77 660.989 1114.3 660.989H1115.67C1120 660.989 1120.84 667.144 1116.66 668.304C1116.22 668.426 1115.81 668.628 1115.45 668.898L1108.17 674.276C1105.73 676.081 1103.13 677.672 1100.42 679.03L1093.68 682.401C1092.23 683.122 1090.69 683.618 1089.1 683.873L1076.71 685.855C1071.77 686.645 1069.15 692.127 1071.63 696.468C1072.2 697.467 1073.01 698.314 1073.97 698.936L1074.53 699.293Z" fill="black"/>
+<path d="M1292.8 752.059C1294.02 750.089 1296.6 749.478 1298.56 750.695L1303.28 753.612C1304.66 754.468 1305.5 755.978 1305.5 757.604V758.513C1305.5 762.65 1300.29 764.477 1297.71 761.247C1297.57 761.075 1297.42 760.914 1297.26 760.765L1293.53 757.322C1292.06 755.967 1291.76 753.761 1292.8 752.059Z" fill="black"/>
+<path d="M1280.73 728.14C1278.3 729.853 1279.83 733.681 1282.77 733.245C1283.83 733.088 1284.89 733.542 1285.5 734.419L1286.1 735.275C1287.23 736.89 1289.28 737.585 1291.16 736.991L1293.85 736.14C1296.17 735.409 1298.69 735.72 1300.76 736.993L1307.27 740.999C1309.41 742.318 1311.37 743.933 1312.91 745.919C1315.12 748.76 1317.5 752.275 1317.5 753.989C1317.5 756.636 1320.59 758.946 1322.54 757.158L1325.25 754.675C1325.74 754.228 1326.08 753.646 1326.22 753.001C1327.59 746.705 1329.88 735.264 1329.5 732.989C1329.21 731.279 1325.19 725.747 1321.52 721.019C1318.91 717.667 1315.55 714.985 1311.78 713.04L1302.96 708.499C1301.7 707.849 1300.24 707.696 1298.87 708.069L1288.01 711.031C1285.49 711.718 1285.48 715.29 1288 715.989C1292.52 717.151 1292.46 723.593 1287.92 724.674L1285.2 725.322C1284.74 725.432 1284.3 725.629 1283.91 725.903L1280.73 728.14Z" fill="black"/>
+<path d="M1315.03 657.487C1307.62 666.502 1312.2 680.166 1323.55 682.898C1325.17 683.289 1326.72 683.936 1328.15 684.814L1335.92 689.612C1342.55 693.7 1351.23 690.006 1352.87 682.397C1353.28 680.491 1353.19 678.51 1352.61 676.649L1344.11 649.449C1343.71 648.152 1343.08 646.935 1342.26 645.852C1337.44 639.499 1327.82 639.69 1323.26 646.231L1317.5 654.489L1315.03 657.487Z" fill="black"/>
+<path d="M1240.05 846.668C1247.42 848.664 1250.15 857.689 1245.13 863.445L1242.93 865.973C1238.72 870.803 1238.86 878.042 1243.27 882.698L1249.76 889.565C1251.89 891.813 1253.43 894.548 1254.26 897.53L1255.33 901.391C1256.92 907.1 1254.61 913.177 1249.63 916.389C1245.27 919.202 1239.68 919.292 1235.31 916.49C1227.85 911.707 1219.5 905.965 1219.5 904.489C1219.5 903.958 1218.91 902.428 1217.97 900.321C1212.03 887.022 1216.01 872.977 1223.5 860.489C1224.2 859.329 1226.16 855.645 1228.14 851.877C1230.41 847.572 1235.35 845.396 1240.05 846.668Z" fill="black"/>
+<path d="M1279.24 907.106C1274.75 907.314 1271 903.734 1271 899.243C1271 895.581 1273.53 892.403 1277.09 891.576L1305.5 884.989C1313.13 883.4 1321.07 885.183 1327.28 889.878L1337.88 897.886C1339.21 898.895 1340 900.473 1340 902.148C1340 905.097 1337.61 907.489 1334.66 907.489H1330.16C1329.06 907.489 1327.97 907.304 1326.93 906.943L1306.86 899.962C1305.96 899.649 1305.01 899.489 1304.06 899.489C1302.08 899.489 1300.16 900.176 1298.64 901.434L1296.5 903.19C1293.9 905.332 1290.68 906.573 1287.32 906.73L1279.24 907.106Z" fill="black"/>
+<path d="M1356.82 1063.16C1358.74 1057.02 1356.73 1050.32 1351.75 1046.24L1355 1057.49L1356.56 1063.99L1356.82 1063.16Z" fill="black"/>
+<path d="M1246 1006.99L1281.5 989.989L1298.23 985.983C1310.51 983.043 1323.36 983.528 1335.38 987.383C1340.77 989.114 1346.36 990.173 1352.01 990.538L1359 990.989L1363 1020.99L1367.5 1022.49L1365.92 1002.74C1365.09 992.33 1357.22 983.857 1346.91 982.252L1346.5 982.189C1343.54 981.728 1340.71 980.626 1338.21 978.962C1334.81 976.697 1330.82 975.489 1326.74 975.489H1314.99C1308.37 975.489 1301.81 976.591 1295.56 978.75L1289.98 980.679C1281.7 983.538 1273.86 987.533 1266.68 992.547L1246 1006.99Z" fill="black"/>
+<path d="M1337.94 999.379C1344.29 1001.66 1349.25 1006.73 1351.38 1013.12C1353.65 1019.93 1352.45 1027.42 1348.18 1033.19L1347.95 1033.49L1343.5 1039.49L1351.75 1046.24C1353.91 1039.42 1356.69 1032.81 1360.06 1026.5L1363 1020.99L1359 990.989L1325.97 995.666C1327.65 995.88 1329.3 996.278 1330.9 996.851L1337.94 999.379Z" fill="black"/>
+<path d="M1335.38 987.383C1323.36 983.528 1310.51 983.043 1298.23 985.983L1281.5 989.989L1325.97 995.666L1359 990.989L1352.01 990.538C1346.36 990.173 1340.77 989.114 1335.38 987.383Z" fill="black"/>
+<path d="M1281.5 989.989L1246 1006.99L1325.97 995.666L1281.5 989.989Z" fill="black"/>
+<path d="M1243.29 1041.99C1247.4 1041.99 1251.16 1039.67 1253 1035.99L1244 1033.49L1235 1030.99L1230.54 1041.99H1243.29Z" fill="black"/>
+<path d="M1292.5 1090.99H1343.5C1354.21 1090.99 1360.93 1079.43 1355.64 1070.12L1355 1068.99L1328.5 1059.99L1287 1049.49L1267.49 1046.91C1264.16 1046.47 1262.58 1050.89 1265.45 1052.65C1265.81 1052.87 1266.13 1053.17 1266.37 1053.52L1292.5 1090.99Z" fill="black"/>
+<path d="M1235 1030.99L1246 1006.99L1266.68 992.547C1273.86 987.533 1281.7 983.538 1289.98 980.679L1295.56 978.75C1301.81 976.591 1308.37 975.489 1314.99 975.489H1326.74C1330.82 975.489 1334.81 976.697 1338.21 978.962C1340.71 980.626 1343.54 981.728 1346.5 982.189L1346.91 982.252C1357.22 983.857 1365.09 992.33 1365.92 1002.74L1367.5 1022.49L1365.02 1039.31C1363.68 1048.39 1363.54 1057.61 1364.6 1066.73C1365.2 1071.89 1366.18 1077.01 1367.54 1082.03L1368.19 1084.42C1370.72 1093.77 1374.23 1102.83 1378.66 1111.45V1111.45C1378.92 1111.95 1379.67 1111.71 1379.6 1111.16L1379.5 1110.35C1377.85 1097.55 1378.52 1084.55 1381.5 1071.99L1382.58 1064.44C1385.51 1043.88 1385.9 1023.05 1383.71 1002.4L1382.07 986.851C1381.69 983.282 1381.01 979.752 1380.05 976.295C1377.07 965.605 1371.38 955.866 1363.53 948.018L1355.13 939.623C1353.39 937.878 1351.38 936.413 1349.19 935.282L1342.75 931.967C1338.62 929.837 1333.63 930.239 1329.89 933.003C1326.53 935.486 1322.14 936.081 1318.24 934.582L1314.79 933.253C1312.61 932.417 1310.31 931.989 1307.98 931.989H1300.5C1283.49 929.742 1266.27 934.128 1252.4 944.237L1250 945.989L1227.5 962.489L1203.34 984.147C1200.12 987.034 1197.21 990.245 1194.65 993.729C1188.96 1001.47 1185.11 1010.4 1183.41 1019.85L1180.5 1035.99L1179.19 1044.5C1178.13 1051.37 1173.73 1057.27 1167.45 1060.24C1162.36 1062.64 1156.53 1062.89 1151.26 1060.94L1137.65 1055.92C1136.9 1055.64 1136.22 1055.17 1135.69 1054.56L1132.74 1051.19C1130.14 1048.22 1125.31 1050.75 1126.27 1054.57C1126.42 1055.17 1126.72 1055.73 1127.14 1056.19L1143.67 1074.28C1149.76 1080.95 1157.64 1085.72 1166.36 1088.03C1173.68 1089.98 1181.36 1090.12 1188.74 1088.47L1202.19 1085.46C1205.05 1084.81 1207.8 1083.76 1210.35 1082.32C1218.06 1077.99 1223.46 1070.48 1225.13 1061.8L1226.63 1054.02C1227.21 1051.01 1228.08 1048.06 1229.23 1045.21L1230.54 1041.99L1235 1030.99Z" fill="black"/>
+</mask>
+<g mask="url(#mask2_1_164)">
+<path d="M1014.16 626.175C1016.99 630.156 1022.2 631.64 1026.7 629.744L1070.01 611.488C1076.3 608.836 1082.95 607.133 1089.74 606.434L1119.25 603.397C1137.78 601.49 1156.48 604.353 1173.58 611.715C1182.49 615.547 1190.84 620.548 1198.43 626.586L1202.07 629.489L1210.52 636.063C1217.76 641.692 1227.2 643.647 1236.08 641.356L1241.55 639.943C1248.61 638.121 1254.12 632.6 1255.94 625.535C1257.26 620.384 1256.47 614.919 1253.76 610.346L1247.17 599.254C1241.85 590.292 1233.92 583.172 1224.43 578.848L1214.29 574.224C1208.12 571.41 1201.64 569.331 1194.98 568.028L1179.76 565.051C1165.95 562.349 1151.91 560.989 1137.84 560.989H1115.42C1110.48 560.989 1105.56 561.447 1100.71 562.356C1089.69 564.421 1079.24 568.782 1070.02 575.155L1043.5 593.489L1016.82 611.523C1011.98 614.796 1010.78 621.41 1014.16 626.175Z" fill="black"/>
+<path d="M1074.53 699.293C1077.59 701.26 1081.48 701.38 1084.66 699.606L1112.8 683.882C1113.26 683.62 1113.75 683.395 1114.26 683.208L1115.47 682.758C1122.42 680.177 1129.57 686.033 1128.42 693.354C1128.14 695.079 1128.34 696.844 1128.99 698.465L1135 713.489L1138.03 719.552C1139.85 723.19 1143.57 725.489 1147.64 725.489C1150.13 725.489 1152.55 724.619 1154.48 723.029L1158.06 720.07C1160.93 717.698 1165.08 717.689 1167.96 720.047L1168.21 720.248C1168.4 720.408 1168.61 720.55 1168.83 720.673C1172.09 722.485 1171.59 727.322 1168.03 728.428L1163.2 729.926C1163.07 729.968 1162.93 729.998 1162.79 730.016C1160.17 730.358 1159.86 734.034 1162.39 734.804L1162.64 734.88C1162.88 734.952 1163.13 734.989 1163.37 734.989H1175.7C1178.7 734.989 1181.51 733.505 1183.21 731.025C1185.46 727.732 1185.31 723.357 1182.84 720.23L1181.15 718.097C1178.83 715.171 1177.91 711.382 1178.62 707.719L1179.49 703.192C1180.16 699.769 1180.03 696.239 1179.11 692.873L1173.64 672.698C1172.89 669.931 1171.5 667.381 1169.57 665.255L1156.94 651.291C1155.21 649.38 1152.14 649.646 1150.76 651.824C1149.24 654.231 1145.74 654.245 1144.2 651.85L1144.06 651.633C1143.39 650.594 1142.28 649.916 1141.06 649.79L1127.72 648.429C1121.7 647.815 1115.63 648.926 1110.21 651.632L1091.5 660.989L1074.05 672.157C1071.84 673.569 1072.84 676.989 1075.46 676.989C1075.82 676.989 1076.17 676.917 1076.49 676.778L1112.76 661.303C1113.25 661.096 1113.77 660.989 1114.3 660.989H1115.67C1120 660.989 1120.84 667.144 1116.66 668.304C1116.22 668.426 1115.81 668.628 1115.45 668.898L1108.17 674.276C1105.73 676.081 1103.13 677.672 1100.42 679.03L1093.68 682.401C1092.23 683.122 1090.69 683.618 1089.1 683.873L1076.71 685.855C1071.77 686.645 1069.15 692.127 1071.63 696.468C1072.2 697.467 1073.01 698.314 1073.97 698.936L1074.53 699.293Z" fill="black"/>
+<path d="M1292.8 752.059C1294.02 750.089 1296.6 749.478 1298.56 750.695L1303.28 753.612C1304.66 754.468 1305.5 755.978 1305.5 757.604V758.513C1305.5 762.65 1300.29 764.477 1297.71 761.247C1297.57 761.075 1297.42 760.914 1297.26 760.765L1293.53 757.322C1292.06 755.967 1291.76 753.761 1292.8 752.059Z" fill="black"/>
+<path d="M1280.73 728.14C1278.3 729.853 1279.83 733.681 1282.77 733.245C1283.83 733.088 1284.89 733.542 1285.5 734.419L1286.1 735.275C1287.23 736.89 1289.28 737.585 1291.16 736.991L1293.85 736.14C1296.17 735.409 1298.69 735.72 1300.76 736.993L1307.27 740.999C1309.41 742.318 1311.37 743.933 1312.91 745.919C1315.12 748.76 1317.5 752.275 1317.5 753.989C1317.5 756.636 1320.59 758.946 1322.54 757.158L1325.25 754.675C1325.74 754.228 1326.08 753.646 1326.22 753.001C1327.59 746.705 1329.88 735.264 1329.5 732.989C1329.21 731.279 1325.19 725.747 1321.52 721.019C1318.91 717.667 1315.55 714.985 1311.78 713.04L1302.96 708.499C1301.7 707.849 1300.24 707.696 1298.87 708.069L1288.01 711.031C1285.49 711.718 1285.48 715.29 1288 715.989C1292.52 717.151 1292.46 723.593 1287.92 724.674L1285.2 725.322C1284.74 725.432 1284.3 725.629 1283.91 725.903L1280.73 728.14Z" fill="black"/>
+<path d="M1315.03 657.487C1307.62 666.502 1312.2 680.166 1323.55 682.898C1325.17 683.289 1326.72 683.936 1328.15 684.814L1335.92 689.612C1342.55 693.7 1351.23 690.006 1352.87 682.397C1353.28 680.491 1353.19 678.51 1352.61 676.649L1344.11 649.449C1343.71 648.152 1343.08 646.935 1342.26 645.852C1337.44 639.499 1327.82 639.69 1323.26 646.231L1317.5 654.489L1315.03 657.487Z" fill="black"/>
+<path d="M1240.05 846.668C1247.42 848.664 1250.15 857.689 1245.13 863.445L1242.93 865.973C1238.72 870.803 1238.86 878.042 1243.27 882.698L1249.76 889.565C1251.89 891.813 1253.43 894.548 1254.26 897.53L1255.33 901.391C1256.92 907.1 1254.61 913.177 1249.63 916.389C1245.27 919.202 1239.68 919.292 1235.31 916.49C1227.85 911.707 1219.5 905.965 1219.5 904.489C1219.5 903.958 1218.91 902.428 1217.97 900.321C1212.03 887.022 1216.01 872.977 1223.5 860.489C1224.2 859.329 1226.16 855.645 1228.14 851.877C1230.41 847.572 1235.35 845.396 1240.05 846.668Z" fill="black"/>
+<path d="M1279.24 907.106C1274.75 907.314 1271 903.734 1271 899.243C1271 895.581 1273.53 892.403 1277.09 891.576L1305.5 884.989C1313.13 883.4 1321.07 885.183 1327.28 889.878L1337.88 897.886C1339.21 898.895 1340 900.473 1340 902.148C1340 905.097 1337.61 907.489 1334.66 907.489H1330.16C1329.06 907.489 1327.97 907.304 1326.93 906.943L1306.86 899.962C1305.96 899.649 1305.01 899.489 1304.06 899.489C1302.08 899.489 1300.16 900.176 1298.64 901.434L1296.5 903.19C1293.9 905.332 1290.68 906.573 1287.32 906.73L1279.24 907.106Z" fill="black"/>
+<path d="M1356.82 1063.16C1358.74 1057.02 1356.73 1050.32 1351.75 1046.24L1355 1057.49L1356.56 1063.99L1356.82 1063.16Z" fill="black"/>
+<path d="M1246 1006.99L1281.5 989.989L1298.23 985.983C1310.51 983.043 1323.36 983.528 1335.38 987.383C1340.77 989.114 1346.36 990.173 1352.01 990.538L1359 990.989L1363 1020.99L1367.5 1022.49L1365.92 1002.74C1365.09 992.33 1357.22 983.857 1346.91 982.252L1346.5 982.189C1343.54 981.728 1340.71 980.626 1338.21 978.962C1334.81 976.697 1330.82 975.489 1326.74 975.489H1314.99C1308.37 975.489 1301.81 976.591 1295.56 978.75L1289.98 980.679C1281.7 983.538 1273.86 987.533 1266.68 992.547L1246 1006.99Z" fill="black"/>
+<path d="M1337.94 999.379C1344.29 1001.66 1349.25 1006.73 1351.38 1013.12C1353.65 1019.93 1352.45 1027.42 1348.18 1033.19L1347.95 1033.49L1343.5 1039.49L1351.75 1046.24C1353.91 1039.42 1356.69 1032.81 1360.06 1026.5L1363 1020.99L1359 990.989L1325.97 995.666C1327.65 995.88 1329.3 996.278 1330.9 996.851L1337.94 999.379Z" fill="black"/>
+<path d="M1335.38 987.383C1323.36 983.528 1310.51 983.043 1298.23 985.983L1281.5 989.989L1325.97 995.666L1359 990.989L1352.01 990.538C1346.36 990.173 1340.77 989.114 1335.38 987.383Z" fill="black"/>
+<path d="M1281.5 989.989L1246 1006.99L1325.97 995.666L1281.5 989.989Z" fill="black"/>
+<path d="M1243.29 1041.99C1247.4 1041.99 1251.16 1039.67 1253 1035.99L1244 1033.49L1235 1030.99L1230.54 1041.99H1243.29Z" fill="black"/>
+<path d="M1292.5 1090.99H1343.5C1354.21 1090.99 1360.93 1079.43 1355.64 1070.12L1355 1068.99L1328.5 1059.99L1287 1049.49L1267.49 1046.91C1264.16 1046.47 1262.58 1050.89 1265.45 1052.65C1265.81 1052.87 1266.13 1053.17 1266.37 1053.52L1292.5 1090.99Z" fill="black"/>
+<path d="M1235 1030.99L1246 1006.99L1266.68 992.547C1273.86 987.533 1281.7 983.538 1289.98 980.679L1295.56 978.75C1301.81 976.591 1308.37 975.489 1314.99 975.489H1326.74C1330.82 975.489 1334.81 976.697 1338.21 978.962C1340.71 980.626 1343.54 981.728 1346.5 982.189L1346.91 982.252C1357.22 983.857 1365.09 992.33 1365.92 1002.74L1367.5 1022.49L1365.02 1039.31C1363.68 1048.39 1363.54 1057.61 1364.6 1066.73C1365.2 1071.89 1366.18 1077.01 1367.54 1082.03L1368.19 1084.42C1370.72 1093.77 1374.23 1102.83 1378.66 1111.45V1111.45C1378.92 1111.95 1379.67 1111.71 1379.6 1111.16L1379.5 1110.35C1377.85 1097.55 1378.52 1084.55 1381.5 1071.99L1382.58 1064.44C1385.51 1043.88 1385.9 1023.05 1383.71 1002.4L1382.07 986.851C1381.69 983.282 1381.01 979.752 1380.05 976.295C1377.07 965.605 1371.38 955.866 1363.53 948.018L1355.13 939.623C1353.39 937.878 1351.38 936.413 1349.19 935.282L1342.75 931.967C1338.62 929.837 1333.63 930.239 1329.89 933.003C1326.53 935.486 1322.14 936.081 1318.24 934.582L1314.79 933.253C1312.61 932.417 1310.31 931.989 1307.98 931.989H1300.5C1283.49 929.742 1266.27 934.128 1252.4 944.237L1250 945.989L1227.5 962.489L1203.34 984.147C1200.12 987.034 1197.21 990.245 1194.65 993.729C1188.96 1001.47 1185.11 1010.4 1183.41 1019.85L1180.5 1035.99L1179.19 1044.5C1178.13 1051.37 1173.73 1057.27 1167.45 1060.24C1162.36 1062.64 1156.53 1062.89 1151.26 1060.94L1137.65 1055.92C1136.9 1055.64 1136.22 1055.17 1135.69 1054.56L1132.74 1051.19C1130.14 1048.22 1125.31 1050.75 1126.27 1054.57C1126.42 1055.17 1126.72 1055.73 1127.14 1056.19L1143.67 1074.28C1149.76 1080.95 1157.64 1085.72 1166.36 1088.03C1173.68 1089.98 1181.36 1090.12 1188.74 1088.47L1202.19 1085.46C1205.05 1084.81 1207.8 1083.76 1210.35 1082.32C1218.06 1077.99 1223.46 1070.48 1225.13 1061.8L1226.63 1054.02C1227.21 1051.01 1228.08 1048.06 1229.23 1045.21L1230.54 1041.99L1235 1030.99Z" fill="black"/>
+</g>
+<mask id="mask3_1_164" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="361" y="148" width="1032" height="1265">
+<path d="M1017.21 352.163C1051.93 347.116 1087.34 350.205 1120.66 361.186L1192.4 384.831C1199.54 387.185 1205.56 392.109 1209.28 398.648L1216.06 410.57C1217.26 412.683 1219.5 413.989 1221.93 413.989C1225.97 413.989 1229.1 410.478 1228.65 406.47L1226 382.989V353.489L1222.08 315.533C1219.41 289.601 1210.15 264.782 1195.19 243.431C1176.55 216.828 1149.93 196.846 1119.17 186.378L1060.27 166.326C1006.59 148.052 949.225 143.351 893.287 152.643L831 162.989L729.352 183.216C666.02 195.819 607.41 225.696 560.005 269.542L502.519 322.713C465.285 357.152 435.961 399.26 416.708 446.183C389.876 511.58 361 582.49 361 584.489C361 586.994 368.74 674.287 373.831 731.314C374.938 743.72 374.3 756.194 371.936 768.422C364.958 804.515 373.218 841.887 394.757 871.678L446.602 943.384C456.287 956.779 461.5 972.886 461.5 989.415V1020.85C461.5 1036.14 448.809 1045.68 438 1056.49C434.5 1059.99 438 1090.49 438 1096.99C438 1102.19 483 1110.49 505.5 1113.99C521.386 1116.17 535.114 1126.28 541.537 1140.97C548.325 1156.5 554.989 1172.64 555.5 1176.99C556.08 1181.92 580.538 1187.15 602.708 1190.73C616.086 1192.89 628.959 1185.17 633.907 1172.55C634.963 1169.86 635.62 1167.02 635.856 1164.14L641.691 1092.96C644.219 1062.12 642.645 1031.07 637.009 1000.64V1000.64C636.022 995.305 633.606 990.34 630.019 986.271L590.714 941.687C576.063 925.067 565 905.601 558.22 884.508L556.374 878.763C552.482 866.654 550.5 854.013 550.5 841.294V830.827C550.5 817.476 553.807 804.333 560.125 792.572L567.383 779.06C577 761.157 595.678 749.989 616 749.989H624.947C643.22 749.989 661.398 752.621 678.921 757.804L698.625 763.631C714.968 768.465 729.907 777.162 742.181 788.986C756.756 803.028 767.015 820.943 771.749 840.621L790 916.489L801.111 983.554C803.012 995.024 802.254 1006.78 798.897 1017.91V1017.91C789.824 1047.99 789.59 1080.05 798.222 1110.27C802.058 1123.69 807.594 1136.57 814.695 1148.6L821.717 1160.49C843.273 1196.98 873.073 1227.92 908.732 1250.83L965 1286.99L1034 1344.42C1041.43 1350.6 1050.79 1353.99 1060.46 1353.99H1075.59C1080.51 1353.99 1085.08 1356.53 1087.67 1360.72C1089.19 1363.17 1091.42 1365.11 1094.06 1366.26L1163.58 1396.59C1182.39 1404.8 1202.45 1409.77 1222.92 1411.29L1230.74 1411.87C1253.93 1413.59 1277.19 1409.87 1298.68 1400.99C1327.81 1388.97 1352.38 1368.02 1368.85 1341.16L1371.35 1337.09C1377.1 1327.72 1381.78 1317.73 1385.29 1307.32C1390.4 1292.2 1393 1276.35 1393 1260.39V1235.49L1391.34 1221.58C1389.8 1208.7 1385.23 1196.38 1378 1185.61L1375.16 1181.38C1370.12 1173.89 1366.85 1165.34 1365.59 1156.39L1364.29 1147.17C1363.45 1141.19 1364.45 1135.1 1367.15 1129.7C1368.38 1127.24 1369.94 1124.96 1371.8 1122.93V1122.93C1373.4 1121.18 1373.67 1118.6 1372.48 1116.55L1370.46 1113.07C1368.51 1109.73 1365.8 1106.9 1362.55 1104.82L1360.66 1103.61C1357.99 1101.9 1354.87 1100.99 1351.69 1100.99C1349.23 1100.99 1346.8 1101.54 1344.57 1102.59L1333.82 1107.68C1331.28 1108.88 1328.89 1110.37 1326.68 1112.11C1322.61 1115.33 1319.25 1119.36 1316.82 1123.95L1313.64 1129.98C1311.91 1133.27 1311 1136.93 1311 1140.65V1143.3C1311 1149.06 1313.8 1154.47 1318.51 1157.79L1333.2 1168.19C1336.45 1170.48 1336.35 1175.34 1333 1177.49L1329.91 1179.27C1328.85 1179.88 1327.76 1180.41 1326.66 1180.88C1313.04 1186.66 1287.83 1195.41 1273.42 1192.07V1192.07L1238.5 1183.99L1203.34 1171.63C1190.5 1167.12 1180.46 1156.95 1176.12 1144.06L1173.58 1136.5C1169.05 1123.05 1156.44 1113.99 1142.25 1113.99C1132.29 1113.99 1122.85 1118.48 1116.58 1126.22L1094.75 1153.13C1091.75 1156.84 1087.23 1158.99 1082.46 1158.99C1071.66 1158.99 1064.03 1148.41 1067.44 1138.16L1070 1130.49L1096 1038.08C1097.33 1033.37 1098 1028.51 1098 1023.62C1098 998.236 1080.12 976.364 1055.24 971.32L1015.9 963.347C997.017 959.519 979.595 950.444 965.636 937.164L913.988 888.029C901.015 875.687 889.009 862.368 878.074 848.189L866.82 833.596C854.99 818.256 845.196 801.448 837.683 783.592L833.579 773.84C818.551 738.123 814.771 698.674 822.744 660.753C828.188 634.861 838.966 610.386 854.391 588.889L894.5 532.989L895.999 531.037C907.542 516.004 906.53 494.83 893.607 480.967C890.233 477.348 886.199 474.408 881.721 472.306L848.729 456.814C836.932 451.274 825.644 444.721 814.926 437.304C798.216 425.74 778.736 412.46 775.5 410.989C773.456 410.06 776.369 404.633 781.061 397.968C792.247 382.08 808.627 370.803 826.289 362.702C852.137 350.847 881.004 347.224 908.981 352.325L925.542 355.344C946.044 359.082 967.018 359.46 987.641 356.462L1017.21 352.163Z" fill="black"/>
+</mask>
+<g mask="url(#mask3_1_164)">
+<path d="M1017.21 352.163C1051.93 347.116 1087.34 350.205 1120.66 361.186L1192.4 384.831C1199.54 387.185 1205.56 392.109 1209.28 398.648L1216.06 410.57C1217.26 412.683 1219.5 413.989 1221.93 413.989C1225.97 413.989 1229.1 410.478 1228.65 406.47L1226 382.989V353.489L1222.08 315.533C1219.41 289.601 1210.15 264.782 1195.19 243.431C1176.55 216.828 1149.93 196.846 1119.17 186.378L1060.27 166.326C1006.59 148.052 949.225 143.351 893.287 152.643L831 162.989L729.352 183.216C666.02 195.819 607.41 225.696 560.005 269.542L502.519 322.713C465.285 357.152 435.961 399.26 416.708 446.183C389.876 511.58 361 582.49 361 584.489C361 586.994 368.74 674.287 373.831 731.314C374.938 743.72 374.3 756.194 371.936 768.422C364.958 804.515 373.218 841.887 394.757 871.678L446.602 943.384C456.287 956.779 461.5 972.886 461.5 989.415V1020.85C461.5 1036.14 448.809 1045.68 438 1056.49C434.5 1059.99 438 1090.49 438 1096.99C438 1102.19 483 1110.49 505.5 1113.99C521.386 1116.17 535.114 1126.28 541.537 1140.97C548.325 1156.5 554.989 1172.64 555.5 1176.99C556.08 1181.92 580.538 1187.15 602.708 1190.73C616.086 1192.89 628.959 1185.17 633.907 1172.55C634.963 1169.86 635.62 1167.02 635.856 1164.14L641.691 1092.96C644.219 1062.12 642.645 1031.07 637.009 1000.64V1000.64C636.022 995.305 633.606 990.34 630.019 986.271L590.714 941.687C576.063 925.067 565 905.601 558.22 884.508L556.374 878.763C552.482 866.654 550.5 854.013 550.5 841.294V830.827C550.5 817.476 553.807 804.333 560.125 792.572L567.383 779.06C577 761.157 595.678 749.989 616 749.989H624.947C643.22 749.989 661.398 752.621 678.921 757.804L698.625 763.631C714.968 768.465 729.907 777.162 742.181 788.986C756.756 803.028 767.015 820.943 771.749 840.621L790 916.489L801.111 983.554C803.012 995.024 802.254 1006.78 798.897 1017.91V1017.91C789.824 1047.99 789.59 1080.05 798.222 1110.27C802.058 1123.69 807.594 1136.57 814.695 1148.6L821.717 1160.49C843.273 1196.98 873.073 1227.92 908.732 1250.83L965 1286.99L1034 1344.42C1041.43 1350.6 1050.79 1353.99 1060.46 1353.99H1075.59C1080.51 1353.99 1085.08 1356.53 1087.67 1360.72C1089.19 1363.17 1091.42 1365.11 1094.06 1366.26L1163.58 1396.59C1182.39 1404.8 1202.45 1409.77 1222.92 1411.29L1230.74 1411.87C1253.93 1413.59 1277.19 1409.87 1298.68 1400.99C1327.81 1388.97 1352.38 1368.02 1368.85 1341.16L1371.35 1337.09C1377.1 1327.72 1381.78 1317.73 1385.29 1307.32C1390.4 1292.2 1393 1276.35 1393 1260.39V1235.49L1391.34 1221.58C1389.8 1208.7 1385.23 1196.38 1378 1185.61L1375.16 1181.38C1370.12 1173.89 1366.85 1165.34 1365.59 1156.39L1364.29 1147.17C1363.45 1141.19 1364.45 1135.1 1367.15 1129.7C1368.38 1127.24 1369.94 1124.96 1371.8 1122.93V1122.93C1373.4 1121.18 1373.67 1118.6 1372.48 1116.55L1370.46 1113.07C1368.51 1109.73 1365.8 1106.9 1362.55 1104.82L1360.66 1103.61C1357.99 1101.9 1354.87 1100.99 1351.69 1100.99C1349.23 1100.99 1346.8 1101.54 1344.57 1102.59L1333.82 1107.68C1331.28 1108.88 1328.89 1110.37 1326.68 1112.11C1322.61 1115.33 1319.25 1119.36 1316.82 1123.95L1313.64 1129.98C1311.91 1133.27 1311 1136.93 1311 1140.65V1143.3C1311 1149.06 1313.8 1154.47 1318.51 1157.79L1333.2 1168.19C1336.45 1170.48 1336.35 1175.34 1333 1177.49L1329.91 1179.27C1328.85 1179.88 1327.76 1180.41 1326.66 1180.88C1313.04 1186.66 1287.83 1195.41 1273.42 1192.07V1192.07L1238.5 1183.99L1203.34 1171.63C1190.5 1167.12 1180.46 1156.95 1176.12 1144.06L1173.58 1136.5C1169.05 1123.05 1156.44 1113.99 1142.25 1113.99C1132.29 1113.99 1122.85 1118.48 1116.58 1126.22L1094.75 1153.13C1091.75 1156.84 1087.23 1158.99 1082.46 1158.99C1071.66 1158.99 1064.03 1148.41 1067.44 1138.16L1070 1130.49L1096 1038.08C1097.33 1033.37 1098 1028.51 1098 1023.62C1098 998.236 1080.12 976.364 1055.24 971.32L1015.9 963.347C997.017 959.519 979.595 950.444 965.636 937.164L913.988 888.029C901.015 875.687 889.009 862.368 878.074 848.189L866.82 833.596C854.99 818.256 845.196 801.448 837.683 783.592L833.579 773.84C818.551 738.123 814.771 698.674 822.744 660.753C828.188 634.861 838.966 610.386 854.391 588.889L894.5 532.989L895.999 531.037C907.542 516.004 906.53 494.83 893.607 480.967C890.233 477.348 886.199 474.408 881.721 472.306L848.729 456.814C836.932 451.274 825.644 444.721 814.926 437.304C798.216 425.74 778.736 412.46 775.5 410.989C773.456 410.06 776.369 404.633 781.061 397.968C792.247 382.08 808.627 370.803 826.289 362.702C852.137 350.847 881.004 347.224 908.981 352.325L925.542 355.344C946.044 359.082 967.018 359.46 987.641 356.462L1017.21 352.163Z" fill="black"/>
+</g>
+<mask id="mask4_1_164" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="579" y="767" width="164" height="190">
+<path d="M661.023 790.377C659.372 787.832 657.065 785.779 654.345 784.436L627.129 770.987C619.965 767.448 611.744 766.688 604.053 768.854C590.123 772.778 580.5 785.485 580.5 799.958V810.489C579.334 829.822 578.2 870.089 583 876.489C586.723 881.452 599.906 910.389 610.147 933.548C615.091 944.729 625.255 952.75 637.3 954.845L645.526 956.276C649.982 957.051 654.563 955.979 658.213 953.307L663.901 949.142C671.436 943.625 670.398 932.074 662 927.989L631.387 909.899C615.636 900.592 603.675 886.025 597.611 868.764C595.216 861.947 593.783 854.829 593.355 847.617L591.814 821.68C591.293 812.912 594.266 804.293 600.083 797.711L606.676 790.251C608.79 787.859 611.829 786.489 615.021 786.489C622.177 786.489 627.476 793.14 625.878 800.115L624.504 806.109C623.856 808.935 624.24 811.9 625.586 814.469C627.685 818.477 631.836 820.989 636.36 820.989H639.273C642.366 820.989 645.4 820.144 648.048 818.545L655.591 813.991C663.746 809.067 666.207 798.37 661.023 790.377Z" fill="#855A1B"/>
+<path d="M669.302 819.62C664.561 820.509 660.233 822.903 656.962 826.447L645.649 838.703C644.554 839.889 643.315 840.932 641.96 841.809C637.813 844.492 634.856 848.667 633.7 853.469L630.072 868.537C629.359 871.5 628.85 874.512 628.759 877.559C628.559 884.305 628.949 893.256 631.5 895.489C638.718 901.804 642.656 884.839 641.4 875.331C640.889 871.46 641.463 867.624 644 864.489C644.391 864.006 644.827 863.515 645.302 863.016C654.58 853.288 667.397 865.802 661.218 877.74C659.48 881.096 658.968 885.181 661.247 888.195C662.809 890.26 664.924 891.989 667.5 891.989C668.618 891.989 670.174 890.994 671.976 889.353C675.283 886.341 682.374 889.958 680.939 894.195C680.655 895.031 680.09 895.738 679.346 896.212C674.795 899.111 667.5 904.287 667.5 906.489C667.5 907.265 668.825 908.62 670.832 910.222C680.512 917.949 692.814 921.273 705 923.489C710.5 924.489 742 926.489 742 923.489C742 921.089 726.334 897.155 718.5 885.489L705.642 868.553C700.684 862.024 698 854.05 698 845.852V843.927C698 841.646 697.676 839.377 697.038 837.188C695.402 831.581 691.783 826.759 686.855 823.624L685.467 822.74C680.67 819.687 674.891 818.572 669.302 819.62Z" fill="#855A1B"/>
+</mask>
+<g mask="url(#mask4_1_164)">
+<path d="M661.023 790.377C659.372 787.832 657.065 785.779 654.345 784.436L627.129 770.987C619.965 767.448 611.744 766.688 604.053 768.854C590.123 772.778 580.5 785.485 580.5 799.958V810.489C579.334 829.822 578.2 870.089 583 876.489C586.723 881.452 599.906 910.389 610.147 933.548C615.091 944.729 625.255 952.75 637.3 954.845L645.526 956.276C649.982 957.051 654.563 955.979 658.213 953.307L663.901 949.142C671.436 943.625 670.398 932.074 662 927.989L631.387 909.899C615.636 900.592 603.675 886.025 597.611 868.764C595.216 861.947 593.783 854.829 593.355 847.617L591.814 821.68C591.293 812.912 594.266 804.293 600.083 797.711L606.676 790.251C608.79 787.859 611.829 786.489 615.021 786.489C622.177 786.489 627.476 793.14 625.878 800.115L624.504 806.109C623.856 808.935 624.24 811.9 625.586 814.469C627.685 818.477 631.836 820.989 636.36 820.989H639.273C642.366 820.989 645.4 820.144 648.048 818.545L655.591 813.991C663.746 809.067 666.207 798.37 661.023 790.377Z" fill="#855A1B"/>
+<path d="M669.302 819.62C664.561 820.509 660.233 822.903 656.962 826.447L645.649 838.703C644.554 839.889 643.315 840.932 641.96 841.809C637.813 844.492 634.856 848.667 633.7 853.469L630.072 868.537C629.359 871.5 628.85 874.512 628.759 877.559C628.559 884.305 628.949 893.256 631.5 895.489C638.718 901.804 642.656 884.839 641.4 875.331C640.889 871.46 641.463 867.624 644 864.489C644.391 864.006 644.827 863.515 645.302 863.016C654.58 853.288 667.397 865.802 661.218 877.74C659.48 881.096 658.968 885.181 661.247 888.195C662.809 890.26 664.924 891.989 667.5 891.989C668.618 891.989 670.174 890.994 671.976 889.353C675.283 886.341 682.374 889.958 680.939 894.195C680.655 895.031 680.09 895.738 679.346 896.212C674.795 899.111 667.5 904.287 667.5 906.489C667.5 907.265 668.825 908.62 670.832 910.222C680.512 917.949 692.814 921.273 705 923.489C710.5 924.489 742 926.489 742 923.489C742 921.089 726.334 897.155 718.5 885.489L705.642 868.553C700.684 862.024 698 854.05 698 845.852V843.927C698 841.646 697.676 839.377 697.038 837.188C695.402 831.581 691.783 826.759 686.855 823.624L685.467 822.74C680.67 819.687 674.891 818.572 669.302 819.62Z" fill="#855A1B"/>
+</g>
+</g>
+</svg>
diff --git a/icon/wowrakibul.svg b/icon/wowrakibul.svg
new file mode 100644
index 0000000..e376369
--- /dev/null
+++ b/icon/wowrakibul.svg
@@ -0,0 +1,21 @@
+<svg width="1760" height="2675" viewBox="0 0 1760 2675" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M612.018 813.617C609.928 810.393 607.006 807.793 603.561 806.091L569.089 789.058C560.016 784.575 549.603 783.612 539.862 786.356C522.218 791.326 510.031 807.421 510.031 825.751V839.089C508.553 863.576 507.118 914.577 513.197 922.683C517.912 928.969 534.61 965.62 547.58 994.953C553.842 1009.11 566.716 1019.27 581.971 1021.93L592.391 1023.74C598.035 1024.72 603.836 1023.36 608.459 1019.98L615.664 1014.7C625.208 1007.72 623.893 993.086 613.257 987.911L574.483 965C554.533 953.211 539.384 934.761 531.702 912.899C528.669 904.265 526.854 895.25 526.312 886.115L524.36 853.264C523.7 842.158 527.466 831.242 534.834 822.905L543.184 813.457C545.861 810.427 549.711 808.692 553.754 808.692C562.818 808.692 569.529 817.116 567.505 825.95L565.765 833.542C564.945 837.122 565.43 840.877 567.135 844.131C569.794 849.207 575.051 852.388 580.781 852.388H584.471C588.388 852.388 592.231 851.318 595.585 849.293L605.139 843.525C615.468 837.288 618.585 823.74 612.018 813.617Z" fill="black"/>
+<path d="M622.505 850.654C616.5 851.78 611.019 854.813 606.875 859.302L592.546 874.825C591.16 876.327 589.59 877.648 587.874 878.759C582.622 882.157 578.876 887.445 577.412 893.527L572.817 912.611C571.914 916.365 571.269 920.179 571.154 924.038C570.901 932.583 571.395 943.92 574.626 946.748C583.768 954.747 588.756 933.26 587.165 921.217C586.517 916.313 587.244 911.455 590.458 907.484C590.953 906.873 591.505 906.25 592.107 905.619C603.858 893.298 620.092 909.147 612.265 924.268C610.065 928.518 609.416 933.693 612.303 937.51C614.281 940.126 616.96 942.315 620.223 942.315C621.639 942.315 623.609 941.055 625.892 938.977C630.081 935.161 639.061 939.743 637.243 945.11C636.885 946.168 636.169 947.064 635.226 947.664C629.462 951.336 620.223 957.891 620.223 960.68C620.223 961.663 621.901 963.379 624.442 965.408C636.703 975.196 652.285 979.406 667.72 982.212C674.686 983.478 714.583 986.012 714.583 982.212C714.583 979.172 694.74 948.859 684.818 934.082L668.532 912.632C662.253 904.362 658.854 894.263 658.854 883.879V881.441C658.854 878.553 658.443 875.679 657.634 872.906C655.563 865.804 650.979 859.697 644.737 855.725L642.979 854.607C636.903 850.74 629.584 849.327 622.505 850.654Z" fill="black"/>
+<path d="M1059.3 605.643C1062.88 610.685 1069.48 612.564 1075.18 610.163L1130.04 587.04C1138 583.682 1146.42 581.525 1155.02 580.64L1192.4 576.792C1215.86 574.377 1239.55 578.004 1261.22 587.328C1272.5 592.182 1283.08 598.516 1292.68 606.164L1297.3 609.84L1308 618.166C1317.17 625.296 1329.13 627.772 1340.37 624.87L1347.3 623.081C1356.25 620.773 1363.23 613.781 1365.52 604.832C1367.2 598.308 1366.2 591.386 1362.76 585.594L1354.42 571.545C1347.68 560.194 1337.63 551.176 1325.62 545.7L1312.78 539.843C1304.96 536.279 1296.75 533.646 1288.32 531.996L1269.04 528.225C1251.55 524.803 1233.77 523.08 1215.95 523.08H1187.55C1181.3 523.08 1175.06 523.66 1168.91 524.812C1154.96 527.427 1141.72 532.951 1130.04 541.023L1096.46 564.243L1062.67 587.085C1056.54 591.23 1055.02 599.608 1059.3 605.643Z" fill="black"/>
+<path d="M1135.76 698.252C1139.63 700.743 1144.56 700.896 1148.59 698.648L1184.23 678.733C1184.82 678.401 1185.44 678.116 1186.07 677.879L1187.61 677.309C1196.41 674.04 1205.47 681.457 1204.01 690.73C1203.66 692.914 1203.91 695.151 1204.74 697.203L1212.35 716.232L1216.19 723.911C1218.49 728.52 1223.2 731.431 1228.35 731.431C1231.52 731.431 1234.58 730.329 1237.02 728.315L1241.55 724.568C1245.19 721.564 1250.44 721.551 1254.09 724.538L1254.41 724.793C1254.65 724.996 1254.92 725.176 1255.2 725.331C1259.33 727.626 1258.7 733.753 1254.18 735.153L1248.07 737.051C1247.9 737.104 1247.72 737.142 1247.55 737.165C1244.22 737.598 1243.84 742.254 1247.04 743.229L1247.36 743.325C1247.66 743.417 1247.97 743.463 1248.29 743.463H1263.89C1267.7 743.463 1271.26 741.584 1273.41 738.442C1276.27 734.272 1276.07 728.731 1272.94 724.77L1270.8 722.068C1267.86 718.363 1266.69 713.563 1267.59 708.924L1268.7 703.191C1269.54 698.855 1269.38 694.384 1268.22 690.121L1261.29 664.567C1260.34 661.063 1258.57 657.833 1256.14 655.14L1240.14 637.454C1237.95 635.034 1234.05 635.37 1232.31 638.129C1230.39 641.178 1225.95 641.195 1224 638.162L1223.82 637.887C1222.97 636.571 1221.57 635.712 1220.02 635.553L1203.12 633.829C1195.5 633.051 1187.81 634.458 1180.95 637.885L1157.25 649.737L1135.15 663.882C1132.35 665.671 1133.62 670.002 1136.94 670.002C1137.39 670.002 1137.83 669.911 1138.24 669.736L1184.18 650.134C1184.8 649.872 1185.46 649.737 1186.13 649.737H1187.86C1193.35 649.737 1194.42 657.533 1189.12 659.003C1188.57 659.157 1188.04 659.412 1187.58 659.755L1178.37 666.566C1175.27 668.852 1171.99 670.867 1168.55 672.587L1160.01 676.857C1158.18 677.77 1156.23 678.399 1154.21 678.722L1138.52 681.232C1132.27 682.232 1128.94 689.175 1132.09 694.674C1132.81 695.939 1133.83 697.012 1135.05 697.8L1135.76 698.252Z" fill="black"/>
+<path d="M1412.22 765.084C1413.75 762.588 1417.02 761.814 1419.51 763.357L1425.48 767.051C1427.23 768.135 1428.3 770.048 1428.3 772.107V773.258C1428.3 778.498 1421.7 780.812 1418.43 776.721C1418.25 776.503 1418.06 776.299 1417.86 776.11L1413.14 771.75C1411.28 770.033 1410.89 767.24 1412.22 765.084Z" fill="black"/>
+<path d="M1396.93 734.788C1393.85 736.958 1395.78 741.807 1399.51 741.254C1400.85 741.056 1402.19 741.631 1402.97 742.742L1403.73 743.826C1405.16 745.871 1407.75 746.751 1410.13 745.999L1413.55 744.922C1416.48 743.995 1419.67 744.39 1422.29 746.002L1430.54 751.076C1433.25 752.746 1435.73 754.792 1437.69 757.307C1440.48 760.906 1443.5 765.358 1443.5 767.528C1443.5 770.881 1447.41 773.807 1449.89 771.541L1453.32 768.397C1453.93 767.831 1454.36 767.095 1454.54 766.277C1456.28 758.302 1459.18 743.812 1458.7 740.93C1458.34 738.765 1453.24 731.758 1448.58 725.77C1445.28 721.523 1441.03 718.128 1436.25 715.664L1425.08 709.912C1423.49 709.089 1421.64 708.895 1419.9 709.367L1406.15 713.119C1402.96 713.99 1402.95 718.513 1406.13 719.398C1411.86 720.871 1411.79 729.029 1406.03 730.399L1402.59 731.22C1402 731.359 1401.45 731.609 1400.96 731.955L1396.93 734.788Z" fill="black"/>
+<path d="M1440.38 645.301C1430.99 656.72 1436.78 674.027 1451.16 677.487C1453.21 677.982 1455.18 678.801 1456.98 679.913L1466.83 685.99C1475.22 691.168 1486.21 686.489 1488.3 676.852C1488.82 674.438 1488.71 671.929 1487.97 669.572L1477.2 635.121C1476.69 633.478 1475.9 631.937 1474.86 630.566C1468.75 622.518 1456.57 622.761 1450.79 631.045L1443.5 641.504L1440.38 645.301Z" fill="black"/>
+<path d="M1345.4 884.913C1354.73 887.441 1358.2 898.872 1351.84 906.162L1349.05 909.365C1343.71 915.481 1343.9 924.651 1349.47 930.547L1357.7 939.245C1360.4 942.093 1362.35 945.556 1363.4 949.333L1364.76 954.223C1366.77 961.454 1363.84 969.151 1357.53 973.22C1352.01 976.782 1344.93 976.896 1339.4 973.348C1329.95 967.289 1319.37 960.016 1319.37 958.147C1319.37 957.474 1318.63 955.537 1317.44 952.868C1309.92 936.025 1314.95 918.235 1324.44 902.418C1325.32 900.948 1327.81 896.283 1330.32 891.511C1333.19 886.057 1339.45 883.302 1345.4 884.913Z" fill="black"/>
+<path d="M1395.03 961.461C1389.35 961.726 1384.6 957.191 1384.6 951.503C1384.6 946.865 1387.8 942.84 1392.32 941.792L1428.3 933.449C1437.96 931.437 1448.01 933.694 1455.88 939.642L1469.31 949.784C1471 951.063 1472 953.061 1472 955.182C1472 958.918 1468.97 961.947 1465.23 961.947H1459.54C1458.14 961.947 1456.76 961.713 1455.44 961.255L1430.02 952.414C1428.88 952.017 1427.68 951.814 1426.47 951.814C1423.97 951.814 1421.54 952.685 1419.61 954.277L1416.91 956.503C1413.61 959.215 1409.53 960.787 1405.27 960.985L1395.03 961.461Z" fill="black"/>
+<path d="M1063.16 258.587C1107.13 252.194 1151.99 256.107 1194.19 270.016L1285.05 299.963C1294.1 302.945 1301.72 309.182 1306.42 317.463L1315.01 332.563C1316.53 335.24 1319.38 336.894 1322.45 336.894C1327.56 336.894 1331.54 332.448 1330.96 327.37L1327.61 297.63V260.266L1322.64 212.193C1319.25 179.347 1307.53 147.913 1288.58 120.87C1264.97 87.1755 1231.25 61.8675 1192.3 48.6087L1117.7 23.2113C1049.71 0.0663299 977.049 -5.88772 906.2 5.88045L827.308 18.9844L698.563 44.6036C618.349 60.5656 544.114 98.4073 484.072 153.942L411.262 221.286C364.102 264.906 326.961 318.238 302.576 377.67C268.591 460.5 232.017 550.313 232.017 552.844C232.017 556.017 241.82 666.58 248.268 738.809C249.671 754.521 248.863 770.321 245.869 785.809C237.031 831.523 247.492 878.858 274.773 916.59L340.439 1007.41C352.705 1024.38 359.308 1044.78 359.308 1065.71V1105.53C359.308 1124.89 343.235 1136.98 329.544 1150.67C325.111 1155.1 329.544 1193.73 329.544 1201.96C329.544 1208.55 386.54 1219.06 415.038 1223.49C435.158 1226.26 452.546 1239.06 460.681 1257.67C469.279 1277.33 477.719 1297.78 478.366 1303.29C479.101 1309.53 510.079 1316.16 538.159 1320.69C555.103 1323.43 571.409 1313.65 577.675 1297.67C579.013 1294.26 579.845 1290.67 580.144 1287.01L587.534 1196.86C590.736 1157.79 588.742 1118.47 581.604 1079.93L579.693 1069.61L522.968 1005.26C504.411 984.211 490.4 959.556 481.812 932.84L479.473 925.563C474.544 910.227 472.034 894.216 472.034 878.107V864.849C472.034 847.939 476.222 831.293 484.224 816.396L493.418 799.282C505.598 776.608 529.255 762.462 554.994 762.462H566.327C589.471 762.462 612.495 765.795 634.689 772.36L659.645 779.741C680.345 785.864 699.267 796.878 714.812 811.855C733.273 829.64 746.266 852.331 752.262 877.254L775.379 973.346L793.111 1080.37L786.648 1101.8C775.156 1139.91 774.859 1180.51 785.793 1218.78C790.652 1235.79 797.663 1252.1 806.657 1267.33L815.551 1282.38C842.853 1328.61 880.597 1367.8 925.762 1396.82L997.03 1442.61L1084.43 1515.35C1093.84 1523.18 1105.69 1527.47 1117.94 1527.47H1137.09C1143.33 1527.47 1149.11 1530.7 1152.4 1535.99C1154.32 1539.1 1157.15 1541.55 1160.5 1543.02L1248.55 1581.43C1272.37 1591.82 1297.78 1598.12 1323.7 1600.04L1333.61 1600.78C1362.98 1602.96 1392.44 1598.25 1419.66 1587.01C1456.56 1571.77 1487.67 1545.24 1508.54 1511.22L1511.7 1506.07C1518.98 1494.2 1524.91 1481.55 1529.36 1468.36C1535.83 1449.21 1539.12 1429.14 1539.12 1408.93V1377.38L1537.02 1359.76C1535.07 1343.45 1529.28 1327.84 1520.12 1314.21L1516.52 1308.86C1510.14 1299.36 1506 1288.53 1504.41 1277.2L1502.76 1265.52C1501.7 1257.95 1502.96 1250.23 1506.38 1243.39C1507.94 1240.27 1509.92 1237.39 1512.27 1234.81L1515.67 1231.09L1510.57 1222.33C1508.11 1218.1 1504.68 1214.52 1500.56 1211.88L1498.17 1210.35C1494.78 1208.18 1490.83 1207.03 1486.81 1207.03C1483.69 1207.03 1480.6 1207.72 1477.78 1209.06L1464.17 1215.5C1460.95 1217.03 1457.92 1218.91 1455.13 1221.11C1449.96 1225.19 1445.71 1230.3 1442.64 1236.12L1438.61 1243.75C1436.41 1247.91 1435.27 1252.55 1435.27 1257.26V1260.62C1435.27 1267.92 1438.81 1274.76 1444.77 1278.98L1463.39 1292.14C1467.5 1295.05 1467.37 1301.2 1463.13 1303.92L1459.21 1306.17C1446.19 1313.66 1429.98 1312.78 1417.85 1303.92C1414.51 1317.28 1401.08 1325.5 1387.67 1322.39L1343.44 1312.15L1298.9 1296.51C1282.65 1290.79 1269.93 1277.91 1264.43 1261.58L1261.21 1252C1255.47 1234.97 1239.51 1223.49 1221.53 1223.49C1208.91 1223.49 1196.96 1229.19 1189.02 1238.99L1161.37 1273.07C1157.56 1277.76 1151.84 1280.49 1145.8 1280.49C1132.12 1280.49 1122.46 1267.08 1126.78 1254.1L1130.02 1244.39L1162.96 1127.35C1164.63 1121.39 1165.48 1115.23 1165.48 1109.04C1165.48 1076.88 1142.83 1049.18 1111.32 1042.79L1061.5 1032.69C1037.58 1027.85 1015.52 1016.35 997.835 999.533L932.419 937.299C915.988 921.667 900.781 904.798 886.931 886.839L872.677 868.357C857.693 848.927 845.289 827.638 835.773 805.022L830.575 792.671C811.541 747.433 806.754 697.467 816.852 649.439C823.747 616.644 837.398 585.645 856.935 558.417L907.736 487.616L909.635 485.143C924.255 466.103 922.973 439.286 906.604 421.726C902.332 417.143 897.222 413.419 891.551 410.756L849.764 391.135C834.821 384.118 820.524 375.818 806.95 366.424C785.785 351.777 761.112 334.957 757.013 333.094C754.424 331.917 758.114 325.044 764.057 316.603C778.225 296.479 798.971 282.196 821.341 271.936C854.08 256.92 890.643 252.332 926.077 258.792L947.053 262.617C973.02 267.351 999.585 267.829 1025.71 264.032L1063.16 258.587Z" fill="black"/>
+<path d="M1493.3 1159.12C1495.73 1151.33 1493.19 1142.85 1486.88 1137.68L1490.99 1151.93L1492.97 1160.17L1493.3 1159.12Z" fill="black"/>
+<path d="M1352.94 1087.97L1397.9 1066.44L1419.09 1061.37C1434.64 1057.64 1450.92 1058.26 1466.14 1063.14C1472.97 1065.33 1480.05 1066.67 1487.21 1067.13L1496.06 1067.71L1501.13 1105.7L1506.83 1107.6L1504.82 1082.58C1503.77 1069.4 1493.81 1058.67 1480.75 1056.64L1480.23 1056.56C1476.47 1055.98 1472.89 1054.58 1469.73 1052.47C1465.43 1049.6 1460.37 1048.07 1455.2 1048.07H1440.31C1431.94 1048.07 1423.62 1049.47 1415.71 1052.2L1408.64 1054.65C1398.15 1058.27 1388.22 1063.33 1379.13 1069.68L1352.94 1087.97Z" fill="black"/>
+<path d="M1469.39 1078.33C1477.43 1081.22 1483.71 1087.64 1486.41 1095.74C1489.28 1104.37 1487.77 1113.85 1482.35 1121.15L1482.07 1121.53L1476.43 1129.13L1486.88 1137.68C1489.62 1129.05 1493.14 1120.68 1497.4 1112.68L1501.13 1105.7L1496.06 1067.71L1454.22 1073.63C1456.36 1073.9 1458.45 1074.4 1460.47 1075.13L1469.39 1078.33Z" fill="black"/>
+<path d="M1466.14 1063.14C1450.92 1058.26 1434.64 1057.64 1419.09 1061.37L1397.9 1066.44L1454.22 1073.63L1496.06 1067.71L1487.21 1067.13C1480.05 1066.67 1472.97 1065.33 1466.14 1063.14Z" fill="black"/>
+<path d="M1397.9 1066.44L1352.94 1087.97L1454.22 1073.63L1397.9 1066.44Z" fill="black"/>
+<path d="M1349.51 1132.3C1354.71 1132.3 1359.47 1129.36 1361.8 1124.7L1350.4 1121.53L1339.01 1118.37L1333.36 1132.3H1349.51Z" fill="black"/>
+<path d="M1411.83 1194.36H1476.43C1489.99 1194.36 1498.51 1179.73 1491.81 1167.93L1490.99 1166.5L1457.43 1155.1L1404.87 1141.8L1380.16 1138.53C1375.93 1137.97 1373.94 1143.57 1377.57 1145.8C1378.03 1146.09 1378.43 1146.46 1378.74 1146.91L1411.83 1194.36Z" fill="black"/>
+<path d="M1339.01 1118.37L1352.94 1087.97L1379.13 1069.68C1388.22 1063.33 1398.15 1058.27 1408.64 1054.65L1415.71 1052.2C1423.62 1049.47 1431.94 1048.07 1440.31 1048.07H1455.2C1460.37 1048.07 1465.43 1049.6 1469.73 1052.47C1472.89 1054.58 1476.47 1055.98 1480.23 1056.56L1480.75 1056.64C1493.81 1058.67 1503.77 1069.4 1504.82 1082.58L1506.83 1107.6L1503.68 1128.9C1501.99 1140.41 1501.81 1152.08 1503.15 1163.63C1503.91 1170.18 1505.16 1176.66 1506.88 1183.02L1507.7 1186.05C1510.91 1197.89 1515.35 1209.36 1520.96 1220.28L1522.62 1223.49L1522.02 1218.89C1519.93 1202.67 1520.79 1186.21 1524.56 1170.3L1525.92 1160.73C1529.64 1134.7 1530.13 1108.31 1527.36 1082.16L1525.28 1062.46C1524.8 1057.94 1523.94 1053.47 1522.72 1049.09C1518.94 1035.56 1511.74 1023.22 1501.8 1013.28L1491.16 1002.65C1488.95 1000.44 1486.41 998.581 1483.63 997.149L1475.48 992.95C1470.24 990.253 1463.93 990.761 1459.19 994.263C1454.94 997.407 1449.37 998.161 1444.44 996.262L1440.06 994.579C1437.31 993.52 1434.39 992.978 1431.44 992.978H1421.97C1400.42 990.132 1378.61 995.687 1361.05 1008.49L1358 1010.71L1329.51 1031.61L1298.91 1059.04C1294.83 1062.7 1291.14 1066.76 1287.9 1071.18C1280.69 1080.98 1275.82 1092.29 1273.66 1104.27L1269.98 1124.7L1268.32 1135.48C1266.98 1144.18 1261.4 1151.65 1253.44 1155.41C1247.01 1158.45 1239.62 1158.77 1232.94 1156.31L1215.71 1149.94C1214.75 1149.58 1213.89 1149 1213.22 1148.23L1209.48 1143.95C1206.19 1140.19 1200.08 1143.39 1201.29 1148.23C1201.48 1149 1201.86 1149.7 1202.39 1150.29L1223.33 1173.2C1231.05 1181.64 1241.02 1187.69 1252.07 1190.62C1261.34 1193.08 1271.06 1193.27 1280.42 1191.17L1297.45 1187.35C1301.07 1186.54 1304.55 1185.21 1307.79 1183.39C1317.54 1177.9 1324.39 1168.39 1326.51 1157.39L1328.4 1147.54C1329.14 1143.72 1330.24 1139.99 1331.7 1136.38L1333.36 1132.3L1339.01 1118.37Z" fill="black"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M576.302 1215.89C586.795 1215.89 595.301 1224.4 595.301 1234.89V1325.99L582.75 1416.23C617.91 1416.94 653.374 1420.67 684.172 1430.94C711.757 1440.13 734.121 1460.92 751.246 1476.85C752.049 1477.59 752.841 1478.33 753.621 1479.05C810.059 1531.4 855.72 1592 900.548 1651.49C905.076 1657.5 909.595 1663.5 914.116 1669.48C952.479 1720.2 981.979 1747.27 1013.87 1772.41C1019.31 1776.7 1024.9 1780.99 1030.66 1785.37C1032.18 1765.25 1037.12 1746.66 1041.86 1729.68C1042.31 1728.09 1042.75 1726.51 1043.19 1724.95C1048.54 1705.86 1053.32 1688.83 1054.71 1670.75C1056.63 1645.74 1057.29 1620.63 1057.97 1594.97L1058.03 1592.86C1058.72 1566.64 1059.47 1539.86 1061.7 1513.06C1062.57 1502.61 1071.76 1494.84 1082.21 1495.71C1092.67 1496.58 1100.44 1505.76 1099.57 1516.22C1097.44 1541.78 1096.71 1567.53 1096.01 1593.87L1095.95 1596.34C1095.79 1602.34 1095.63 1608.36 1095.45 1614.42C1096.09 1614.9 1096.71 1615.42 1097.3 1615.99C1106.03 1624.42 1116.58 1632.3 1128.46 1640.63C1131.56 1642.8 1134.79 1645.03 1138.09 1647.31C1147 1653.47 1156.43 1659.98 1165.22 1666.7C1196.73 1690.8 1217.96 1719.86 1235.99 1744.53L1236.16 1744.78C1272.35 1794.3 1285.68 1845.21 1298.27 1893.56C1311.27 1943.52 1313.91 1992.54 1314.22 2040.96C1365.64 2102.94 1403.61 2162.18 1437.8 2215.54C1445.7 2227.86 1453.4 2239.87 1461.01 2251.52C1496.51 2305.88 1529.61 2351.6 1572.54 2387.34C1615.06 2422.73 1668.1 2449.01 1744.32 2462.56C1754.65 2464.4 1761.54 2474.26 1759.7 2484.59C1757.87 2494.93 1748 2501.81 1737.67 2499.97C1655.53 2485.37 1596.26 2456.52 1548.23 2416.55C1500.63 2376.92 1464.95 2327.04 1429.2 2272.3C1421.47 2260.47 1413.71 2248.37 1405.79 2236.02C1372.56 2184.21 1336.58 2128.1 1288.77 2069.81C1282.43 2067.51 1277.67 2061.94 1276.52 2055.14C1232.29 2003.11 1178.15 1949.5 1107.77 1895.79L1107.2 1895.35L1106.66 1894.87C1072.8 1864.72 1046.03 1844.56 1021.27 1825.91C1010.73 1817.97 1000.55 1810.3 990.346 1802.25C956.202 1775.33 924.344 1745.99 883.812 1692.4C879.323 1686.47 874.86 1680.54 870.412 1674.64C825.242 1614.72 781.604 1556.83 727.781 1506.91C708.698 1489.21 691.707 1473.5 672.156 1466.98C640.997 1456.6 602.006 1453.67 561.155 1454.14C536.934 1454.42 512.611 1455.87 489.513 1457.46C484.464 1457.81 479.417 1458.16 474.441 1458.52C467.7 1458.99 461.09 1459.46 454.785 1459.88C421.763 1462.08 390.136 1467.27 358.328 1473.84C337.586 1478.13 317.074 1482.93 296.01 1487.86C287.274 1489.9 278.444 1491.97 269.463 1494.03C264.958 1495.06 261.303 1495.8 258.238 1496.41C248.513 1498.36 244.732 1499.12 238.58 1504.5C198.973 1539.08 194.075 1582.57 194.075 1640.41V1643.03L193.365 1645.56C175.123 1710.39 157.611 1758.96 132.642 1798.48C107.335 1838.54 75.0571 1868.27 29.0154 1896.83C20.0987 1902.36 8.38683 1899.61 2.85614 1890.7C-2.67454 1881.78 0.0703602 1870.07 8.98706 1864.54C51.3303 1838.28 78.9519 1812.33 100.518 1778.19C122.135 1743.97 138.326 1700.51 156.081 1637.77C156.215 1580.08 161.08 1521.73 213.587 1475.88C228.028 1463.27 242.921 1460.47 254.392 1458.31C256.736 1457.87 258.938 1457.46 260.963 1456.99C269.587 1455.02 278.214 1453 286.841 1450.98C304.996 1446.73 323.155 1442.48 341.303 1438.6C359.574 1401.24 383.093 1374.35 418.665 1353.97C452.988 1334.3 497.684 1321.21 557.304 1309.07V1234.89C557.304 1224.4 565.81 1215.89 576.302 1215.89ZM490.823 1364.65C469.601 1371.3 452.198 1378.54 437.558 1386.93C418.121 1398.07 403.176 1411.47 390.69 1429.17C410.709 1425.92 431.145 1423.38 452.258 1421.97C458.549 1421.55 464.968 1421.09 471.601 1420.62C471.671 1420.62 471.741 1420.61 471.811 1420.61C475.74 1398.89 481.453 1380.43 490.823 1364.65ZM511.088 1418C521.961 1417.37 533.102 1416.83 544.35 1416.49L552.705 1356.42C541.824 1362.76 534.121 1369.41 528.263 1377.01C520.705 1386.81 515.218 1399.47 511.088 1418ZM1274.99 1996.19C1273.3 1964.77 1269.53 1933.99 1261.49 1903.14C1248.82 1854.44 1236.89 1810.18 1205.48 1767.19C1187.18 1742.15 1168.82 1717.29 1142.14 1696.88C1134.13 1690.76 1125.87 1685.06 1117.24 1679.09C1113.77 1676.7 1110.24 1674.26 1106.65 1671.74C1102.25 1668.66 1097.8 1665.48 1093.39 1662.17C1093.15 1666 1092.89 1669.83 1092.59 1673.66C1090.9 1695.67 1085.11 1716.25 1079.91 1734.72C1079.42 1736.46 1078.94 1738.19 1078.46 1739.89C1072.76 1760.31 1068.19 1778.5 1068.19 1797.63C1068.19 1802.44 1066.4 1806.83 1063.45 1810.18C1083.42 1825.47 1105.72 1843.19 1131.39 1866.02C1188.53 1909.67 1235.39 1953.39 1274.99 1996.19ZM376.315 1732.46C377.578 1722.04 387.045 1714.62 397.462 1715.88C461.73 1723.67 518.287 1752.89 570.8 1782.47C694.931 1852.41 807.835 1938.22 913.071 2032.96C946.712 2063.24 979.216 2094.04 1011.51 2124.64C1078.64 2188.25 1144.87 2251.01 1218.54 2306.5C1248.19 2328.84 1266.45 2339.67 1297.57 2344.86C1307.92 2346.59 1314.91 2356.37 1313.19 2366.72C1311.46 2377.07 1301.67 2384.07 1291.32 2382.34C1251.36 2375.68 1227.27 2360.66 1195.67 2336.85C1120.3 2280.07 1051.37 2214.78 983.356 2150.35C951.442 2120.12 919.729 2090.07 887.649 2061.2C783.95 1967.85 673.296 1883.83 552.148 1815.58C499.772 1786.07 448.989 1760.4 392.89 1753.6C382.473 1752.34 375.052 1742.87 376.315 1732.46ZM358.024 1842.15C366.287 1848.62 367.743 1860.56 361.276 1868.82C348.561 1885.07 328.406 1908.71 305.526 1935.55C285.946 1958.51 264.372 1983.82 243.759 2008.83C221.054 2036.38 199.147 2064 181.248 2088.93C163.108 2114.2 149.979 2135.51 143.898 2150.71C140.001 2160.46 128.945 2165.19 119.202 2161.3C109.46 2157.4 104.722 2146.34 108.618 2136.6C116.525 2116.84 132.004 2092.37 150.38 2066.77C168.998 2040.84 191.516 2012.48 214.435 1984.67C236.221 1958.23 258.066 1932.63 277.557 1909.78C299.711 1883.82 318.824 1861.41 331.353 1845.41C337.82 1837.14 349.761 1835.69 358.024 1842.15ZM417.778 1903.24H427.89C454.134 1903.24 481.082 1914.31 504.431 1926.12C516.368 1932.16 528.079 1938.79 538.893 1944.91L539.328 1945.16C550.146 1951.29 559.93 1956.83 568.871 1961.3C578.256 1965.99 582.06 1977.4 577.367 1986.79C572.675 1996.17 561.263 1999.98 551.878 1995.29C542.043 1990.37 531.515 1984.4 521.079 1978.49L520.164 1977.97C509.253 1971.79 498.295 1965.6 487.276 1960.03C468.887 1950.72 452.127 1944.11 437.507 1941.98L387.1 2016.85C381.24 2025.55 369.434 2027.85 360.73 2021.99C352.027 2016.13 349.721 2004.33 355.581 1995.62L417.778 1903.24ZM574.008 2134.02C559.937 2128.95 545.383 2129.07 526.186 2141.87C499.499 2159.66 429.752 2204.08 357.868 2244.11C321.944 2264.12 285.158 2283.22 252.775 2297.38C236.588 2304.45 221.224 2310.41 207.437 2314.63C193.913 2318.77 180.742 2321.61 169.322 2321.61C158.829 2321.61 150.323 2313.1 150.323 2302.61C150.323 2292.12 158.829 2283.61 169.322 2283.61C175.172 2283.61 184.13 2282.03 196.313 2278.3C208.234 2274.65 222.158 2269.29 237.558 2262.56C268.352 2249.1 303.946 2230.65 339.379 2210.92C410.21 2171.47 479.085 2127.6 505.109 2110.26C534.037 2090.97 561.154 2089 586.886 2098.27C610.491 2106.78 632.053 2124.58 651.747 2140.86C665.041 2151.86 679.447 2161.66 694.722 2172.06C697.949 2174.26 701.216 2176.48 704.519 2178.75C723.021 2191.44 742.345 2205.3 759.231 2222.18C805.249 2268.2 850.261 2319.54 891.907 2368.53C905.635 2384.68 918.642 2400.61 931.413 2416.24C968.028 2461.05 1002.69 2503.48 1046.77 2542.05C1053.32 2547.79 1060.08 2554.15 1066.75 2560.44L1067.21 2560.88C1073.81 2567.11 1080.39 2573.31 1087.09 2579.27C1100.98 2591.63 1114.28 2601.9 1127.07 2607.99C1136.77 2612.6 1146.62 2616.88 1156.83 2621.32C1158.09 2621.86 1159.36 2622.41 1160.63 2622.96C1172.08 2627.94 1183.92 2633.15 1195.62 2639C1205.01 2643.7 1208.81 2655.11 1204.12 2664.49C1199.43 2673.88 1188.02 2677.68 1178.63 2672.99C1167.93 2667.64 1156.92 2662.78 1145.48 2657.81C1144.23 2657.27 1142.97 2656.72 1141.7 2656.17C1131.56 2651.77 1121.07 2647.22 1110.74 2642.29C1092.93 2633.82 1076.38 2620.6 1061.84 2607.66C1054.71 2601.32 1047.78 2594.79 1041.29 2588.66L1040.67 2588.08C1033.91 2581.7 1027.67 2575.83 1021.75 2570.65C975.065 2529.8 937.574 2483.9 900.405 2438.39C887.996 2423.19 875.623 2408.05 862.956 2393.14C821.486 2344.36 777.27 2293.96 732.362 2249.05C718.144 2234.83 701.342 2222.65 683.019 2210.08C679.995 2208 676.916 2205.91 673.802 2203.79C658.494 2193.38 642.327 2182.38 627.532 2170.14C606.577 2152.82 590.205 2139.86 574.008 2134.02ZM573.302 2293.3C576.621 2303.26 571.241 2314.02 561.287 2317.33C532.833 2326.82 506.05 2339.9 477.863 2353.67C476.189 2354.48 474.511 2355.3 472.826 2356.13C443.185 2370.59 411.96 2385.53 377.809 2395.66C375.706 2396.28 373.651 2396.89 371.638 2397.48C347.295 2404.66 329.272 2409.97 311.04 2422.12C302.31 2427.95 290.514 2425.59 284.694 2416.86C278.873 2408.13 281.233 2396.33 289.963 2390.51C313.223 2375 336.677 2368.13 360.163 2361.24C362.443 2360.57 364.722 2359.9 367.002 2359.23C397.761 2350.1 426.389 2336.5 456.166 2321.98C458.018 2321.07 459.876 2320.17 461.739 2319.25C489.418 2305.73 518.331 2291.6 549.271 2281.29C559.225 2277.97 569.984 2283.35 573.302 2293.3Z" fill="black"/>
+</svg>
diff --git a/img/banner-lr.jpg b/img/banner-lr.jpg
new file mode 100644
index 0000000..1919211
Binary files /dev/null and b/img/banner-lr.jpg differ
diff --git a/img/banner.jpg b/img/banner.jpg
new file mode 100644
index 0000000..66822b3
Binary files /dev/null and b/img/banner.jpg differ
diff --git a/img/img-1.jpg b/img/img-1.jpg
new file mode 100644
index 0000000..6e18653
Binary files /dev/null and b/img/img-1.jpg differ
diff --git a/img/img-2.jpg b/img/img-2.jpg
new file mode 100644
index 0000000..5e65ae0
Binary files /dev/null and b/img/img-2.jpg differ
diff --git a/img/img-3.jpg b/img/img-3.jpg
new file mode 100644
index 0000000..9f7b9bf
Binary files /dev/null and b/img/img-3.jpg differ
diff --git a/index.html b/index.html
index 6e2981f..5389c62 100644
--- a/index.html
+++ b/index.html
@@ -1,7 +1,576 @@
-<!DOCTYPE html>
-<html lang="en">
-    <head>
-        <meta name="viewport" content="width=device-width, initial-scale=1.0">
-        
-    </head>
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+
+    <title>Boookib - Getting Easy Web</title>
+
+    <link rel="icon" type="image/png" href="fav.ico">
+    <link rel="shortcut icon" type="image/x-icon" href="fav.ico">
+
+    <link rel="stylesheet" href="style.css">
+    <link rel="stylesheet" href="media.min.css">
+    <link rel="stylesheet" href="animations.css">
+</head>
+
+<body data-new-gr-c-s-check-loaded="14.1030.0" data-gr-ext-installed="" cz-shortcut-listen="true">
+    <div class="container">
+        <div class="header">
+
+            <div class="logo">
+                <a href="index.html"><img src="logo.png" alt="">
+                    <span class="logo-text">boookib</span>
+                </a>
+            </div>
+
+            <div class="search-cont">
+                <form action="search.html" method="get" target="_self" class="form-cont">
+                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                    <!-- remove code from below because that's an alternate image of icon -->
+                    <img src="fav.ico" alt="">
+                    <input type="text/search" name="result" placeholder="search thing" class="input-mode">
+                </form>
+            </div>
+
+            <div class="documentation">
+                <h3 class="target-link"><a href="from-category.html">supports</a></h3>
+                <h3 class="target-link"><a href="#about_us">aboutus</a></h3>
+                <h3 class="target-link">
+                    <a href="#metakib">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="fav.ico" alt="">metakib
+                    </a>
+                </h3>
+            </div>
+
+            <div class="apps-cont">
+                <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                <!-- remove code from below because that's an alternate image of icon -->
+                <img src="fav.ico" alt="">
+                <div class="app-list">
+
+                </div>
+            </div>
+        </div>
+
+        <div class="contents">
+            <div class="hero">
+                <div class="hero-img">
+                    <img src="img/img-2.jpg" alt="" class="hero-img-b">
+                    <img src="img/img-1.jpg" alt="" class="hero-img-t">
+                </div>
+
+                <div class="hero-text">
+                    <h1 class="title">
+                        find your favorite websites in seconds
+                    </h1>
+                    <p class="subtitle">
+                        The ultimate online bookmarking solution. Find and organize your favorite websites with ease.
+                        Try it now!
+                    </p>
+                </div>
+
+                <div class="hero-cta">
+                    <a href="#playing_business">
+                        <button class="cta">
+                            <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                            <!-- remove code from below because that's an alternate image of icon -->
+                            <img src="fav.ico" alt="">playing business
+                        </button>
+                    </a>
+                    <a href="#">
+                        <button class="cta-noicon">
+                            <!-- <ion-icon name="search-outline" class="search-icon"></ion-icon> -->
+                            <!-- remove code from below because that's an alternate image of icon -->
+                            <!-- <img src="fav.ico" alt=""> -->
+                            request new site?
+                        </button>
+                    </a>
+                </div>
+            </div>
+
+            <div class="cards-cont">
+                <div class="cards">
+                    <div class="card">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="logo.png" alt="">
+                        <a href="#book">book</a>
+                    </div>
+                    <div class="card">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="logo.png" alt="">
+                        <a href="#book">book</a>
+                    </div>
+                    <div class="card">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="logo.png" alt="">
+                        <a href="#book">book</a>
+                    </div>
+                    <div class="card">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="logo.png" alt="">
+                        <a href="#book">book</a>
+                    </div>
+                </div>
+                <div class="cards">
+                    <div class="card">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="logo.png" alt="">
+                        <a href="#book">book</a>
+                    </div>
+                    <div class="card">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="logo.png" alt="">
+                        <a href="#book">book</a>
+                    </div>
+                    <div class="card">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="logo.png" alt="">
+                        <a href="#book">book</a>
+                    </div>
+                    <div class="card">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="logo.png" alt="">
+                        <a href="#book">book</a>
+                    </div>
+                </div>
+                <div class="cards">
+                    <div class="card">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="logo.png" alt="">
+                        <a href="#book">book</a>
+                    </div>
+                    <div class="card">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="logo.png" alt="">
+                        <a href="#book">book</a>
+                    </div>
+                    <div class="card">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="logo.png" alt="">
+                        <a href="#book">book</a>
+                    </div>
+                    <div class="card">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="logo.png" alt="">
+                        <a href="#book">book</a>
+                    </div>
+                </div>
+
+                <a href="load-more.html">
+                    <div class="cta-load">
+                        load more
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="logo.png" alt="">
+                    </div>
+                </a>
+            </div>
+
+            <div class="target-banner">
+                <h1 class="banner-title">
+                    let's discover us and made life much easier
+                </h1>
+                <div class="banner">
+
+                    <!-- <img src="img/banner-lr.jpg" alt="" class="banner-image-x"> -->
+                    <!-- <img src="img/banner-lr.jpg" alt="" class="banner-image-y"> -->
+                    <img src="img/banner.jpg" alt="" class="banner-image">
+
+                    <!-- <p class="banner-subtitle">
+                        let's discover us and made life much easier
+                    </p> -->
+
+                    <a href="#metakib_override" class="banner-cta cta-load">
+                        go to metakib
+                    </a>
+                </div>
+            </div>
+
+            <div class="expanded-cards-cont">
+                <h1 class="ex-title">
+                    let's discover us and made life much easier
+                </h1>
+                <div class="ex-cards-cont">
+                    <div class="ex-cards">
+                        <div class="ex-card">
+                            <a href="#figma">
+                                <div class="ex-thumb">
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </a>
+                            <div class="ex-desc-cont">
+                                <div class="ex-desc">
+                                    <a href="#w3chools">
+                                        <h4 class="title-4">w3schools</h4>
+                                    </a>
+                                    <p class="ex-short-bio">
+                                        lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                        dolor
+                                        sit amet quer lorem ipsum dolor sit amet quer
+                                    </p>
+                                </div>
+                                <div class="ex-categ">
+                                    <a href="#free" class="ex-label">free</a>
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </div>
+                        </div>
+                        <div class="ex-card">
+                            <a href="#figma">
+                                <div class="ex-thumb">
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </a>
+                            <div class="ex-desc-cont">
+                                <div class="ex-desc">
+                                    <a href="#w3chools">
+                                        <h4 class="title-4">w3schools</h4>
+                                    </a>
+                                    <p class="ex-short-bio">
+                                        lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                        dolor
+                                        sit amet quer lorem ipsum dolor sit amet quer
+                                    </p>
+                                </div>
+                                <div class="ex-categ">
+                                    <a href="#free" class="ex-label">free</a>
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </div>
+                        </div>
+                        <div class="ex-card">
+                            <a href="#figma">
+                                <div class="ex-thumb">
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </a>
+                            <div class="ex-desc-cont">
+                                <div class="ex-desc">
+                                    <a href="#w3chools">
+                                        <h4 class="title-4">w3schools</h4>
+                                    </a>
+                                    <p class="ex-short-bio">
+                                        lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                        dolor
+                                        sit amet quer lorem ipsum dolor sit amet quer
+                                    </p>
+                                </div>
+                                <div class="ex-categ">
+                                    <a href="#free" class="ex-label">free</a>
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </div>
+                        </div>
+                        <div class="ex-card">
+                            <a href="#figma">
+                                <div class="ex-thumb">
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </a>
+                            <div class="ex-desc-cont">
+                                <div class="ex-desc">
+                                    <a href="#w3chools">
+                                        <h4 class="title-4">w3schools</h4>
+                                    </a>
+                                    <p class="ex-short-bio">
+                                        lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                        dolor
+                                        sit amet quer lorem ipsum dolor sit amet quer
+                                    </p>
+                                </div>
+                                <div class="ex-categ">
+                                    <a href="#free" class="ex-label">free</a>
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                    <div class="ex-cards">
+                        <div class="ex-card">
+                            <a href="#figma">
+                                <div class="ex-thumb">
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </a>
+                            <div class="ex-desc-cont">
+                                <div class="ex-desc">
+                                    <a href="#w3chools">
+                                        <h4 class="title-4">w3schools</h4>
+                                    </a>
+                                    <p class="ex-short-bio">
+                                        lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                        dolor
+                                        sit amet quer lorem ipsum dolor sit amet quer
+                                    </p>
+                                </div>
+                                <div class="ex-categ">
+                                    <a href="#free" class="ex-label">free</a>
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </div>
+                        </div>
+                        <div class="ex-card">
+                            <a href="#figma">
+                                <div class="ex-thumb">
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </a>
+                            <div class="ex-desc-cont">
+                                <div class="ex-desc">
+                                    <a href="#w3chools">
+                                        <h4 class="title-4">w3schools</h4>
+                                    </a>
+                                    <p class="ex-short-bio">
+                                        lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                        dolor
+                                        sit amet quer lorem ipsum dolor sit amet quer
+                                    </p>
+                                </div>
+                                <div class="ex-categ">
+                                    <a href="#free" class="ex-label">free</a>
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </div>
+                        </div>
+                        <div class="ex-card">
+                            <a href="#figma">
+                                <div class="ex-thumb">
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </a>
+                            <div class="ex-desc-cont">
+                                <div class="ex-desc">
+                                    <a href="#w3chools">
+                                        <h4 class="title-4">w3schools</h4>
+                                    </a>
+                                    <p class="ex-short-bio">
+                                        lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                        dolor
+                                        sit amet quer lorem ipsum dolor sit amet quer
+                                    </p>
+                                </div>
+                                <div class="ex-categ">
+                                    <a href="#free" class="ex-label">free</a>
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </div>
+                        </div>
+                        <div class="ex-card">
+                            <a href="#figma">
+                                <div class="ex-thumb">
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </a>
+                            <div class="ex-desc-cont">
+                                <div class="ex-desc">
+                                    <a href="#w3chools">
+                                        <h4 class="title-4">w3schools</h4>
+                                    </a>
+                                    <p class="ex-short-bio">
+                                        lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                        dolor
+                                        sit amet quer lorem ipsum dolor sit amet quer
+                                    </p>
+                                </div>
+                                <div class="ex-categ">
+                                    <a href="#free" class="ex-label">free</a>
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+
+                    <a href="load-more-2.html">
+                        <div class="cta-load">
+                            load more
+                            <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                            <!-- remove code from below because that's an alternate image of icon -->
+                            <img src="logo.png" alt="">
+                        </div>
+                    </a>
+                </div>
+            </div>
+
+            <div class="newsletter-cont" id="submit-mail">
+                <h3 class="newsletter-title">
+                    Subscribe to our virtual bookmarks and save time browsing!
+                </h3>
+
+                <div id="subscribe">
+                    <form action="newsletter-success.html" class="subscribe-form">
+
+                        <input type="text/mail" name="email subscription success" id="input-mail" class="input"
+                            placeholder="yourmail@example.com">
+
+                        <button type="submit" class="button" id="submit">
+                            <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                            <!-- remove code from below because that's an alternate image of icon -->
+                            <img src="fav.ico" alt="">
+                            get notifications
+                        </button>
+                    </form>
+                </div>
+            </div>
+
+            <div class="footer-cont">
+                <div class="footer">
+                    <img src="logo.png" alt="" class="footer-logo">
+                    <div class="products-n-services">
+
+                        <div class="other-products">
+                            <h4 class="products-title">products</h4>
+                            <div class="products-list">
+                                <a href="#edukib.html">edukib </a>
+                                <a href="#vidokib.html">vidokib </a>
+                                <a href="#photozos.html">photozos </a>
+                                <a href="#musikib.html">musikib </a>
+                                <a href="#jobkib.html">jobkib </a>
+                            </div>
+                        </div>
+
+                        <div class="services">
+                            <h4 class="services-title">help & supports</h4>
+                            <div class="services-list">
+                                <a href="#services">services_1 </a>
+                                <a href="#services">services_2 </a>
+                                <a href="#services">services_3 </a>
+                                <a href="#services">services_4 </a>
+                                <a href="#services">services_5 </a>
+                            </div>
+                        </div>
+                        <div class="services">
+                            <h4 class="services-title">FAQ</h4>
+                            <div class="services-list">
+                                <a href="#services">services_1 </a>
+                                <a href="#services">services_2 </a>
+                                <a href="#services">services_3 </a>
+                                <a href="#services">services_4 </a>
+                                <a href="#services">services_5 </a>
+                            </div>
+                        </div>
+                        <div class="services">
+                            <h4 class="services-title">site map</h4>
+                            <div class="services-list">
+                                <a href="#services">services_1 </a>
+                                <a href="#services">services_2 </a>
+                                <a href="#services">services_3 </a>
+                                <a href="#services">services_4 </a>
+                                <a href="#services">services_5 </a>
+                            </div>
+                        </div>
+                        <div class="services">
+                            <h4 class="services-title">library</h4>
+                            <div class="services-list">
+                                <a href="#services">services_1 </a>
+                                <a href="#services">services_2 </a>
+                                <a href="#services">services_3 </a>
+                                <a href="#services">services_4 </a>
+                                <a href="#services">services_5 </a>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+
+                <div class="footer-bottom">
+                    <div class="our-documentation">
+                        <p class="copyrights">
+                            Copyrights © 2023 Boookib from
+                            <a href="" class="company-link" style="padding-left: 4px;">
+                                Metakib
+                            </a>
+                        </p>
+                        <span class="divider">|</span>
+
+                        <a href="#Privacy_Policy" class="company-link">
+                            Privacy Policy
+                        </a>
+                        <span class="divider">|</span>
+
+                        <a href="#Security" class="company-link">
+                            Security
+                        </a>
+                        <span class="divider">|</span>
+
+                        <a href="#Terms_of_Service" class="company-link">
+                            Terms of Service
+                        </a>
+                    </div>
+
+                    <div class="social-networks">
+                        <a href="#facebook.com">
+                            <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        </a>
+                        <a href="#twitter.com">
+                            <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        </a>
+                        <a href="#instagram.com">
+                            <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        </a>
+                        <a href="#linkedin.com">
+                            <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        </a>
+                        <a href="#discord.com">
+                            <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        </a>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <a href="#facebook.com"><img src="fav.ico" alt=""></a>
+                        <a href="#twitter.com"><img src="fav.ico" alt=""></a>
+                        <a href="#instagram.com"><img src="fav.ico" alt=""></a>
+                        <a href="#linkedin.com"><img src="fav.ico" alt=""></a>
+                        <a href="#discord.com"><img src="fav.ico" alt=""></a>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</body>
 </html>
\ No newline at end of file
diff --git a/index.js b/index.js
new file mode 100644
index 0000000..1bf1a35
--- /dev/null
+++ b/index.js
@@ -0,0 +1,28 @@
+// Function to save the back-to-top button state in local storage
+function saveBackToTopState() {
+    var isBackToTopEnabled = document.getElementById('back-to-top').checked;
+    localStorage.setItem('backToTopEnabled', isBackToTopEnabled);
+}
+
+// Function to load the back-to-top button state from local storage
+function loadBackToTopState() {
+    var isBackToTopEnabled = localStorage.getItem('backToTopEnabled');
+    if (isBackToTopEnabled === 'true') {
+        document.getElementById('back-to-top').checked = true;
+    }
+}
+
+// Function to scroll to the top of the page
+function scrollToTop() {
+    window.scrollTo({ top: 0, behavior: 'smooth' });
+}
+
+// Show/hide the back-to-top button based on the checkbox state
+document.getElementById('back-to-top').addEventListener('change', function () {
+    var backToTopButton = document.querySelector('button');
+    if (this.checked) {
+        backToTopButton.style.display = 'block';
+    } else {
+        backToTopButton.style.display = 'none';
+    }
+});
diff --git a/innersearch.css b/innersearch.css
new file mode 100644
index 0000000..231f30b
--- /dev/null
+++ b/innersearch.css
@@ -0,0 +1,204 @@
+.logo-text {
+    display: none;
+}
+
+.prev-btn,
+.prev-btn a {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    gap: 8px;
+    text-transform: capitalize;
+}
+
+.next-btn,
+.next-btn a {
+    display: flex;
+    flex-direction: row-reverse;
+    align-items: center;
+    gap: 8px;
+    text-transform: capitalize;
+}
+
+.prev-btn a:hover,
+.next-btn a:hover {
+    color: red;
+}
+
+.prev {
+    display: block;
+}
+
+.search-top-sug-cont {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    gap: 48px;
+    justify-content: center;
+    position: relative;
+    /* top: calc(180% - 50px); */
+}
+
+.top-sug-cont {
+    display: flex;
+    flex-direction: column;
+    align-items: flex-start;
+    gap: 12px;
+}
+
+.top-sug {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    gap: 8px;
+}
+
+.top-sug-title {
+    display: block;
+    font-size: 16px;
+    line-height: 24px;
+}
+
+.sug-show-list-cont {
+    display: none;
+    /* display: flex; */
+    gap: 16px;
+    flex-direction: column;
+    background-color: #fff;
+    padding: 24px;
+    border-radius: 12px;
+    box-sizing: border-box;
+    box-shadow: 0px 1px 20px -5px #0000002b;
+}
+
+.sug-show-list {
+    display: flex;
+    gap: 0px;
+    padding: 0px;
+    border-radius: 12px;
+}
+
+.sug-show-list img {
+    width: 18px;
+    height: 18px;
+}
+
+.sug-text {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: center;
+    padding-left: 16px;
+    color: red;
+    font-size: 14px;
+    line-height: 22px;
+}
+
+
+.sug-text:hover {
+    color: #000000;
+}
+
+
+
+/* expanded search bar */
+.ex-search-bar-cont {
+    display: flex;
+    flex-direction: column;
+    gap: 48px;
+    position: relative;
+    width: 100%;
+    margin-top: 5%;
+    align-items: center;
+}
+
+.ex-search-bar {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    width: fit-content;
+    width: 80%;
+}
+
+.ex-search-form {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    gap: 16px;
+    padding: 0px 12px;
+    width: 100%;
+    background: #ffffff;
+    border-radius: 100px;
+    border: 2px transparent solid;
+    outline: none;
+    box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.048);
+}
+
+.ex-search-form:hover {
+    border: 2px #c2c8ff solid;
+}
+
+.ex-search-form:focus-within {
+    box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.118);
+}
+
+.input-search,
+#input-search {
+    display: flex;
+    width: 2000px;
+    padding: 20px;
+    border: 2px transparent solid;
+    border-radius: 100px;
+    outline: none;
+    background-color: transparent;
+}
+
+
+.ex-search-form:hover,
+.input-search:hover,
+#input-search:hover {
+    background: #f6f6ff;
+}
+
+.input-search:focus-within,
+#input-search:focus-within,
+.ex-search-form:focus-within {
+    background-color: #ffffff;
+    border: transparent 2px solid;
+}
+
+
+
+.search-type-label {
+    display: flex;
+    flex-wrap: wrap;
+    flex-direction: row;
+    gap: 12px;
+}
+
+.type-label {
+    display: flex;
+    flex-direction: row;
+    flex-wrap: wrap;
+    gap: 12px;
+    float: left;
+    width: auto;
+}
+
+.s-label>input[type='checkbox'],
+input[type='checkbox'],
+.s-label>input[name='checkbox'],
+input[name='checkbox'],
+.s-label>input[id='checked'],
+input[id='checked'],
+.s-label>input[role='checkbox'],
+input[role='checkbox'] {
+    width: 17px;
+    height: 17px;
+    outline: none;
+    border: none;
+}
+
+#checked {
+    display: block;
+}
\ No newline at end of file
diff --git a/load-more-2.css b/load-more-2.css
new file mode 100644
index 0000000..e69de29
diff --git a/load-more-2.html b/load-more-2.html
new file mode 100644
index 0000000..aefff3c
--- /dev/null
+++ b/load-more-2.html
@@ -0,0 +1,629 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+
+    <title>More Fav Bookmarks | Boookib</title>
+
+    <link rel="icon" type="image/png" href="fav.ico">
+    <link rel="shortcut icon" type="image/x-icon" href="logo.png">
+
+    <link rel="stylesheet" href="load-more.css">
+    <link rel="stylesheet" href="innersearch.css">
+    <link rel="stylesheet" href="style.css">
+    <!-- <link rel="stylesheet" href="from-category.css"> -->
+</head>
+
+<body class="container" data-new-gr-c-s-check-loaded="14.1030.0" data-gr-ext-installed="" cz-shortcut-listen="true">
+    <div class="header">
+
+        <div class="logo">
+            <a href="index.html"><img src="logo.png" alt="">
+                <span class="logo-text">boookib</span>
+            </a>
+        </div>
+
+        <div class="prev-btn">
+            <a href="index.html">
+                <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                <!-- remove code from below because that's an alternate image of icon -->
+                <img src="fav.ico" alt="">
+                back
+            </a>
+        </div>
+
+        <div class="search-top-sug-cont">
+            <div class="top-sug-cont">
+                <div class="top-sug">
+                    <span class="top-sug-title">Recent search</span>
+                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                    <!-- remove code from below because that's an alternate image of icon -->
+                    <img src="fav.ico" alt="">
+                </div>
+
+                <div class="sug-show-list-cont">
+                    <div class="sug-show-list">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="fav.ico" alt="">
+                        <a href="#back-to-search" class="sug-text">
+                            last session search
+                        </a>
+                    </div>
+                    <div class="sug-show-list">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="fav.ico" alt="">
+                        <a href="#back-to-search" class="sug-text">
+                            last session
+                        </a>
+                    </div>
+                    <div class="sug-show-list">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="fav.ico" alt="">
+                        <a href="#back-to-search" class="sug-text">
+                            last search
+                        </a>
+                    </div>
+                    <div class="sug-show-list">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="fav.ico" alt="">
+                        <a href="#back-to-search" class="sug-text">
+                            session search
+                        </a>
+                    </div>
+                    <div class="sug-show-list">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="fav.ico" alt="">
+                        <a href="#back-to-search" class="sug-text">
+                            session search
+                        </a>
+                    </div>
+                    <div class="sug-show-list">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="fav.ico" alt="">
+                        <a href="#back-to-search" class="sug-text">
+                            session search
+                        </a>
+                    </div>
+                </div>
+            </div>
+
+            <div class="top-sug-cont">
+                <div class="top-sug">
+                    <span class="top-sug-title">Visited on results</span>
+                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                    <!-- remove code from below because that's an alternate image of icon -->
+                    <img src="fav.ico" alt="">
+                </div>
+
+                <div class="sug-show-list-cont">
+                    <div class="sug-show-list">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="fav.ico" alt="">
+                        <a href="#back-to-search" class="sug-text">
+                            last session search
+                        </a>
+                    </div>
+                    <div class="sug-show-list">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="fav.ico" alt="">
+                        <a href="#back-to-search" class="sug-text">
+                            last session
+                        </a>
+                    </div>
+                    <div class="sug-show-list">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="fav.ico" alt="">
+                        <a href="#back-to-search" class="sug-text">
+                            last search
+                        </a>
+                    </div>
+                    <div class="sug-show-list">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="fav.ico" alt="">
+                        <a href="#back-to-search" class="sug-text">
+                            session search
+                        </a>
+                    </div>
+                    <div class="sug-show-list">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="fav.ico" alt="">
+                        <a href="#back-to-search" class="sug-text">
+                            session search
+                        </a>
+                    </div>
+                    <div class="sug-show-list">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="fav.ico" alt="">
+                        <a href="#back-to-search" class="sug-text">
+                            session search
+                        </a>
+                    </div>
+                </div>
+            </div>
+
+            <div class="top-sug-cont">
+                <div class="top-sug">
+                    <span class="top-sug-title">Saved alternates</span>
+                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                    <!-- remove code from below because that's an alternate image of icon -->
+                    <img src="fav.ico" alt="">
+                </div>
+                <div class="sug-show-list-cont">
+                    <div class="sug-show-list">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="fav.ico" alt="">
+                        <a href="#back-to-search" class="sug-text">
+                            last session search
+                        </a>
+                    </div>
+                    <div class="sug-show-list">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="fav.ico" alt="">
+                        <a href="#back-to-search" class="sug-text">
+                            last session
+                        </a>
+                    </div>
+                    <div class="sug-show-list">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="fav.ico" alt="">
+                        <a href="#back-to-search" class="sug-text">
+                            last search
+                        </a>
+                    </div>
+                    <div class="sug-show-list">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="fav.ico" alt="">
+                        <a href="#back-to-search" class="sug-text">
+                            session search
+                        </a>
+                    </div>
+                    <div class="sug-show-list">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="fav.ico" alt="">
+                        <a href="#back-to-search" class="sug-text">
+                            session search
+                        </a>
+                    </div>
+                    <div class="sug-show-list">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="fav.ico" alt="">
+                        <a href="#back-to-search" class="sug-text">
+                            session search
+                        </a>
+                    </div>
+                </div>
+            </div>
+        </div>
+
+        <div class="small-search-bar">
+            <form action="load-more.html" method="get">
+                <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                <!-- remove code from below because that's an alternate image of icon -->
+                <img src="fav.ico" alt="">
+                <input type="text/search" placeholder="enter search" name="search result" id="search-input-small"
+                    class="search-input-small">
+            </form>
+        </div>
+
+        <!-- code of #apps & #profile -->
+
+    </div>
+
+    <div class="contents">
+        <div class="hero-cont">
+            <div class="heading">
+                <h1 class="head-title">
+                    help each everyone and get most easy-life
+                </h1>
+                <p class="head-subtitle">
+                    Now you can add new categories to our boookmarking. Have you know websites that might help
+                    peoples lot of...
+                </p>
+            </div>
+
+            <div class="category-submit-form-cont site-submit-form-cont">
+                <div class="form-collapse">
+                    <ion-icon name="search-outline" class="search-icon" id="collapse-icon"></ion-icon>
+                    <!-- remove code from below because that's an alternate image of icon -->
+                    <img src="fav.ico" alt="" id="collapse-icon">
+                </div>
+                <form action="load-more-2.html" method="get">
+                    <div class="ctgry-submit-form">
+                        <div class="new-site">
+                            <h4 class="cate-title">create new category</h4>
+                            <input type="text" placeholder="e.g: www.website.com" name="category title"
+                                id="cate-title-input" required>
+
+                            <input type="text" placeholder="Write how can your provided site help others..."
+                                name="category title" id="cate-title-input" class="cate-text-field" required>
+
+                            <input type="text" placeholder="e.g: www.website.com" name="category title"
+                                id="cate-title-input">
+                        </div>
+                        <button type="submit" id="ui-submit">submit</button>
+                    </div>
+
+                    <div class="upload-cover-cont">
+                        <div class="up-cov-title">
+                            <h4 class="uc-title">upload cover image</h4>
+                            <p class="uc-subtitle">
+                                Your cover image size must be 1440x500
+                            </p>
+                        </div>
+                        <div class="dragNdrop">
+                            <p class="uc-subtitle-2">
+                                drag and drop or paste here or click to upload
+                            </p>
+                            <img src="fav.ico" alt="">
+                        </div>
+                    </div>
+                </form>
+            </div>
+        </div>
+
+        <div class="browse-categories-cont">
+            <h3 class="categories-title">brows categories</h3>
+            <div class="categories">
+                <h5 class="ctgrs-heading">artificial intelligence</h5>
+                <div class="ex-cards">
+                    <div class="ex-card">
+                        <a href="#figma">
+                            <div class="ex-thumb">
+                                <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                <!-- remove code from below because that's an alternate image of icon -->
+                                <img src="logo.png" alt="">
+                            </div>
+                        </a>
+                        <div class="ex-desc-cont">
+                            <div class="ex-desc">
+                                <a href="#w3chools">
+                                    <h4 class="title-4">w3schools</h4>
+                                </a>
+                                <p class="ex-short-bio">
+                                    lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                    dolor
+                                    sit amet quer lorem ipsum dolor sit amet quer
+                                </p>
+                            </div>
+                            <div class="ex-categ">
+                                <a href="#free" class="ex-label">free</a>
+                                <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                <!-- remove code from below because that's an alternate image of icon -->
+                                <img src="logo.png" alt="">
+                            </div>
+                        </div>
+                    </div>
+                    <div class="ex-card">
+                        <a href="#figma">
+                            <div class="ex-thumb">
+                                <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                <!-- remove code from below because that's an alternate image of icon -->
+                                <img src="logo.png" alt="">
+                            </div>
+                        </a>
+                        <div class="ex-desc-cont">
+                            <div class="ex-desc">
+                                <a href="#w3chools">
+                                    <h4 class="title-4">w3schools</h4>
+                                </a>
+                                <p class="ex-short-bio">
+                                    lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                    dolor
+                                    sit amet quer lorem ipsum dolor sit amet quer
+                                </p>
+                            </div>
+                            <div class="ex-categ">
+                                <a href="#free" class="ex-label">free</a>
+                                <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                <!-- remove code from below because that's an alternate image of icon -->
+                                <img src="logo.png" alt="">
+                            </div>
+                        </div>
+                    </div>
+                    <div class="ex-card">
+                        <a href="#figma">
+                            <div class="ex-thumb">
+                                <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                <!-- remove code from below because that's an alternate image of icon -->
+                                <img src="logo.png" alt="">
+                            </div>
+                        </a>
+                        <div class="ex-desc-cont">
+                            <div class="ex-desc">
+                                <a href="#w3chools">
+                                    <h4 class="title-4">w3schools</h4>
+                                </a>
+                                <p class="ex-short-bio">
+                                    lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                    dolor
+                                    sit amet quer lorem ipsum dolor sit amet quer
+                                </p>
+                            </div>
+                            <div class="ex-categ">
+                                <a href="#free" class="ex-label">free</a>
+                                <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                <!-- remove code from below because that's an alternate image of icon -->
+                                <img src="logo.png" alt="">
+                            </div>
+                        </div>
+                    </div>
+                    <div class="ex-card">
+                        <a href="#figma">
+                            <div class="ex-thumb">
+                                <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                <!-- remove code from below because that's an alternate image of icon -->
+                                <img src="logo.png" alt="">
+                            </div>
+                        </a>
+                        <div class="ex-desc-cont">
+                            <div class="ex-desc">
+                                <a href="#w3chools">
+                                    <h4 class="title-4">w3schools</h4>
+                                </a>
+                                <p class="ex-short-bio">
+                                    lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                    dolor
+                                    sit amet quer lorem ipsum dolor sit amet quer
+                                </p>
+                            </div>
+                            <div class="ex-categ">
+                                <a href="#free" class="ex-label">free</a>
+                                <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                <!-- remove code from below because that's an alternate image of icon -->
+                                <img src="logo.png" alt="">
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="categories">
+                <h5 class="ctgrs-heading">animations</h5>
+                <div class="ex-cards">
+                    <div class="ex-card">
+                        <a href="#figma">
+                            <div class="ex-thumb">
+                                <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                <!-- remove code from below because that's an alternate image of icon -->
+                                <img src="logo.png" alt="">
+                            </div>
+                        </a>
+                        <div class="ex-desc-cont">
+                            <div class="ex-desc">
+                                <a href="#w3chools">
+                                    <h4 class="title-4">w3schools</h4>
+                                </a>
+                                <p class="ex-short-bio">
+                                    lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                    dolor
+                                    sit amet quer lorem ipsum dolor sit amet quer
+                                </p>
+                            </div>
+                            <div class="ex-categ">
+                                <a href="#free" class="ex-label">free</a>
+                                <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                <!-- remove code from below because that's an alternate image of icon -->
+                                <img src="logo.png" alt="">
+                            </div>
+                        </div>
+                    </div>
+                    <div class="ex-card">
+                        <a href="#figma">
+                            <div class="ex-thumb">
+                                <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                <!-- remove code from below because that's an alternate image of icon -->
+                                <img src="logo.png" alt="">
+                            </div>
+                        </a>
+                        <div class="ex-desc-cont">
+                            <div class="ex-desc">
+                                <a href="#w3chools">
+                                    <h4 class="title-4">w3schools</h4>
+                                </a>
+                                <p class="ex-short-bio">
+                                    lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                    dolor
+                                    sit amet quer lorem ipsum dolor sit amet quer
+                                </p>
+                            </div>
+                            <div class="ex-categ">
+                                <a href="#free" class="ex-label">free</a>
+                                <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                <!-- remove code from below because that's an alternate image of icon -->
+                                <img src="logo.png" alt="">
+                            </div>
+                        </div>
+                    </div>
+                    <div class="ex-card">
+                        <a href="#figma">
+                            <div class="ex-thumb">
+                                <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                <!-- remove code from below because that's an alternate image of icon -->
+                                <img src="logo.png" alt="">
+                            </div>
+                        </a>
+                        <div class="ex-desc-cont">
+                            <div class="ex-desc">
+                                <a href="#w3chools">
+                                    <h4 class="title-4">w3schools</h4>
+                                </a>
+                                <p class="ex-short-bio">
+                                    lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                    dolor
+                                    sit amet quer lorem ipsum dolor sit amet quer
+                                </p>
+                            </div>
+                            <div class="ex-categ">
+                                <a href="#free" class="ex-label">free</a>
+                                <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                <!-- remove code from below because that's an alternate image of icon -->
+                                <img src="logo.png" alt="">
+                            </div>
+                        </div>
+                    </div>
+                    <div class="ex-card">
+                        <a href="#figma">
+                            <div class="ex-thumb">
+                                <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                <!-- remove code from below because that's an alternate image of icon -->
+                                <img src="logo.png" alt="">
+                            </div>
+                        </a>
+                        <div class="ex-desc-cont">
+                            <div class="ex-desc">
+                                <a href="#w3chools">
+                                    <h4 class="title-4">w3schools</h4>
+                                </a>
+                                <p class="ex-short-bio">
+                                    lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                    dolor
+                                    sit amet quer lorem ipsum dolor sit amet quer
+                                </p>
+                            </div>
+                            <div class="ex-categ">
+                                <a href="#free" class="ex-label">free</a>
+                                <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                <!-- remove code from below because that's an alternate image of icon -->
+                                <img src="logo.png" alt="">
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+
+        <div class="footer-cont">
+            <div class="footer">
+                <img src="logo.png" alt="" class="footer-logo">
+                <div class="products-n-services">
+
+                    <div class="other-products">
+                        <h4 class="products-title">products</h4>
+                        <div class="products-list">
+                            <a href="#edukib.html">edukib </a>
+                            <a href="#vidokib.html">vidokib </a>
+                            <a href="#photozos.html">photozos </a>
+                            <a href="#musikib.html">musikib </a>
+                            <a href="#jobkib.html">jobkib </a>
+                        </div>
+                    </div>
+
+                    <div class="services">
+                        <h4 class="services-title">help & supports</h4>
+                        <div class="services-list">
+                            <a href="#services">services_1 </a>
+                            <a href="#services">services_2 </a>
+                            <a href="#services">services_3 </a>
+                            <a href="#services">services_4 </a>
+                            <a href="#services">services_5 </a>
+                        </div>
+                    </div>
+                    <div class="services">
+                        <h4 class="services-title">FAQ</h4>
+                        <div class="services-list">
+                            <a href="#services">services_1 </a>
+                            <a href="#services">services_2 </a>
+                            <a href="#services">services_3 </a>
+                            <a href="#services">services_4 </a>
+                            <a href="#services">services_5 </a>
+                        </div>
+                    </div>
+                    <div class="services">
+                        <h4 class="services-title">site map</h4>
+                        <div class="services-list">
+                            <a href="#services">services_1 </a>
+                            <a href="#services">services_2 </a>
+                            <a href="#services">services_3 </a>
+                            <a href="#services">services_4 </a>
+                            <a href="#services">services_5 </a>
+                        </div>
+                    </div>
+                    <div class="services">
+                        <h4 class="services-title">library</h4>
+                        <div class="services-list">
+                            <a href="#services">services_1 </a>
+                            <a href="#services">services_2 </a>
+                            <a href="#services">services_3 </a>
+                            <a href="#services">services_4 </a>
+                            <a href="#services">services_5 </a>
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+            <div class="footer-bottom">
+                <div class="our-documentation">
+                    <p class="copyrights">
+                        Copyrights © 2023 Boookib from
+                        <a href="#Metakib" class="company-link" style="padding-left: 4px;">
+                            Metakib
+                        </a>
+                    </p>
+                    <span class="divider">|</span>
+
+                    <a href="#Privacy_Policy" class="company-link">
+                        Privacy Policy
+                    </a>
+                    <span class="divider">|</span>
+
+                    <a href="#Security" class="company-link">
+                        Security
+                    </a>
+                    <span class="divider">|</span>
+
+                    <a href="#Terms_of_Service" class="company-link">
+                        Terms of Service
+                    </a>
+                </div>
+
+                <div class="social-networks">
+                    <a href="#facebook.com">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                    </a>
+                    <a href="#twitter.com">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                    </a>
+                    <a href="#instagram.com">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                    </a>
+                    <a href="#linkedin.com">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                    </a>
+                    <a href="#discord.com">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                    </a>
+                    <!-- remove code from below because that's an alternate image of icon -->
+                    <a href="#facebook.com"><img src="fav.ico" alt=""></a>
+                    <a href="#twitter.com"><img src="fav.ico" alt=""></a>
+                    <a href="#instagram.com"><img src="fav.ico" alt=""></a>
+                    <a href="#linkedin.com"><img src="fav.ico" alt=""></a>
+                    <a href="#discord.com"><img src="fav.ico" alt=""></a>
+                </div>
+            </div>
+        </div>
+
+    </div>
+
+</body>
+
+</html>
\ No newline at end of file
diff --git a/load-more.css b/load-more.css
new file mode 100644
index 0000000..c28661d
--- /dev/null
+++ b/load-more.css
@@ -0,0 +1,247 @@
+/* .small-search-bar:focus-within, */
+.small-search-bar form:focus-within,
+.small-search-bar input:focus-within {
+    width: 95%;
+}
+
+.small-search-bar form,
+.small-search-bar input {
+    width: 75%;
+}
+
+.small-search-bar form {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    gap: 16px;
+    padding: 16px 0px;
+    border-radius: 32px;
+    border: 2px transparent solid;
+    background-color: #e6e6e6;
+}
+
+.search-input-small,#search-input-small {
+    background-color: transparent;
+}
+
+.small-search-bar input {
+    display: block;
+    border: none;
+    outline: none;
+    background-color: #fff;
+}
+
+.small-search-bar form:hover {
+    background-color: #fff;
+    border: 2px rgb(0, 255, 60) solid;
+}
+
+.small-search-bar form:focus-within {
+    box-shadow: 0px 0px 10px 0px rgba(0, 4, 255, 0.221);
+    background-color: #fff;
+    border: 2px rgb(0, 255, 60) solid;
+}
+
+
+
+
+.hero-cont {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    gap: 48px;
+}
+
+.heading {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    width: 50%;
+    text-align: center;
+}
+
+.head-title {
+    font-size: 48px;
+    line-height: 56px;
+    text-transform: capitalize;
+}
+
+.head-subtitle {
+    width: 60%;
+    font-size: 14px;
+    line-height: 22px;
+}
+
+
+/* category submit form */
+.category-submit-form-cont,
+.site-submit-form-cont {
+    display: flex;
+    flex-direction: row-reverse;
+    gap: 32px;
+    background-color: #f3f4fe;
+    width: fit-content;
+    padding: 48px;
+    border-radius: 24px;
+    justify-content: center;
+    align-items: flex-start;
+    box-shadow: 0px 0px 50px -5px #dddee9;
+}
+
+.category-submit-form-cont form,
+.site-submit-form-cont form {
+    display: flex;
+    flex-direction: row;
+    gap: 32px;
+}
+
+.form-collapse {
+    padding: 8px 12px;
+    background: #ffffff;
+    height: fit-content;
+    width: fit-content;
+    border-radius: 100px;
+    box-shadow: -2px 5px 8px 0px #0000002e;
+    position: relative;
+}
+
+.ctgry-submit-form {
+    display: flex;
+    flex-direction: column;
+    gap: 32px;
+}
+
+.ctgry-title,
+.new-site {
+    display: flex;
+    flex-direction: column;
+}
+
+.new-site {
+    gap: 16px;
+}
+
+.cate-title {
+    line-height: auto;
+    font-weight: 700;
+    text-transform: capitalize;
+}
+
+#cate-title-input {
+    border: 2px transparent solid;
+    outline: none;
+    padding: 16px;
+    width: auto;
+    border-radius: 8px;
+}
+
+#cate-title-input:focus-within {
+    border: #8bb0ff 2px solid;
+}
+
+#ui-submit {
+    border: none;
+    outline: none;
+    padding: 16px;
+    width: auto;
+    border-radius: 8px;
+    background: #3395FF;
+    color: #fff;
+    font-size: 18px;
+    text-transform: capitalize;
+    cursor: pointer;
+}
+
+#ui-submit:hover {
+    background: #1988ff;
+}
+
+.ctrgy-user-img-upload {
+    display: flex;
+    flex-direction: column;
+    gap: 24px;
+}
+
+.upload-cover-cont,
+.upload-cateicon-cont {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    text-align: center;
+    padding: 12px 32px 32px 32px;
+    border-radius: 24px;
+    background: #fbfcff;
+    box-shadow: 0px 0px 20px -5px #dddee9;
+}
+
+.up-cov-title {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+}
+
+.uc-title {
+    font-size: 18px;
+    line-height: 26px;
+    font-weight: 600;
+    text-transform: capitalize;
+}
+
+.uc-subtitle {
+    font-size: 11px;
+    line-height: 19px;
+    font-weight: 600;
+    text-transform: capitalize;
+}
+
+.uc-subtitle-2 {
+    font-size: 12px;
+    line-height: 20px;
+    font-weight: 400
+}
+
+.dragNdrop {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    border: 2px #b9b9b9 dashed;
+    border-radius: 16px;
+    padding: 20px 12px;
+}
+
+
+
+/* browse categories */
+.browse-categories-cont {
+    padding-left: 64px;
+    display: flex;
+    flex-direction: column;
+}
+
+.categories-title {
+    font-size: 24px;
+    line-height: 32px;
+    font-weight: 600;
+    text-transform: capitalize;
+}
+
+.categories {
+    display: flex;
+    flex-direction: column;
+    padding-bottom: 48px;
+}
+
+.ctgrs-heading {
+    font-size: 13px;
+    line-height: 21px;
+    font-weight: 600;
+}
+
+.ctgrs-heading::first-letter {
+    text-transform: capitalize;
+}
\ No newline at end of file
diff --git a/load-more.html b/load-more.html
new file mode 100644
index 0000000..5fadd30
--- /dev/null
+++ b/load-more.html
@@ -0,0 +1,527 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+
+    <title>More Fav Bookmarks | Boookib</title>
+
+    <link rel="icon" type="image/png" href="fav.ico">
+    <link rel="shortcut icon" type="image/x-icon" href="logo.png">
+
+    <link rel="stylesheet" href="load-more.css">
+    <link rel="stylesheet" href="innersearch.css">
+    <link rel="stylesheet" href="style.css">
+    <link rel="stylesheet" href="from-category.css">
+</head>
+
+<body class="container" data-new-gr-c-s-check-loaded="14.1030.0" data-gr-ext-installed="" cz-shortcut-listen="true">
+    <div class="header">
+
+        <div class="logo">
+            <a href="index.html"><img src="logo.png" alt="">
+                <span class="logo-text">boookib</span>
+            </a>
+        </div>
+
+        <div class="prev-btn">
+            <a href="index.html">
+                <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                <!-- remove code from below because that's an alternate image of icon -->
+                <img src="fav.ico" alt="">
+                back
+            </a>
+        </div>
+
+        <div class="search-top-sug-cont">
+            <div class="top-sug-cont">
+                <div class="top-sug">
+                    <span class="top-sug-title">Recent search</span>
+                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                    <!-- remove code from below because that's an alternate image of icon -->
+                    <img src="fav.ico" alt="">
+                </div>
+
+                <div class="sug-show-list-cont">
+                    <div class="sug-show-list">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="fav.ico" alt="">
+                        <a href="#back-to-search" class="sug-text">
+                            last session search
+                        </a>
+                    </div>
+                    <div class="sug-show-list">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="fav.ico" alt="">
+                        <a href="#back-to-search" class="sug-text">
+                            last session
+                        </a>
+                    </div>
+                    <div class="sug-show-list">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="fav.ico" alt="">
+                        <a href="#back-to-search" class="sug-text">
+                            last search
+                        </a>
+                    </div>
+                    <div class="sug-show-list">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="fav.ico" alt="">
+                        <a href="#back-to-search" class="sug-text">
+                            session search
+                        </a>
+                    </div>
+                    <div class="sug-show-list">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="fav.ico" alt="">
+                        <a href="#back-to-search" class="sug-text">
+                            session search
+                        </a>
+                    </div>
+                    <div class="sug-show-list">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="fav.ico" alt="">
+                        <a href="#back-to-search" class="sug-text">
+                            session search
+                        </a>
+                    </div>
+                </div>
+            </div>
+
+            <div class="top-sug-cont">
+                <div class="top-sug">
+                    <span class="top-sug-title">Visited on results</span>
+                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                    <!-- remove code from below because that's an alternate image of icon -->
+                    <img src="fav.ico" alt="">
+                </div>
+
+                <div class="sug-show-list-cont">
+                    <div class="sug-show-list">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="fav.ico" alt="">
+                        <a href="#back-to-search" class="sug-text">
+                            last session search
+                        </a>
+                    </div>
+                    <div class="sug-show-list">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="fav.ico" alt="">
+                        <a href="#back-to-search" class="sug-text">
+                            last session
+                        </a>
+                    </div>
+                    <div class="sug-show-list">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="fav.ico" alt="">
+                        <a href="#back-to-search" class="sug-text">
+                            last search
+                        </a>
+                    </div>
+                    <div class="sug-show-list">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="fav.ico" alt="">
+                        <a href="#back-to-search" class="sug-text">
+                            session search
+                        </a>
+                    </div>
+                    <div class="sug-show-list">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="fav.ico" alt="">
+                        <a href="#back-to-search" class="sug-text">
+                            session search
+                        </a>
+                    </div>
+                    <div class="sug-show-list">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="fav.ico" alt="">
+                        <a href="#back-to-search" class="sug-text">
+                            session search
+                        </a>
+                    </div>
+                </div>
+            </div>
+
+            <div class="top-sug-cont">
+                <div class="top-sug">
+                    <span class="top-sug-title">Saved alternates</span>
+                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                    <!-- remove code from below because that's an alternate image of icon -->
+                    <img src="fav.ico" alt="">
+                </div>
+                <div class="sug-show-list-cont">
+                    <div class="sug-show-list">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="fav.ico" alt="">
+                        <a href="#back-to-search" class="sug-text">
+                            last session search
+                        </a>
+                    </div>
+                    <div class="sug-show-list">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="fav.ico" alt="">
+                        <a href="#back-to-search" class="sug-text">
+                            last session
+                        </a>
+                    </div>
+                    <div class="sug-show-list">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="fav.ico" alt="">
+                        <a href="#back-to-search" class="sug-text">
+                            last search
+                        </a>
+                    </div>
+                    <div class="sug-show-list">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="fav.ico" alt="">
+                        <a href="#back-to-search" class="sug-text">
+                            session search
+                        </a>
+                    </div>
+                    <div class="sug-show-list">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="fav.ico" alt="">
+                        <a href="#back-to-search" class="sug-text">
+                            session search
+                        </a>
+                    </div>
+                    <div class="sug-show-list">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="fav.ico" alt="">
+                        <a href="#back-to-search" class="sug-text">
+                            session search
+                        </a>
+                    </div>
+                </div>
+            </div>
+        </div>
+
+        <div class="small-search-bar">
+            <form action="load-more.html" method="get">
+                <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                <!-- remove code from below because that's an alternate image of icon -->
+                <img src="fav.ico" alt="">
+                <input type="text/search" placeholder="enter search" name="search result" id="search-input-small"
+                    class="search-input-small">
+            </form>
+        </div>
+
+        <!-- code of #apps & #profile -->
+
+    </div>
+
+    <div class="contents">
+        <div class="hero-cont">
+            <div class="heading">
+                <h1 class="head-title">
+                    welcome to our superb boookmarks
+                </h1>
+                <p class="head-subtitle">
+                    Now you can add new categories to our boookmarking. Have you know websites that might help
+                    peoples lot of...
+                </p>
+            </div>
+
+            <div class="category-submit-form-cont site-submit-form-cont">
+                <div class="form-collapse">
+                    <ion-icon name="search-outline" class="search-icon" id="collapse-icon"></ion-icon>
+                    <!-- remove code from below because that's an alternate image of icon -->
+                    <img src="fav.ico" alt="" id="collapse-icon">
+                </div>
+                <form action="load-more.html" method="get">
+                    <div class="ctgry-submit-form">
+                        <div class="ctgry-title">
+                            <h4 class="cate-title">category title</h4>
+                            <input type="text" placeholder="Enter category name" name="category title"
+                                id="cate-title-input" required>
+                        </div>
+                        <div class="new-site">
+                            <h4 class="cate-title">new site</h4>
+                            <input type="text" placeholder="e.g: www.website.com" name="category title"
+                                id="cate-title-input" required>
+                            <input type="text" placeholder="e.g: www.website.com" name="category title"
+                                id="cate-title-input">
+                            <input type="text" placeholder="e.g: www.website.com" name="category title"
+                                id="cate-title-input">
+                        </div>
+                        <button type="submit" id="ui-submit">submit</button>
+                    </div>
+
+                    <div class="ctrgy-user-img-upload">
+                        <div class="upload-cover-cont">
+                            <div class="up-cov-title">
+                                <h4 class="uc-title">upload cover image</h4>
+                                <p class="uc-subtitle">
+                                    Your cover image size must be 1440x500
+                                </p>
+                            </div>
+                            <div class="dragNdrop">
+                                <p class="uc-subtitle-2">
+                                    drag and drop or paste here or click to upload
+                                </p>
+                                <img src="fav.ico" alt="">
+                            </div>
+                        </div>
+                        <div class="upload-cateicon-cont">
+                            <div class="up-cov-title">
+                                <h4 class="uc-title">upload category icon</h4>
+                                <p class="uc-subtitle">
+                                    Your icon size should must be 48x48
+                                </p>
+                            </div>
+                            <div class="dragNdrop">
+                                <p class="uc-subtitle-2">
+                                    drag and drop or paste here or click to upload
+                                </p>
+                                <img src="fav.ico" alt="">
+                            </div>
+                        </div>
+                    </div>
+                </form>
+            </div>
+        </div>
+
+        <div class="browse-categories-cont">
+            <h3 class="categories-title">brows categories</h3>
+            <div class="categories">
+                <h5 class="ctgrs-heading">artificial intelligence</h5>
+                <div class="cards">
+                    <div class="card">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="logo.png" alt="">
+                        <a href="#book">book</a>
+                    </div>
+                    <div class="card">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="logo.png" alt="">
+                        <a href="#book">book</a>
+                    </div>
+                    <div class="card">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="logo.png" alt="">
+                        <a href="#book">book</a>
+                    </div>
+                    <div class="card">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="logo.png" alt="">
+                        <a href="#book">book</a>
+                    </div>
+                    <div class="card">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="logo.png" alt="">
+                        <a href="#book">book</a>
+                    </div>
+                </div>
+            </div>
+            <div class="categories">
+                <h5 class="ctgrs-heading">interaction design</h5>
+                <div class="cards">
+                    <div class="card">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="logo.png" alt="">
+                        <a href="#book">book</a>
+                    </div>
+                    <div class="card">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="logo.png" alt="">
+                        <a href="#book">book</a>
+                    </div>
+                    <div class="card">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="logo.png" alt="">
+                        <a href="#book">book</a>
+                    </div>
+                    <div class="card">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="logo.png" alt="">
+                        <a href="#book">book</a>
+                    </div>
+                    <div class="card">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="logo.png" alt="">
+                        <a href="#book">book</a>
+                    </div>
+                </div>
+            </div>
+            <div class="categories">
+                <h5 class="ctgrs-heading">web development</h5>
+                <div class="cards">
+                    <div class="card">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="logo.png" alt="">
+                        <a href="#book">book</a>
+                    </div>
+                    <div class="card">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="logo.png" alt="">
+                        <a href="#book">book</a>
+                    </div>
+                    <div class="card">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="logo.png" alt="">
+                        <a href="#book">book</a>
+                    </div>
+                    <div class="card">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="logo.png" alt="">
+                        <a href="#book">book</a>
+                    </div>
+                    <div class="card">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="logo.png" alt="">
+                        <a href="#book">book</a>
+                    </div>
+                </div>
+            </div>
+        </div>
+
+        <div class="footer-cont">
+            <div class="footer">
+                <img src="logo.png" alt="" class="footer-logo">
+                <div class="products-n-services">
+
+                    <div class="other-products">
+                        <h4 class="products-title">products</h4>
+                        <div class="products-list">
+                            <a href="#edukib.html">edukib </a>
+                            <a href="#vidokib.html">vidokib </a>
+                            <a href="#photozos.html">photozos </a>
+                            <a href="#musikib.html">musikib </a>
+                            <a href="#jobkib.html">jobkib </a>
+                        </div>
+                    </div>
+
+                    <div class="services">
+                        <h4 class="services-title">help & supports</h4>
+                        <div class="services-list">
+                            <a href="#services">services_1 </a>
+                            <a href="#services">services_2 </a>
+                            <a href="#services">services_3 </a>
+                            <a href="#services">services_4 </a>
+                            <a href="#services">services_5 </a>
+                        </div>
+                    </div>
+                    <div class="services">
+                        <h4 class="services-title">FAQ</h4>
+                        <div class="services-list">
+                            <a href="#services">services_1 </a>
+                            <a href="#services">services_2 </a>
+                            <a href="#services">services_3 </a>
+                            <a href="#services">services_4 </a>
+                            <a href="#services">services_5 </a>
+                        </div>
+                    </div>
+                    <div class="services">
+                        <h4 class="services-title">site map</h4>
+                        <div class="services-list">
+                            <a href="#services">services_1 </a>
+                            <a href="#services">services_2 </a>
+                            <a href="#services">services_3 </a>
+                            <a href="#services">services_4 </a>
+                            <a href="#services">services_5 </a>
+                        </div>
+                    </div>
+                    <div class="services">
+                        <h4 class="services-title">library</h4>
+                        <div class="services-list">
+                            <a href="#services">services_1 </a>
+                            <a href="#services">services_2 </a>
+                            <a href="#services">services_3 </a>
+                            <a href="#services">services_4 </a>
+                            <a href="#services">services_5 </a>
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+            <div class="footer-bottom">
+                <div class="our-documentation">
+                    <p class="copyrights">
+                        Copyrights © 2023 Boookib from
+                        <a href="#Metakib" class="company-link" style="padding-left: 4px;">
+                            Metakib
+                        </a>
+                    </p>
+                    <span class="divider">|</span>
+
+                    <a href="#Privacy_Policy" class="company-link">
+                        Privacy Policy
+                    </a>
+                    <span class="divider">|</span>
+
+                    <a href="#Security" class="company-link">
+                        Security
+                    </a>
+                    <span class="divider">|</span>
+
+                    <a href="#Terms_of_Service" class="company-link">
+                        Terms of Service
+                    </a>
+                </div>
+
+                <div class="social-networks">
+                    <a href="#facebook.com">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                    </a>
+                    <a href="#twitter.com">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                    </a>
+                    <a href="#instagram.com">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                    </a>
+                    <a href="#linkedin.com">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                    </a>
+                    <a href="#discord.com">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                    </a>
+                    <!-- remove code from below because that's an alternate image of icon -->
+                    <a href="#facebook.com"><img src="fav.ico" alt=""></a>
+                    <a href="#twitter.com"><img src="fav.ico" alt=""></a>
+                    <a href="#instagram.com"><img src="fav.ico" alt=""></a>
+                    <a href="#linkedin.com"><img src="fav.ico" alt=""></a>
+                    <a href="#discord.com"><img src="fav.ico" alt=""></a>
+                </div>
+            </div>
+        </div>
+
+    </div>
+
+</body>
+
+</html>
\ No newline at end of file
diff --git a/logo.png b/logo.png
new file mode 100644
index 0000000..64ea1b4
Binary files /dev/null and b/logo.png differ
diff --git a/media.min.css b/media.min.css
new file mode 100644
index 0000000..536770e
--- /dev/null
+++ b/media.min.css
@@ -0,0 +1,187 @@
+@media screen and (max-width: 1800px) {
+    .container {
+        height: 8px;
+        display: block;
+    }
+
+    .search-cont {
+        width: auto;
+    }
+
+    .input-mode {
+        width: auto;
+
+    }
+
+    .banner-image {
+        height: 280px;
+    }
+}
+
+@media screen and (max-width: 1600px) {
+    .container {
+        height: 8px;
+        display: block;
+    }
+
+    .search-cont {
+        width: auto;
+    }
+
+    .input-mode {
+        max-width: 660px;
+    }
+
+    .banner-image {
+        height: 260px;
+    }
+}
+
+@media screen and (max-width: 1200px) {
+    .container {
+        height: 8px;
+        display: block;
+    }
+
+    .search-cont {
+        width: auto;
+    }
+
+    .input-mode {
+        width: auto;
+    }
+
+    .banner-image {
+        height: 240px;
+    }
+}
+
+@media screen and (max-width: 1024px) {
+    .container {
+        height: 8px;
+        display: block;
+    }
+
+    .search-cont {
+        width: auto;
+    }
+
+    .input-mode {
+        width: auto;
+    }
+
+    .banner-image {
+        height: 220px;
+        max-height: 230px;
+    }
+
+    #submit,
+    .button {
+        font-size: 13px;
+    }
+}
+
+@media screen and (max-width: 926px) {
+    .container {
+        height: 8px;
+        display: block;
+    }
+
+    .header {
+        /* border: #0800ff 1px solid; */
+        display: flex;
+        gap: 24px;
+        align-items: center;
+        position: relative;
+        box-sizing: border-box;
+    }
+
+    .logo .logo-text {
+        display: none;
+        box-sizing: border-box;
+        gap: 32px;
+    }
+
+    .search-cont {
+        width: auto;
+    }
+
+    .input-mode {
+        width: auto;
+    }
+
+    .banner-image {
+        height: 200px;
+        max-height: 190px;
+    }
+}
+
+@media screen and (max-width: 832px) {
+
+    .search-cont {
+        width: auto;
+    }
+
+    ::-webkit-input-placeholder {
+        display: none;
+        /* color: transparent; */
+    }
+
+    .title,
+    .subtitle {
+        text-align: center;
+        position: relative;
+    }
+
+    .title {
+        font-size: 32px;
+        line-height: 40px;
+        width: 350px;
+    }
+
+    .subtitle {
+        font-size: 14px;
+        line-height: 22px;
+        width: 310px;
+    }
+
+    .banner-image {
+        height: 160px;
+        max-height: 140px;
+    }
+}
+
+@media screen and (max-width: 600px) {
+
+    .search-cont {
+        width: auto;
+    }
+
+    ::-webkit-input-placeholder {
+        display: none;
+        /* color: transparent; */
+    }
+
+    .title,
+    .subtitle {
+        text-align: center;
+        position: relative;
+    }
+
+    .title {
+        font-size: 32px;
+        line-height: 40px;
+        width: 350px;
+    }
+
+    .subtitle {
+        font-size: 14px;
+        line-height: 22px;
+        width: 310px;
+    }
+
+    .banner-image {
+        height: 100px;
+        max-height: 120px;
+    }
+}
\ No newline at end of file
diff --git a/newsletter-success.html b/newsletter-success.html
new file mode 100644
index 0000000..cb267b0
--- /dev/null
+++ b/newsletter-success.html
@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+
+    <title>Search - Boookib</title>
+
+    <link rel="stylesheet" href="innersearch.css">
+</head>
+<body>
+    <a href="index.html#submit-mail">back</a>
+</body>
+</html>
\ No newline at end of file
diff --git a/search.html b/search.html
new file mode 100644
index 0000000..0a3cd3c
--- /dev/null
+++ b/search.html
@@ -0,0 +1,610 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+
+    <title>Search - Boookib</title>
+
+    <link rel="icon" type="image/png" href="fav.ico">
+    <link rel="shortcut icon" type="image/x-icon" href="logo.png">
+
+    <link rel="stylesheet" href="innersearch.css">
+    <link rel="stylesheet" href="style.css">
+</head>
+
+<body data-new-gr-c-s-check-loaded="14.1030.0" data-gr-ext-installed="" cz-shortcut-listen="true">
+    <div class="container">
+        <div class="header">
+            <div class="logo"> <a href="index.html"><img src="logo.png" alt="">
+                    <span class="logo-text">boookib</span>
+                </a>
+            </div>
+
+            <div class="prev-btn">
+                <a href="index.html">
+                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                    <!-- remove code from below because that's an alternate image of icon -->
+                    <img src="fav.ico" alt=""></img>
+                    back
+                </a>
+            </div>
+
+            <div class="search-top-sug-cont">
+                <div class="top-sug-cont">
+                    <div class="top-sug">
+                        <span class="top-sug-title">Recent search</span>
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="fav.ico" alt="">
+                    </div>
+
+                    <div class="sug-show-list-cont">
+                        <div class="sug-show-list">
+                            <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                            <!-- remove code from below because that's an alternate image of icon -->
+                            <img src="fav.ico" alt="">
+                            <a href="#back-to-search" class="sug-text">
+                                last session search
+                            </a>
+                        </div>
+                        <div class="sug-show-list">
+                            <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                            <!-- remove code from below because that's an alternate image of icon -->
+                            <img src="fav.ico" alt="">
+                            <a href="#back-to-search" class="sug-text">
+                                last session
+                            </a>
+                        </div>
+                        <div class="sug-show-list">
+                            <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                            <!-- remove code from below because that's an alternate image of icon -->
+                            <img src="fav.ico" alt="">
+                            <a href="#back-to-search" class="sug-text">
+                                last search
+                            </a>
+                        </div>
+                        <div class="sug-show-list">
+                            <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                            <!-- remove code from below because that's an alternate image of icon -->
+                            <img src="fav.ico" alt="">
+                            <a href="#back-to-search" class="sug-text">
+                                session search
+                            </a>
+                        </div>
+                        <div class="sug-show-list">
+                            <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                            <!-- remove code from below because that's an alternate image of icon -->
+                            <img src="fav.ico" alt="">
+                            <a href="#back-to-search" class="sug-text">
+                                session search
+                            </a>
+                        </div>
+                        <div class="sug-show-list">
+                            <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                            <!-- remove code from below because that's an alternate image of icon -->
+                            <img src="fav.ico" alt="">
+                            <a href="#back-to-search" class="sug-text">
+                                session search
+                            </a>
+                        </div>
+                    </div>
+                </div>
+
+                <div class="top-sug-cont">
+                    <div class="top-sug">
+                        <span class="top-sug-title">Visited on results</span>
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="fav.ico" alt="">
+                    </div>
+
+                    <div class="sug-show-list-cont">
+                        <div class="sug-show-list">
+                            <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                            <!-- remove code from below because that's an alternate image of icon -->
+                            <img src="fav.ico" alt="">
+                            <a href="#back-to-search" class="sug-text">
+                                last session search
+                            </a>
+                        </div>
+                        <div class="sug-show-list">
+                            <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                            <!-- remove code from below because that's an alternate image of icon -->
+                            <img src="fav.ico" alt="">
+                            <a href="#back-to-search" class="sug-text">
+                                last session
+                            </a>
+                        </div>
+                        <div class="sug-show-list">
+                            <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                            <!-- remove code from below because that's an alternate image of icon -->
+                            <img src="fav.ico" alt="">
+                            <a href="#back-to-search" class="sug-text">
+                                last search
+                            </a>
+                        </div>
+                        <div class="sug-show-list">
+                            <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                            <!-- remove code from below because that's an alternate image of icon -->
+                            <img src="fav.ico" alt="">
+                            <a href="#back-to-search" class="sug-text">
+                                session search
+                            </a>
+                        </div>
+                        <div class="sug-show-list">
+                            <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                            <!-- remove code from below because that's an alternate image of icon -->
+                            <img src="fav.ico" alt="">
+                            <a href="#back-to-search" class="sug-text">
+                                session search
+                            </a>
+                        </div>
+                        <div class="sug-show-list">
+                            <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                            <!-- remove code from below because that's an alternate image of icon -->
+                            <img src="fav.ico" alt="">
+                            <a href="#back-to-search" class="sug-text">
+                                session search
+                            </a>
+                        </div>
+                    </div>
+                </div>
+
+                <div class="top-sug-cont">
+                    <div class="top-sug">
+                        <span class="top-sug-title">Saved alternates</span>
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="fav.ico" alt="">
+                    </div>
+                    <div class="sug-show-list-cont">
+                        <div class="sug-show-list">
+                            <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                            <!-- remove code from below because that's an alternate image of icon -->
+                            <img src="fav.ico" alt="">
+                            <a href="#back-to-search" class="sug-text">
+                                last session search
+                            </a>
+                        </div>
+                        <div class="sug-show-list">
+                            <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                            <!-- remove code from below because that's an alternate image of icon -->
+                            <img src="fav.ico" alt="">
+                            <a href="#back-to-search" class="sug-text">
+                                last session
+                            </a>
+                        </div>
+                        <div class="sug-show-list">
+                            <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                            <!-- remove code from below because that's an alternate image of icon -->
+                            <img src="fav.ico" alt="">
+                            <a href="#back-to-search" class="sug-text">
+                                last search
+                            </a>
+                        </div>
+                        <div class="sug-show-list">
+                            <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                            <!-- remove code from below because that's an alternate image of icon -->
+                            <img src="fav.ico" alt="">
+                            <a href="#back-to-search" class="sug-text">
+                                session search
+                            </a>
+                        </div>
+                        <div class="sug-show-list">
+                            <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                            <!-- remove code from below because that's an alternate image of icon -->
+                            <img src="fav.ico" alt="">
+                            <a href="#back-to-search" class="sug-text">
+                                session search
+                            </a>
+                        </div>
+                        <div class="sug-show-list">
+                            <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                            <!-- remove code from below because that's an alternate image of icon -->
+                            <img src="fav.ico" alt="">
+                            <a href="#back-to-search" class="sug-text">
+                                session search
+                            </a>
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+            <!-- code of #apps & #profile -->
+
+        </div>
+
+        <div class="contents">
+            <div class="ex-search-bar-cont">
+                <div class="ex-search-bar">
+                    <form action="search.html" method="get" target="_self" class="ex-search-form">
+                        <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <img src="fav.ico" alt="">
+                        <input type="text/mail" name="search-result" placeholder="search things now..."
+                            class="input-search" id="input-search">
+                    </form>
+                </div>
+
+                <div class="search-type-label">
+                    <div class="type-label">
+                        <div class="s-label">
+                            <input type="checkbox" name="checkbox" id="checked" role="checkbox" aria-label="false">free
+                        </div>
+                        <div class="s-label">
+                            <input type="checkbox" name="checkbox" id="checked" role="checkbox" aria-label="false">free
+                        </div>
+                        <div class="s-label">
+                            <input type="checkbox" name="checkbox" id="checked" role="checkbox" aria-label="false">free
+                        </div>
+                        <div class="s-label">
+                            <input type="checkbox" name="checkbox" id="checked" role="checkbox" aria-label="false">free
+                        </div>
+                        <div class="s-label">
+                            <input type="checkbox" name="checkbox" id="checked" role="checkbox" aria-label="false">free
+                        </div>
+                    </div>
+                    <div class="s-label">
+                        trending
+                        <input type="checkbox" name="checkbox" id="checked" role="checkbox" aria-label="false">
+                    </div>
+                </div>
+            </div>
+
+            <div class="expanded-cards-cont">
+                <!-- <h1 class="ex-title">
+                    let's discover us and made life much easier
+                </h1> -->
+                <div class="ex-cards-cont">
+                    <div class="ex-cards">
+                        <div class="ex-card">
+                            <a href="#figma">
+                                <div class="ex-thumb">
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </a>
+                            <div class="ex-desc-cont">
+                                <div class="ex-desc">
+                                    <a href="#w3chools">
+                                        <h4 class="title-4">w3schools</h4>
+                                    </a>
+                                    <p class="ex-short-bio">
+                                        lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                        dolor
+                                        sit amet quer lorem ipsum dolor sit amet quer
+                                    </p>
+                                </div>
+                                <div class="ex-categ">
+                                    <a href="#free" class="ex-label">free</a>
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </div>
+                        </div>
+                        <div class="ex-card">
+                            <a href="#figma">
+                                <div class="ex-thumb">
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </a>
+                            <div class="ex-desc-cont">
+                                <div class="ex-desc">
+                                    <a href="#w3chools">
+                                        <h4 class="title-4">w3schools</h4>
+                                    </a>
+                                    <p class="ex-short-bio">
+                                        lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                        dolor
+                                        sit amet quer lorem ipsum dolor sit amet quer
+                                    </p>
+                                </div>
+                                <div class="ex-categ">
+                                    <a href="#free" class="ex-label">free</a>
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </div>
+                        </div>
+                        <div class="ex-card">
+                            <a href="#figma">
+                                <div class="ex-thumb">
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </a>
+                            <div class="ex-desc-cont">
+                                <div class="ex-desc">
+                                    <a href="#w3chools">
+                                        <h4 class="title-4">w3schools</h4>
+                                    </a>
+                                    <p class="ex-short-bio">
+                                        lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                        dolor
+                                        sit amet quer lorem ipsum dolor sit amet quer
+                                    </p>
+                                </div>
+                                <div class="ex-categ">
+                                    <a href="#free" class="ex-label">free</a>
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </div>
+                        </div>
+                        <div class="ex-card">
+                            <a href="#figma">
+                                <div class="ex-thumb">
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </a>
+                            <div class="ex-desc-cont">
+                                <div class="ex-desc">
+                                    <a href="#w3chools">
+                                        <h4 class="title-4">w3schools</h4>
+                                    </a>
+                                    <p class="ex-short-bio">
+                                        lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                        dolor
+                                        sit amet quer lorem ipsum dolor sit amet quer
+                                    </p>
+                                </div>
+                                <div class="ex-categ">
+                                    <a href="#free" class="ex-label">free</a>
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                    <div class="ex-cards">
+                        <div class="ex-card">
+                            <a href="#figma">
+                                <div class="ex-thumb">
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </a>
+                            <div class="ex-desc-cont">
+                                <div class="ex-desc">
+                                    <a href="#w3chools">
+                                        <h4 class="title-4">w3schools</h4>
+                                    </a>
+                                    <p class="ex-short-bio">
+                                        lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                        dolor
+                                        sit amet quer lorem ipsum dolor sit amet quer
+                                    </p>
+                                </div>
+                                <div class="ex-categ">
+                                    <a href="#free" class="ex-label">free</a>
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </div>
+                        </div>
+                        <div class="ex-card">
+                            <a href="#figma">
+                                <div class="ex-thumb">
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </a>
+                            <div class="ex-desc-cont">
+                                <div class="ex-desc">
+                                    <a href="#w3chools">
+                                        <h4 class="title-4">w3schools</h4>
+                                    </a>
+                                    <p class="ex-short-bio">
+                                        lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                        dolor
+                                        sit amet quer lorem ipsum dolor sit amet quer
+                                    </p>
+                                </div>
+                                <div class="ex-categ">
+                                    <a href="#free" class="ex-label">free</a>
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </div>
+                        </div>
+                        <div class="ex-card">
+                            <a href="#figma">
+                                <div class="ex-thumb">
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </a>
+                            <div class="ex-desc-cont">
+                                <div class="ex-desc">
+                                    <a href="#w3chools">
+                                        <h4 class="title-4">w3schools</h4>
+                                    </a>
+                                    <p class="ex-short-bio">
+                                        lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                        dolor
+                                        sit amet quer lorem ipsum dolor sit amet quer
+                                    </p>
+                                </div>
+                                <div class="ex-categ">
+                                    <a href="#free" class="ex-label">free</a>
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </div>
+                        </div>
+                        <div class="ex-card">
+                            <a href="#figma">
+                                <div class="ex-thumb">
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </a>
+                            <div class="ex-desc-cont">
+                                <div class="ex-desc">
+                                    <a href="#w3chools">
+                                        <h4 class="title-4">w3schools</h4>
+                                    </a>
+                                    <p class="ex-short-bio">
+                                        lorem ipsum dolor sit amet quer lorem ipsum dolor sit amet quer lorem ipsum
+                                        dolor
+                                        sit amet quer lorem ipsum dolor sit amet quer
+                                    </p>
+                                </div>
+                                <div class="ex-categ">
+                                    <a href="#free" class="ex-label">free</a>
+                                    <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                                    <!-- remove code from below because that's an alternate image of icon -->
+                                    <img src="logo.png" alt="">
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+
+                    <a href="load-more.html">
+                        <div class="cta-load">
+                            load more
+                            <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                            <!-- remove code from below because that's an alternate image of icon -->
+                            <img src="logo.png" alt="">
+                        </div>
+                    </a>
+                </div>
+            </div>
+
+            <div class="footer-cont">
+                <div class="footer">
+                    <img src="logo.png" alt="" class="footer-logo">
+                    <div class="products-n-services">
+
+                        <div class="other-products">
+                            <h4 class="products-title">products</h4>
+                            <div class="products-list">
+                                <a href="#edukib.html">edukib </a>
+                                <a href="#vidokib.html">vidokib </a>
+                                <a href="#photozos.html">photozos </a>
+                                <a href="#musikib.html">musikib </a>
+                                <a href="#jobkib.html">jobkib </a>
+                            </div>
+                        </div>
+
+                        <div class="services">
+                            <h4 class="services-title">help & supports</h4>
+                            <div class="services-list">
+                                <a href="#services">services_1 </a>
+                                <a href="#services">services_2 </a>
+                                <a href="#services">services_3 </a>
+                                <a href="#services">services_4 </a>
+                                <a href="#services">services_5 </a>
+                            </div>
+                        </div>
+                        <div class="services">
+                            <h4 class="services-title">FAQ</h4>
+                            <div class="services-list">
+                                <a href="#services">services_1 </a>
+                                <a href="#services">services_2 </a>
+                                <a href="#services">services_3 </a>
+                                <a href="#services">services_4 </a>
+                                <a href="#services">services_5 </a>
+                            </div>
+                        </div>
+                        <div class="services">
+                            <h4 class="services-title">site map</h4>
+                            <div class="services-list">
+                                <a href="#services">services_1 </a>
+                                <a href="#services">services_2 </a>
+                                <a href="#services">services_3 </a>
+                                <a href="#services">services_4 </a>
+                                <a href="#services">services_5 </a>
+                            </div>
+                        </div>
+                        <div class="services">
+                            <h4 class="services-title">library</h4>
+                            <div class="services-list">
+                                <a href="#services">services_1 </a>
+                                <a href="#services">services_2 </a>
+                                <a href="#services">services_3 </a>
+                                <a href="#services">services_4 </a>
+                                <a href="#services">services_5 </a>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+
+                <div class="footer-bottom">
+                    <div class="our-documentation">
+                        <p class="copyrights">
+                            Copyrights © 2023 Boookib from
+                            <a href="" class="company-link" style="padding-left: 4px;">
+                                Metakib
+                            </a>
+                        </p>
+                        <span class="divider">|</span>
+
+                        <a href="#Privacy_Policy" class="company-link">
+                            Privacy Policy
+                        </a>
+                        <span class="divider">|</span>
+
+                        <a href="#Security" class="company-link">
+                            Security
+                        </a>
+                        <span class="divider">|</span>
+
+                        <a href="#Terms_of_Service" class="company-link">
+                            Terms of Service
+                        </a>
+                    </div>
+
+                    <div class="social-networks">
+                        <a href="#facebook.com">
+                            <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        </a>
+                        <a href="#twitter.com">
+                            <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        </a>
+                        <a href="#instagram.com">
+                            <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        </a>
+                        <a href="#linkedin.com">
+                            <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        </a>
+                        <a href="#discord.com">
+                            <ion-icon name="search-outline" class="search-icon"></ion-icon>
+                        </a>
+                        <!-- remove code from below because that's an alternate image of icon -->
+                        <a href="#facebook.com"><img src="fav.ico" alt=""></a>
+                        <a href="#twitter.com"><img src="fav.ico" alt=""></a>
+                        <a href="#instagram.com"><img src="fav.ico" alt=""></a>
+                        <a href="#linkedin.com"><img src="fav.ico" alt=""></a>
+                        <a href="#discord.com"><img src="fav.ico" alt=""></a>
+                    </div>
+                </div>
+            </div>
+
+        </div>
+
+    </div>
+
+</body>
+
+</html>
\ No newline at end of file
diff --git a/style.css b/style.css
new file mode 100644
index 0000000..53b489d
--- /dev/null
+++ b/style.css
@@ -0,0 +1,831 @@
+html,
+a {
+    text-decoration: none;
+    outline: none;
+    /* color: #0f0c2c; */
+    letter-spacing: 0.7px;
+}
+
+body {
+    background-color: #f3f4fe;
+    margin: 0;
+    padding: 0px 0px 0px 0px;
+    font-family: 'mont';
+    text-decoration: none;
+}
+
+.container {
+    /* height: 100%; */
+    /* display: block; */
+    display: block;
+}
+
+.header,
+.contents {
+    padding: 0px 40px 0px 40px;
+}
+
+.header {
+    background-color: #ffffff;
+    height: 104px;
+    /* width: 100%; */
+    padding: 0px 40px 0px 40px;
+    /* border: #0800ff 1px solid; */
+    display: flex;
+    gap: 32px;
+    align-items: center;
+    position: relative;
+    box-sizing: border-box;
+    flex-direction: row;
+    flex-wrap: nowrap;
+}
+
+.logo a {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    box-sizing: border-box;
+    gap: 12px;
+    text-decoration: none;
+}
+
+.logo .logo-text {
+    color: #880ff8;
+    font-family: mont;
+    font-size: 32px;
+    font-weight: 800;
+    text-transform: capitalize;
+}
+
+.logo .logo-text:hover {
+    color: #880ff8;
+}
+
+.logo img {
+    width: 32px;
+}
+
+
+/* search */
+.search-cont {
+    padding: 8px 8px;
+    width: 660px;
+    border: red 2px solid;
+    border-radius: 48px;
+    box-sizing: border-box;
+}
+
+.search-cont:hover {
+    border: 2px rgb(119, 119, 255) solid;
+}
+
+.search-cont:focus-within {
+    border: 2px rgb(0, 201, 97) solid;
+    box-shadow: 0px 0px 12px -5px rgb(0, 106, 255);
+}
+
+.form-cont {
+    display: flex;
+    position: relative;
+    align-items: center;
+    gap: 8px;
+}
+
+.search-icon {
+    color: red;
+    font-size: 24px;
+}
+
+.input-mode {
+    /* color: rgb(156, 156, 156); */
+    background-color: transparent;
+    font-size: 14px;
+    width: 660px;
+    border: none;
+    outline: none;
+    position: relative;
+}
+
+.input-mode:focus-within {
+    color: rgb(56, 56, 56);
+    font-size: 14px;
+    border: none;
+    outline: none;
+}
+
+
+/* nav right */
+.documentation {
+    display: flex;
+    position: relative;
+    align-items: center;
+    flex-direction: row;
+    gap: 24px;
+}
+
+.documentation:hover {
+    transition: 2s ease red;
+}
+
+.target-link,
+.target-link a {
+    color: #2d2b43;
+    font-size: 16px;
+    font-weight: 300;
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    text-transform: capitalize;
+    text-decoration: none;
+    padding: 10px 0px 10px 0px;
+    cursor: pointer;
+    border-bottom: #0800e200 2px solid;
+}
+
+.target-link a:hover {
+    color: #0008ff;
+    transition: 20s ease red;
+    /* animation: bottommark 5s ease-in; */
+    padding: 10px 0px 10px 0px;
+    border-bottom: #0008ff 2px solid;
+}
+
+.target-link a:focus-within {
+    color: #880ff8;
+    border-bottom: #880ff8 2px solid;
+}
+
+
+
+/* app list */
+.apps-cont {
+    color: red;
+}
+
+.app-list {
+    display: none;
+}
+
+
+
+/* contents */
+.contents {
+    display: block;
+    margin-top: 0px;
+    padding: 0px;
+    display: flex;
+    flex-direction: column;
+    gap: 96px;
+}
+
+.hero {
+    display: block;
+    position: relative;
+    background-color: #fff3ed;
+    width: 100%;
+    height: 630px;
+    padding: 0px;
+}
+
+.hero-img {
+    display: block;
+    position: relative;
+    float: right;
+    margin-top: calc(10vh);
+}
+
+.hero-img-b,
+.hero-img-t {
+    width: 300px;
+    box-shadow: #02074139 8px 8px 15px -5px;
+    border-radius: 32px;
+}
+
+.hero-img-b {
+    margin-left: calc(160vh + 5vh - 20vh);
+    margin-top: calc(-40vh + 0vh + 45vh);
+}
+
+.hero-img-t {
+    margin-left: calc(160vh - 23vh - 20vh);
+    margin-top: calc(-80vh + 5vh + 10vh);
+}
+
+.hero-text {
+    display: flex;
+    flex-direction: column;
+    position: relative;
+    gap: 8px;
+    padding: 0px;
+    margin: 90px 0px 0px 0px;
+    left: calc(10% - 90px);
+}
+
+.title {
+    color: #553800;
+    font-size: 48px;
+    line-height: 56px;
+    text-transform: capitalize;
+    font-weight: 700;
+    width: 510px;
+}
+
+.subtitle {
+    color: #1e1e31a1;
+    font-family: Arial, Helvetica, sans-serif;
+    font-size: 16px;
+    line-height: 24px;
+    text-transform: none;
+    font-weight: 300;
+    width: 560px;
+}
+
+.hero-cta {
+    display: flex;
+    flex-direction: row;
+    gap: 24px;
+    padding: 0px;
+    margin-left: calc(10% - 90px);
+}
+
+a .cta {
+    padding: 24px 32px 24px 16px !important;
+    background-color: #ffb92e;
+}
+
+a .cta-noicon {
+    padding: 24px 32px;
+    background-color: transparent;
+}
+
+a .cta,
+a .cta-noicon {
+    display: flex;
+    gap: 16px;
+    cursor: pointer;
+    outline: none;
+    border-radius: 4px;
+    font-size: 16px;
+    font-weight: 600;
+    line-height: 24px;
+    text-transform: capitalize;
+    color: #492100;
+    border: none;
+}
+
+a .cta:hover,
+a .cta-noicon:hover {
+    background-color: #ffaa00;
+    border: none;
+}
+
+.cta img {
+    width: 24px;
+}
+
+
+/* cards */
+.cards-cont {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    row-gap: 32px;
+    box-sizing: border-box;
+    padding: 0px 40px 0px 40px;
+
+}
+
+.cards {
+    display: flex;
+    flex-direction: row;
+    gap: 32px;
+    width: 100%;
+    box-sizing: border-box;
+}
+
+.card {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    gap: 24px;
+    background-color: rgb(250, 249, 255);
+    padding: 16px 20px;
+    height: auto;
+    width: 100%;
+    border-radius: 24px;
+    font-size: 20px;
+    line-height: 28px;
+    font-weight: 600;
+    text-transform: capitalize;
+    box-shadow: 0px 20px 40px -15px #cfcfe2;
+}
+
+.card:hover {
+    color: rgb(238, 255, 0);
+    height: 100%;
+    text-decoration: none;
+    box-shadow: 0px 40px 80px -15px #c0c0d1;
+}
+
+.card a {
+    width: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+.card a:hover {
+    color: red;
+}
+
+.card img {
+    width: 80px;
+    height: 80px;
+}
+
+.cta-load {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: center;
+    gap: 8px;
+    height: 30px;
+    width: fit-content;
+    background-color: rgb(255, 255, 255);
+    padding: 24px 48px;
+    border-radius: 12px;
+    border: 2px rgba(0, 0, 0, 0) solid;
+    margin-top: 10%;
+    text-transform: capitalize;
+    font-size: 16px;
+}
+
+.cta-load:hover {
+    color: red;
+    box-shadow: 0px 0px 15px 0px rgb(221, 219, 240);
+}
+
+.cta-load img {
+    width: 24px;
+}
+
+
+/* target banner */
+.target-banner {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    text-align: center;
+    position: relative;
+    background-color: #f6cc793b;
+    width: auto;
+    height: 800px;
+    padding: 0px;
+}
+
+.banner-title {
+    color: #12121b;
+    font-size: 36px;
+    line-height: 44px;
+    text-transform: capitalize;
+    font-weight: 700;
+    width: 510px;
+}
+
+.banner {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    /* position: relative; */
+    gap: 8px;
+    margin: 0px 0px 0px 0px;
+    padding: 30px 0px;
+    width: 1440px;
+    /* background-color: #ffffff; */
+}
+
+.banner-image {
+    width: auto;
+    height: 300px;
+}
+
+.banner-image-x {
+    width: 300px;
+    rotate: 45deg;
+    float: left;
+    margin-left: calc(-80% - 5px);
+}
+
+.banner-image-y {
+    width: 300px;
+    rotate: -45deg;
+    float: right;
+    margin-left: calc(80% - 5px);
+    margin-top: 145px;
+}
+
+.banner-subtitle {
+    color: #1e1e31a1;
+    font-family: Arial, Helvetica, sans-serif;
+    font-size: 16px;
+    line-height: 24px;
+    text-transform: none;
+    font-weight: 300;
+    width: 560px;
+}
+
+.banner-cta {
+    display: flex;
+    color: #ffffff;
+    background-color: rgb(0, 68, 254);
+    margin-top: -140px;
+}
+
+.banner-cta:hover {
+    background-color: #1a57ff;
+    color: white;
+    border: #1a57ff 2px solid;
+}
+
+
+/* expanded-card */
+.expanded-cards-cont {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: flex-start;
+    gap: 24px;
+    background-color: transparent;
+    padding: 10px 40px;
+    height: auto;
+    width: auto;
+    border-radius: 24px;
+    font-size: 32px;
+    line-height: 40px;
+    font-weight: 600;
+    text-transform: capitalize;
+    /* box-shadow: 0px 20px 40px -15px #cfcfe2; */
+}
+
+.ex-title {
+    display: flex;
+    flex-direction: column;
+    position: relative;
+    gap: 8px;
+    padding: 0px;
+    width: 500px;
+    /* margin: 90px 0px 0px 0px; */
+    /* left: calc(-25% - 90px); */
+    font-size: 32px;
+    float: left;
+}
+
+.ex-cards-cont {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 32px;
+}
+
+.ex-cards {
+    display: flex;
+    flex-direction: row;
+    gap: 32px;
+}
+
+.ex-card {
+    display: flex;
+    flex-direction: column;
+    width: auto;
+    background-color: #f5f4ff;
+    border-radius: 24px;
+    box-sizing: border-box;
+    box-shadow: 0px 8px 25px -8px rgb(155, 158, 171);
+    align-content: space-between;
+}
+
+.ex-card:hover {
+    box-shadow: 0px 20px 25px -8px rgb(168, 173, 188);
+}
+
+.ex-thumb {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: auto;
+    height: 160px;
+    background-color: red;
+    align-content: center;
+    border-radius: 24px 24px 0px 0px;
+}
+
+.ex-thumb:hover {
+    background-color: rgb(132, 0, 0);
+}
+
+.ex-thumb img {
+    width: 32px;
+    height: 32px;
+}
+
+.ex-desc-cont {
+    display: flex;
+    flex-direction: column;
+    padding: 20px;
+}
+
+.ex-desc {
+    display: flex;
+    flex-direction: column;
+    justify-content: flex-start;
+    align-items: flex-start;
+    flex-wrap: nowrap;
+    gap: 0px;
+}
+
+.title-4 {
+    display: flex;
+    font-size: 16px;
+    line-height: 24px;
+    font-weight: 600;
+    width: 100%;
+    height: 10px;
+}
+
+a .title-4 {
+    color: red;
+    height: auto;
+}
+
+a .title-4:hover {
+    color: rgb(30, 0, 255);
+}
+
+.ex-short-bio {
+    display: flex;
+    width: auto;
+    font-size: 13px;
+    line-height: 21px;
+    font-weight: 400;
+}
+
+.ex-categ {
+    display: flex;
+    flex-direction: row;
+    flex-wrap: nowrap;
+    justify-content: space-between;
+    align-items: center;
+    width: auto;
+    padding: 0;
+    margin: 0;
+}
+
+.ex-categ img {
+    height: 20px;
+    width: 20px;
+}
+
+.ex-label,
+.s-label {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: center;
+    gap: 12px;
+    background-color: #0fa958;
+    color: #ffffff;
+    padding: 8px 16px;
+    height: fit-content;
+    width: fit-content;
+    border: 0px red solid;
+    border-radius: 32px;
+    font-size: 13px;
+    text-transform: capitalize;
+    line-height: 18px;
+    font-weight: 400;
+}
+
+.ex-label:hover,
+.s-label:hover {
+    background-color: #07994b;
+}
+
+
+/* newsletter subscription */
+.newsletter-cont {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    gap: 36px;
+    background-color: #b7b9f0;
+    padding: 64px;
+}
+
+.newsletter-title {
+    font-size: 24px;
+    line-height: 32px;
+    font-weight: 600;
+    width: 500px;
+    text-align: center;
+}
+
+#subscribe,
+.subscribe-form {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: center;
+    gap: 24px;
+}
+
+#input-mail,
+.input {
+    padding: 16px 24px;
+    border: 2px transparent solid;
+    outline: none;
+    border-radius: 12px;
+    width: fit-content;
+    font-size: 16px;
+}
+
+#input-mail[placeholder='yourmail@example.com'],
+.input[placeholder='yourmail@example.com'],
+#input-search[placeholder='Search thing'],
+.input[placeholder='enter mail'],
+#input-search[placeholder='Enter search'],
+.input[placeholder='Enter search'],
+.input[placeholder='Search thing'] {
+    font-size: 16px;
+    line-height: 24px;
+}
+
+#input-mail:hover,
+.input:hover {
+    border: 2px green solid;
+    /* font-size: 16px; */
+}
+
+#input-mail::after,
+#input-mail:focus,
+#input-mail:focus-within,
+.input::after,
+.input:focus,
+.input:focus-within {
+    box-shadow: 0px 0px 8px 0px green;
+    background-color: #fff;
+    color: rgb(8, 9, 56);
+}
+
+#submit,
+.button {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    padding: 16px 24px;
+    gap: 20px;
+    border-radius: 12px;
+    border: none;
+    outline: none;
+    cursor: pointer;
+    font-size: 16px;
+    line-height: 24px;
+    text-transform: capitalize;
+    font-weight: 400;
+    background-color: #ffffff;
+}
+
+#submit:hover,
+.button:hover {
+    background-color: #000;
+    color: #fff;
+}
+
+
+/* footer */
+.footer-cont {
+    display: flex;
+    flex-direction: column;
+    align-items: flex-start;
+    gap: 72px;
+    padding: 60px 0px 0px 40px;
+    align-content: flex-start;
+    background-color: #ffffff;
+}
+
+.footer {
+    display: flex;
+    flex-direction: row;
+    align-items: flex-start;
+    gap: 64px;
+}
+
+.footer-logo,
+img.footer-logo,
+.footer-cont img[src='logo.png'] {
+    width: 40px;
+    height: 40px;
+    position: relative;
+    padding-top: 20px;
+}
+
+.products-n-services {
+    display: flex;
+    flex-direction: row;
+    gap: 32px;
+}
+
+.other-products {
+    font-weight: 600;
+}
+
+.other-products,
+.services {
+    display: flex;
+    flex-direction: column;
+    justify-content: flex-start;
+    align-items: flex-start;
+}
+
+.products-title,
+.services-title {
+    display: flex;
+    text-transform: capitalize;
+    font-weight: 600;
+    font-size: 15px;
+}
+
+.products-list,
+.services-list {
+    display: flex;
+    flex-direction: column;
+    gap: 12px;
+    font-size: 13px;
+    text-transform: capitalize;
+}
+
+.products-list a,
+.services-list a,
+.company-link {
+    color: #2d2b43;
+}
+
+.products-list a:hover,
+.services-list a:hover,
+.company-link:hover {
+    color: rgb(34, 0, 255);
+}
+
+/* .services {
+    display: flex;
+    flex-direction: column;
+}
+
+.services-title {
+    display: flex;
+}
+
+.services-list {
+    display: flex;
+    flex-direction: column;
+} */
+
+.footer-bottom {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: center;
+    gap: 32px;
+    padding-bottom: 3%;
+}
+
+.our-documentation {
+    display: flex;
+    flex-direction: row;
+    gap: 48px;
+    align-items: center;
+    font-size: 13px;
+}
+
+.copyrights {
+    color: #2c2b41;
+    display: flex;
+}
+
+.divider {
+    display: flex;
+    color: #908dae;
+}
+
+.company-link {
+    display: flex;
+}
+
+.social-networks {
+    display: flex;
+    gap: 24px;
+}
\ No newline at end of file
